WordPress è il CMS più usato al mondo grazie alla sua versatilità, facilità di utilizzo e numero infinito di plugin che ti permettono di aggiungere funzionalità di tutti i tipi.
La domanda che gira maggiormente sul web è “come installare WordPress” ma quella che viene subito dopo è “Come velocizzare WordPress“.
Ormai lo sanno tutti che la velocità di un sito è fondamentale per le performance.
In questa guida vedremo quali possono essere le criticità e come risolverle.
Avere un sito veloce è un fattore importante se vuoi utilizzare questo strumento per le tue campagne di marketing.
Infatti la velocità è un fattore di ranking, quindi Google premierà i siti che si caricano più velocemente.
Inoltre gli utenti sono abituati a navigare a ritmi immediati e non sono disposti ad aspettare per ottenere le informazioni.
Secondo le ricerche di Google il 40% degli acquirenti non aspetta più di 3 secondi prima di abbandonare un sito.
Ma perché tutti si pongono questa domanda e ci sono così tante guide che parlano di questo problema?
Perché non c’è una risposta univoca ed è molto difficile trovare il vero fattore che rallenta il sito.
Infatti nella maggior parte dei casi si tratta di una somma di fattori che millesimo per millesimo creano secondi di ritardo.
Strumenti di diagnosi
Esistono però degli strumenti di diagnosi che ti permettono di identificare alcuni colli di bottiglia.
Partiamo quindi dal vedere quali sono.
Il primo è Google PageSpeed Insights. Non è molto intuitivo, ma ci fa comodo sapere cosa ne pensa Google perché da qui ne dipenderà la nostra indicizzazione.
Di recente è stata modificata questa schermata per fare spazio alla “Valutazione Segnali web essenziali” o “Core Web Vitals” che sono una serie di parametri con i quali Google classifica il tuo sito in termini di esperienza utente.
Come vedi la sezione è divisa tra Dispositivi Mobili e Desktop e i risultati possono essere molto diversi tra loro.
In questa pagina potrai leggere molte indicazioni che nella maggior parte dei casi sono comuni su tutti i siti e quindi vedremo di seguito come risolverle.
Il secondo strumento è gtmetrix, a mio avviso questo strumento è più facile da leggere.
Possiamo comprendere i secondi di caricamento, quanto pesano le diverse risorse (immagini, js, font, ecc) e avere una serie di consigli per la risoluzione.
Oltre ad usarli in fase preliminare, questi strumenti saranno da usare durante l’ottimizzazione per capire se gli interventi che stiamo facendo sono risolutivi e in che misura.
Andando nel concreto vediamo le tre aree in cui possiamo agire per migliorare la velocità del sito: INFRASTRUTTURA, STRUTTURA e OTTIMIZZAZIONE.
INFRASTRUTTURA
Semplificherò molto questa fase perché per chi non è un informatico è molto noiosa.
L’infrastruttura è tutto quello che è off-site.
Il sito è ospitato su un server web dove vengono caricati i nostri file.
Stiamo parlando del servizio di Hosting che paghi annualmente, dove probabilmente hai anche compreso il dominio e la posta.
È fondamentale che questo servizio sia all’altezza del tuo sito, cioè sia proporzionato alla grandezza del portale, alle caratteristiche tecniche, funzionali e alle visite che hai ogni mese.
Se hai un sito con 3 pagine statiche e 10 visite mensili, è diverso da avere un eCommerce con 100 prodotti e 300 visite giornaliere.
Se hai un sito in WordPress che non ha funzionalità custom, ti consiglio vivamente di scegliere il servizio di Hosing Siteground, perché a livello di qualità prezzo è quello maggiormente ottimizzato per WordPress.
Ho preso siti molto lenti ospitati su altri provider e spostati su Siteground senza fare alte variazioni e le performance sono migliorate incredibilmente.
Il secondo punto è il certificato SSL, anche in questo caso non ti annoio spiegandoti cos’è e perché averlo.
Ti dico solo che se hai il certificato SSL installato il tuo sito è raggiungibile al link httpS://www.domino.com se non lo hai è raggiungibile solo all’indirizzo http://www.domino.com
La S indica agli utenti e ai browser che i dati sul sito sono sicuri, inoltre viaggia su un protocollo che e effettivamente più veloce.
Quindi quello che devi fare è controllare se hai installato il certificato SSL, ci sono diversi tipi, ma puoi usare quello gratuito chiamato “let’s script” che è presente in tutti i servizi di hosting.
STRUTTURA
Passiamo a uno step più pratico e rechiamoci nel back-end del sito WordPress, cioè nella parte di modifica raggiungibile all’indirizzo nomedominio.it/wp-admin.
Verifica quindi questi aspetti:
– PLUGIN
La forza di WordPress sono queste estensioni che ti permettono di fare qualsiasi cosa, attenzione però che non puoi aggiungerli indiscriminatamente.
Devi selezionare solo plugin testati, sicuri e compatibili. Puoi capire se lo sono guardando le recensioni e il numero di installazioni.
Inoltre non puoi oltrepassare un certo limite, se hai più di 15-20 plugin sappi che sei in una situazione critica.
Quindi verifica se i plugin che hai installato sono tutti indispensabili.
– TEMA e BUILTER
Il tema è la cover grafica del sito. Se hai creato in autonomia il sito potresti averne usato uno gratuito o a pagamento.
Spesso questi temi inseriscono tantissime funzionalità per essere più versatili e avere più possibilità di essere scelto, ma maggiori sono le funzionalità maggiore è il peso.
Quindi se verifichi che il tuo tema è il collo di bottiglia della velocità potresti essere contratto a cambiarlo.
Ogni tema, sopratutto se a pagamento, ha il suo builder, cioè il sistema che ti permette di creare pagine complesse senza usare il codice.
Questi strumenti sono importantissimi per creare pagine gradevoli, ma sono molto pesanti.
Per poterti permettere di utilizzarli tutti gli altri punti devono essere in ordine.
– EFFETTI
Spesso si è attratti da animazioni a comparsa, slider e video giganti.
Tutto questo provoca ulteriore peso e quindi lentezza. Ti consiglio di usare un design pulito, minimale se senza troppe animazioni sopratutto per la Home.
– AGGIORNAMENTI
WordPress, Plugin e Temi continuano a rilasciare versioni che migliorano la sicurezza e le performace. È importante pianificare degli aggiornamenti costanti perché le tecnologie vecchie hanno spesso problemi.
Ricordati inoltre di controllare che la versione del PHP installata sull’hosting sia compatibile, cioè PHP 7 o superiore.
OTTIMIZZAZIONE
Lo step precedente era la base di un corretto utilizzo di WordPress.
Ora vediamo come mettere il turbo.
Quello che faremo ora è aggiungere delle funzionalità al sito per renderlo più digeribile dai browser.
Per fare questo dovremo aggiungere dei plugin. Anche in questo caso il setup che ti suggerisco cerca di ridurre al minimo il numero di installazioni.
Queste opzioni vanno a risolvere la maggior parte dei problemi che hai verificato precedentemente con gli strumenti di monitoraggio Google PageSpeed Insights e GTMetrix.
1) Caching e Minimizzazione
Questa funzionalità serve per memorizzare i dati e rispondere alle richieste più rapidamente, permette di riutilizzare in modo efficiente dati già recuperati o elaborati.
Per questo alcune volte vedi le pagine web non aggiornate e devi ricaricare più volte la pagina per vedere la modifica.
Mentre la Minimizzazione serve per compattare e comprimere il codice con cui è scritto il sito, così da far pesare meno i singoli file.
Il plugin che ti suggerisco è Autoptimize.
Una volta installato, vai nelle impostazioni e spunti le prime 2 caselle del box “Impostazioni JavaScript”, le prime 3 del box “Opzioni CSS”, le 2 della casella “Opzioni HTML” e tutte quelle del box “Opzioni varie”.
Dopo averlo fatto controlla che il sito sia correttamente funzionante, perché le modifiche che attua il plugin potrebbero essere non compatibili.
Se vedi qualcosa di strano togli una spunta alla volta così da capire quale ha causato il problema.
2) Immagini
Le immagini sono uno dei problemi più frequenti, ma anche quello più facile da identificare e risolvere.
Dovresti caricare sul sito solo foto in formato per web e con le dimensioni che effettivamente ti servono.
Non caricare i file sorgenti della macchina foto ma lavorali in maniera adeguata.
Inoltre ora è disponibile un nuovo formato chiamato WebP che permette di avere una qualità altissima a un peso molto migliore del classico JPG.
Non essendo ancora molto diffuso potrebbe essere difficile per te salvare un’immagine in questo formato, ma sappi che WordPress supporta nativamente il WebP e quindi puoi caricare direttamente questo tipo di immagine.
Se non hai un programma per crearlo puoi usare un convertitore online da JPG a WebP.
Per completezza ti indico che questo formato non è ancora compatibile con tutti i browser ma solo con quelli moderni.
Se hai utenti che navigano con Windows 95 e internet explorer, probabilmente non le vedranno.
Se invece non vuoi gestire le immagini offline ma ti è più comodo modificarle direttamente sul sito, puoi usare il plugin ShortPixel per ottimizzarle e trasformare le immagini.
Hai 100 crediti gratuiti ogni mese e poi puoi passare al piano a pagamento.
In passato si suggeriva anche di attivare il Lazy Loading, cioè la possibilità di caricare piano piano le foto man mano che scrolli la pagina, così da non doverle caricare tutte subito.
Questa funzionalità è ora nativa di WordPress dalla versione 5.5 e quindi ti basterà che il tuo sito si aggiornato per poterne usufruire.
3) Font
Da anni ormai la maggior parte dei siti si affida per l’utilizzo dei font a Google Font, questo perché ti da la possibilità di scegliere tra molti stili gratuiti, l’integrazione è molto facile e la compatibilità è totale.
La modalità di installazione più facile, cioè tramite API, è già molto ottimizzata ma non è il metodo migliore a livello di velocità.
Ti consiglio quindi di:
- limitare il numero di font da incorporare, massimo 1 per i titoli e 1 per i testi. Meglio ancora se è lo stesso.
- limita le varianti, carica solo il numero di “pesi” necessari. Come sai i font possono essere Bold, Light, Italic, ecc. Più varianti inserisci, maggiore sarà il peso.
- combina i font in una sola richiesta. Se usi più font non creare 2 link da incorporare ma creane uno solo. Puoi faro anche dallo strumento google font aggiungendo gli stili che vuoi e copiando il link che viene generato.
– Ospita i font localmente.
Puoi scaricare i font che desideri e caricali sul tuo server invece che chiederli tramite API.
Per farlo puoi andare al link https://google-webfonts-helper.herokuapp.com/fonts scegliere il font che desideri e scaricarlo. Come vedi avrai più formati per ogni stile: eot,woff,woff2,ttf,svg
Questi servono per migliorare la compatibilità su tutti i browser.
Per incorporarli sul sito ti mostro la procedura con Elementor:
Vai in Elementor > Font Personalizzati > Aggiungi Nuovo > Inserisci il nome e aggiungi il font in tutte le sue variazioni e formati.
Ora vai nelle opzioni di Autoptimize > Extra e clicca su “Rimuovi i Google Font”.
– Preconnect
Se invece non vuoi caricare i file localmente ti consiglio di mettere la spunta su “Combine and link deferred in head” ed inserire il link di Google Font “https://fonts.googleapis.com” nel campo “Pre-connessione a domini di terze parti”.
In questo campo puoi mettere altri domini che caricano risorse da terze parti es. google-analytics.com, googletagmanager.com, facebook, ecc
4) TIPS
Alcuni piccoli aggiustamenti per guadagnare qualche altro millesimo
– Eliminare e Limitare le Revisioni di Post e Pagine
apri il file wp-config.php in colla il codice:
define('WP_POST_REVISIONS', 3);in questo modo saranno sempre disponibili le ultime 3 revisioni della tua pagina.
Se invece vuoi disabilitarlo usa
define('WP_POST_REVISIONS', false);e incollalo prima di ABSPATH.
– Dai più memoria a WordPress
Di default sono allocate un numero limite di risorse a WordPress ma alcuni plugin pesanti le erodono velocemente, rallentando il sito. Parlo per esempio di WPML o Woocommerce.
Per aumentare la memoria vai al file wp-config.php, verifica che non ci sia già una stringa con scritto WP_MEMORY_LIMIT. Se non c’è incolla questa stringa:
define( 'WP_MEMORY_LIMIT', '256M' );
– Disabilitare le Emoji e i commenti
Puoi fare questo da autoptimize > extra “Rimuovi emoji”
e in Impostazioni > Discussione > togli spunta da “Permetti l’invio di commenti per i nuovi articoli”. Questa opzione non è retroattiva, quindi se volessi togliere i commenti dai vecchi post dovresti farlo a mano o tramite plugin.
A proposito dei Commenti verifica che tu non abbia commenti Spam in sospeso. Puoi contrassegnarli come spam e se sono troppi eliminarli.
Ora che hai fatto le ottimizzazioni controlla che tutte le funzionalità siano ancora disponibili e rifai il test con Google PageSpeed Insights o Gtmetrix.
Fammi sapere nei commenti quanti secondi hai guadagnato.
Grazie Fes di essere arrivato fino a qui, ci vediamo nel prossimo articolo!
