Molto spesso accade di vedere bei siti sviluppati su WordPress ma, purtroppo, per niente ottimizzati, con performance in caricamento di pagine e velocità davvero raccapriccianti. È necessario agire su diversi aspetti del sito per migliorare questi dati. Vediamo quindi come ottimizzare un sito web in WordPress e fornire una migliore esperienza utente.

Le cause che rendono un sito impossibile da navigare

Come anticipato nell’introduzione, i fattori che interessano la velocità di un sito e i suoi tempi di caricamento sono, principalmente: hosting, database, immagini, cache e altro ancora. In dettaglio:

• Scelta dell’hosting: scegliere un provider per il proprio sito o per il sito del proprio cliente, non è un aspetto da lasciare al caso: se da un lato è vero che si tende a ottimizzare i costi, risparmiare eccessivamente sull’hosting (in termini di piano d’acquisto e qualità del provider) può minare sin da subito la riuscita del progetto. Ad analisi del progetto fatta, bisogna scegliere con cura a chi affidarsi;
• Database non ottimizzato: specialmente su WordPress (ma ciò accade con tutti gli altri CMS), alcuni tendono ad installare diversi plugin sull’installazione live soltanto per provarli; oppure, se sono alla ricerca di un plugin che svolge una determinata funzione, lo installano senza curarsi di leggerne la documentazione. Questa è una pratica decisamente deleteria per l’integrità del database in quanto, oltre a creare eventuali incompatibilità con quanto già esistente, sporca il database con dati inutili;
• Dimensioni delle immagini: anche se ormai abbiamo a che fare con risoluzioni altissime (basti pensare al 4k) e connessioni ultra veloci, dobbiamo sempre tenere a mente che siamo sul web. Caricare immagini “pesanti” (passatemi il termine) non contribuisce ad avere un bel sito, anzi al contrario: è un repellente per gli utenti;
• Cache: fino a qualche tempo fa non era necessario, ma oggi – proprio per evitare tempi morti – è una buona pratica installare plugin di caching, sfruttare la cache del browser e quella del server su cui siamo ospitati. Anche il Codex di WordPress ci invita a implementare pratiche ci caching per migliorare velocemente le performance del nostro sito.

Analisi del sito: gli strumenti essenziali

Innanzi tutto, prima di iniziare a lavorare sull’ottimizzazione, bisogna capire quali sono le criticità del sito in esame; pertanto occorre fare un’analisi attraverso due importanti strumenti, le cui versioni base sono del tutto gratuite:

• GTMetrix
• Pingdom Speed Tools

GTMetrix

Questo potente strumento, sviluppato dalla società canadese GT.net per i propri clienti, esegue un’analisi del sito per monitorarne le performance. Già con la versione base abbiamo a nostra disposizione una serie di risultati ben strutturati, misurando la velocità del sito sia attraverso Google Page Speed che con YSlow.

Effettuare la misurazione è semplice: è sufficiente scegliere il server (località) da cui si desidera testare il proprio URL. La posizione è molto importante in quanto minore è la latenza, minore è il tempo di caricamento; dopo di che scriviamo l’URL nell’apposito campo e premiamo invio. In qualche secondo la piattaforma tirerà fuori i report con gli annessi e connessi.

Pingdom Speed Tools

Misurare la velocità di un sito con Pingdom risulta molto utile in quanto questo strumento, sviluppato in Svezia, fornisce quelli che vengono chiamati “risultati a cascata” (waterfall in Inglese). Quando inseriamo l’URL che vogliamo analizzare e il server da cui vogliamo effettuare la misurazione, Pingdom restituisce un primo risultato riepilogativo, dove vengono indicati tempo di caricamento della pagina, dimensioni della stessa e richieste HTTP.

Eseguendo altri test potrebbe capitare che il valore cambi: ciò è dovuto alla caching DNS, caching CDN e caching di WordPress. Per questo motivo, è consigliabile eseguire diversi test prima di prendere per buoni i risultati proposti.

Scorrendo la pagina dei risultati sarà possibile visualizzare i diversi risultati per i diversi parametri misurati.

Lascio l’analisi approfondita di GTMetrix e Pingdom per i prossimi articoli in materia, altrimenti perdiamo di vista il nostro obiettivo, ovvero come ottimizzare un sito web in WordPress.

Ottimizzare un sito web in WordPress

Al contrario di quanto si possa pensare, ottimizzare un sito web in WordPress non è un lavoro immediato. Se vogliamo ottenere buoni risultati, dobbiamo operare con cura sui singoli aspetti elencati.

Scelta dell’hosting

La scelta dell’hosting, naturalmente, varia da progetto a progetto e non può e non deve essere dettata soltanto dal fattore denaro. Abbandonate hosting che non mettono a disposizione il cPanel o che non ve lo propongono con i pacchetti economici: il cPanel è una risorsa fondamentale per tenere sotto controllo il vostro spazio. L’ottimizzazione va fatta anche da lì, attivando la compressione gzip.

Ottimizzazione del database

Un database ottimizzato aiuta la vostra installazione di WordPress a rimanere integra. Nel corso del tempo, le tabelle all’interno del database di WordPress potrebbero ingrandirsi e creare spazzatura che occupa memoria e causa problemi di prestazioni. Ciò richiede frequenti ottimizzazione e pulizia del database WordPress per mantenerlo funzionante. Consideratelo come un magazzino in cui tutto è ben ordinato negli scaffali, ma a causa della mancanza di manutenzione sono stati impilati articoli inutili che coprono il prodotto reale: raggiungere un prodotto reale su richiesta, in un magazzino in questo stato, potrebbe richiedere più tempo di quanto dovrebbe.

Dovremmo parlare approfonditamente della struttura delle tabelle di WordPress e delle loro relazioni per capire meglio la logica di questo CMS, ma ciò esula dallo scopo e lo rimando ad articoli successivi.

Se masticate MySQL potete benissimo utilizzare il phpmyadmin, presente nel vostro pannello hosting, e utilizzare alcuni dei seguenti comandi per eliminare ciò che non vi serve o per ottimizzare le tabelle:

OPTIMIZE TABLE ‘wp_posts’

Oppure potete rimuovere i tag mai usati attraverso questo comando SQL:

DELETE FROM wp_terms WHERE term_id IN (SELECT term_id FROM wp_term_taxonomy WHERE count = 0 );

DELETE FROM wp_term_taxonomy WHERE term_id not IN (SELECT term_id FROM wp_terms);

DELETE FROM wp_term_relationships WHERE term_taxonomy_id not IN (SELECT term_taxonomy_id FROM wp_term_taxonomy);

E molto altro ancora. Qualora desideriate una vita più comoda potete sempre utilizzare plugin come WP-Optimize: semplice da usare ed efficace al tempo stesso. È possibile rimuovere revisioni degli articoli, transient, commenti, info sui post.

Dimensioni delle immagini

Caricare immagini troppo grandi rispetto alla loro destinazione è, come detto, una pratica errata. Per ovviare a ciò potete avvalervi di un potente plugin: reSmush.it Image Optimizer. L’unico parametro da impostare è la qualità che vogliamo ottenere dopo che le immagini vengono caricate e ottimizzate: un valore di 92 può andare più che bene.

Oltre ad utilizzare un plugin, ricordate sempre che non ha senso caricare una immagine da 1920×1080 pixel quando dovrà essere visualizzata in 640×480, soprattutto se l’utente non ha la possibilità di ingrandirla a dimensioni reali. Piuttosto lavorate di editing grafico, riducete già a monte le dimensioni e scalatele secondo il loro reale output.

Cache

Per ottimizzare un sito web in WordPress non possiamo non parlare di cache: riveste un ruolo fondamentale nel processo di ottimizzazione di un sito. Per ottimizzare la cache bisogna essenzialmente lavorare sul:

• file .htaccess
• sito attraverso plugin come W3 Total Cache, Autoptimize, WP Super Cache.

File .htaccess

Modifcare il file .htaccess è sempre una procedura delicata, poiché se viene inserito un parametro errato il sito sarà inaccessibile: è sempre bene farne una copia di backup.

Nel file .htaccess Occorre inserire nel file alcune direttive che indicano al browser per quanto tempo mantenere nelle proprie cache i file del sito. (avete mai ricevuto l’avviso “Leverage browser caching“?). Se il file .htaccess non è presente, basta creare con un editor di testi un file vuoto nel formato .txt; una volta caricato sul server il file htaccess.txt deve essere rinominato in .htaccess.

NB: Per utilizzare il browser caching tramite .htaccess occorre utilizzare un server Apache e avere attivi due moduli: mod_headers e mod_expires.

modulo mod_headers attivo:

<FilesMatch “\\.(ico|gz)$”>
Header set Cache-Control “max-age=2592000, public”
<FilesMatch “\\.(jpe?g|png|gif|swf|flv|pdf)$”>
Header set Cache-Control “max-age=604800, public”
<FilesMatch “\\.(js|css)$”>
Header set Cache-Control “max-age=3600, private”
<filesMatch “\\.(html|htm)$”>
Header set Cache-Control “max-age=300, public”

nel caso di mod_expires attivo:

# CACHE EXPIRATION #
ExpiresActive On
ExpiresDefault A300
ExpiresByType image/x-icon A2592000
ExpiresByType application/x-javascript A3600
ExpiresByType text/css A3600
ExpiresByType image/gif A604800
ExpiresByType image/png A604800
ExpiresByType image/jpeg A604800
ExpiresByType text/plain A300
ExpiresByType application/x-shockwave-flash A604800
ExpiresByType video/x-flv A604800
ExpiresByType application/pdf A604800
ExpiresByType text/html A300
# CACHE EXPIRATION #

I numeri che vedete a destra di ogni direttiva sono le tempistiche in secondi che possiamo inserire nelle direttive mod_headers e mod_expires.

Plugin

Come accennato prima, esistono innumerevoli plugin che aiutano a velocizzare il nostro sito, ma attenzione: non è sempre un bene installarne due o più, sceglietene uno tra i migliori (come per esempio quelli che vi ho indicato) e configuratelo opportunamente.

Per esempio, sono solito utilizzare Autoptimize in quanto è semplice da configurare e svolge egregiamente il suo lavoro. Uno tra i migliori plugin in circolazione è senza dubbio W3 Total Cache, la cui configurazione, però, verrà trattata in futuri articoli.

Con Autoptimize, per iniziare ad avere buoni risultati, vi basta minimizzare il codice HTML, CSS, Javascript; aggregare i file js è un’altra ottima opzione da abilitare. Il plugin supporta nativamente il CDN CloudFlare, pertanto se lo utilizzate non dovete compiere alcuna azione.

Case Studies

Infine, vi porto un esempio di un sito ottimizzato – per quanto è stato possibile farlo – che ho realizzato l’anno scorso. Si tratta di un portale per un’agenza immobiliare locale, Infocasa Servizi Immobiliari la quale, essendo già cliente Aruba per quanto riguarda la pec, mi ha chiesto di rimanere sullo stesso hosting.

Nessun problema, o quasi, perché Aruba – nei piani base di hosting condiviso – non fornisce agli utenti un cPanel (a differenza di hosting quali Siteground o Serverplan): questa è una grave pecca in quanto il cPanel consente agli amministratori di avere un maggiore controllo sullo spazio web acquistato.

Tuttavia, dopo un bel po’ di lavoro, vi condivido i risultati:

Certo, poi dipende molto da come il cliente utilizza il sito: se carica immagini pesanti, se installa innumerevoli plugin, ecc ecc. Ma fortunatamente non è questo il caso.

Conclusioni

Ottimizzare un sito web in WordPress, come avete potuto leggere e come vi ho scritto un po’ di paragrafi fa, non è un’attività semplice né veloce: bisogna sapere quel che si fa e scegliere gli strumenti giusti.

Come ho evidenziato nel caso di studio, non è stato possibile – finora – raggiungere risultati migliori, sia a causa del server e pacchetto scelto sia anche al fatto che nella homepage è implementata una Google Map che evidenzia gli immobili inseriti. Google Map ha un forte impatto sul tempo di caricamento della pagina.