Velocizzare WordPress: pagine in 1 secondo

14 Aprile 2020 / Pubblicato in:  da Ivan Messina
Nessun commento

In questo articolo andiamo a vedere come velocizzare WordPress in pochi semplici passi e ottimizzare il nostro sito web per migliorare le prestazioni.

Un sito veloce è importante per garantire una buona esperienza all’utente (user experience).

Vedremo come non basta installare un plugin di cache o un plugin che contiene la parola optimizer nel nome per velocizzare il tuo sito web.

Ovviamente esistono molti plugin per velocizzare WordPress, in questa guida ne analizzeremo alcuni che ci aiuteranno ad ottimizzare WordPress.

Come testare la velocità di WordPress

Durante le varie fasi useremo lo strumento di test gratuito GTmetrix. Useremo questo strumento per eseguire il test della velocità del nostro sito svariate volte, in modo da valutare i miglioramenti (o peggioramenti) ad ogni nostra modifica sul sito.

Ti invito a registrare un account in modo da poter cambiare l’ubicazione del server di test, dal momento che sia i server che i clienti risiedono in Europa dovremo effettuare i test da Londra (la posizione più vicina) in modo da avere dei risultati veritieri.

L’account è completamente gratuito e ti permette tra le altre cose di vedere uno storico dei test, in questo modo puoi controllare se le prestazioni del tuo sito web sono migliorate o meno rispetto ai test precedenti, ovvero prima di effettuare le varie ottimizzazioni per velocizzare WordPress.

Velocizzare WordPress

Strumenti alternativi per testare le prestazioni del tuo sito web

Esistono anche strumenti per eseguire un test di velocità di un sito WordPress. I tre che consideriamo i migliori sono:

  • PingDom: questo è un ottimo tool, come GTmetrix è gratuito. Questo strumento ci dà meno indicazioni relative alle ottimizzazioni che possiamo eseguire sul nostro sito e tende a mostrare dei tempi di caricamenti inferiori rispetto a GTmetrix
  • Webpagetest: è uno tra i migliori strumenti per la testare la velocità del tuo sito WordPress, il preferito di molti. Personalmente preferisco GTmetrix per la chiarezza delle informazioni che fornisce riguardo l’ottimizzazione della pagina e la facilità con cui si legge il waterfall
  • PageSpeed Insights: questo è lo strumento ufficiale di Google. e tende a fornire delle informazioni molto precise e dettagliate

Nel corso di questa guida useremo GTmetrix visto che ci fornisce indicazioni precise e una misurazione affidabile del tempo di caricamento delle nostra pagine.

Eseguire il test con GTmetrix

Quando esegui un test con GTmetrix è opportuno scegliere l’ubicazione del server di test il più vicino possibile al server che vuoi testare. Se il tuo sito è su SupportHost dovresti scegliere Londra. Per avere questa opzione è necessario creare un account gratuito su GTmetrix.

Testare Un Sito WordPress Con Gtmetrix

Assicurati di usare il giusto protocollo (http o https) per il test. Questo serve a evitare un redirect, che andrebbe ad influire sul risultato della misurazione.

Assicurati inoltre che il tuo url contenga uno slash (/) alla fine per evitare un redirect che come nel caso precedente possa influire sul risultato del test.

In questo modo:

Velocizzare WordPress Test

Cos’è e come leggere il waterfall

Quando testi un sito web con GTmetrix puoi vedere un waterfall. Questo strumento ti permette di visualizzare tutte le risorse caricate per visualizzare la tua pagina web e quanto tempo impiega il caricamento di ognuna.

Leggere Il Waterfall Gtmetrix

Partendo da questa lista inizieremo ad eseguire le nostre modifiche in modo da migliorare la velocità del nostro sito WordPress.

Ad esempio molti plugin caricano dei fogli di stile e dei JavaScript in tutte le pagine, anche quando sono necessari soltanto in alcune pagine. Questo è il caso classico di contact form 7 che carica un JavaScript ed un file CSS in tutte le pagine anche se questi sono necessari soltanto nelle pagine che contengono il post.

Molti builder e temi allo stesso modo creano caricano dei files CSS e js che non sono utilizzati, e di grandi dimensioni.

Una volta nel tab waterfall possiamo dividere i files per tipo, oppure ordinarli per dimensione. Questo ci permette di analizzare tutti i files e capire cosa può essere rimosso e cosa invece deve rimandere per il corretto funzionamento della pagina.

Cosa considerare quando si vuole velocizzare WordPress

L’obiettivo di questa guida è quello di migliorare il tempo di caricamento del tuo sito web, scendendo sotto il tempo limite di 2 secondi.

Velocizzare WordPress Test Gtmetrix

Spesso ci si tende a focalizzare sul punteggio indicato dai vari tools. Per quanto riguarda l’esperienza dell’utente il punteggio è irrilevante. Inoltre un buon punteggio non è indice di un sito veloce, e non tutti i siti web che caricano in meno di 2 secondi hanno un buon punteggio.

Il nostro focus sarà quindi sul tempo di caricamento, non sul punteggio (che comunque migliorerà in seguito alle ottimizzazioni che eseguiremo in questa guida).

In questo esempio vediamo come non ci sia un diretto confronto tra i tempi di caricamento ed il punteggio:

Velocizzare WordPress Punteggio Vs Prestazioni
Punteggio Vs Prestazioni

Scegli un hosting performante

Seguiamo spesso le discussioni sui gruppi WordPress di Facebook.

Il caso più eclatante che abbiamo visto era di un utente che aveva un sito con una pagina con meno di 1MB e impiegava più di 10 secondi per il caricamento.

Se vuoi avere buone prestazioni devi partire da un buon servizio di hosting.

Abbiamo eseguito un test su una nuova installazione su un piano trial hosting WordPress ottenendo questi risultati:

Test Velocita Sito Supporthost
Test di un sito web WordPress appena creato su SupportHost

Un’immagine vale più di 1000 parole.

La scelta della posizione del server è importante per le prestazioni del sito web. Se i tuoi utenti sono per la maggior parte in Italia il server deve risiedere fisicamente in Europa.

Per questo motivo abbiamo optato per un datacenter in Germania, una posizione centrale con connettività ottima per offrire il massimo delle prestazioni.

Versione PHP

Le nuove versioni di PHP vengono migliorate non solo in termini di sicurezza ma anche di prestazioni.

Il salto prestazionale dalle versione 5.6 alla versione 7 di PHP è stato enorme, tanto da rilevarlo nei test di velocità di un sito. Provare per credere!

Il nostro consiglio è di attivare fin da subito l’ultima versione di php disponibile.

Usa Ultima Versione Di Php
Con SupportHost puoi scegliere la versione PHP che preferisci e quali opzioni di PHP usare

Con SupportHost tutti gli account hanno gzip attivo e l’ultima versione di php viene impostata di default su tutti gli account.

Attiva la compressione gzip

Su SupportHost la compressione gzip è attiva di default.

Questo ti permette di inviare i contenuti del tuo sito in formato compresso ai tuoi utenti, riducendo quindi le dimensioni della pagina e di conseguenza il tempo di caricamento.

Il test di velocità del sito GTmetrix ti indica se la compressione gzip è attiva o meno sul tuo sito WordPress.

Attiva La Compressione Gzip

Attiva la connessione HTTPS

Si è parlato molto della connessione sicura tramite il protocollo HTTPS negli ultimi anni. Oltre al fatto che i vari browser mostrano un alert se non usi una connessione sicura, hai un vantaggio in termini di prestazioni.

Se il tuo sito carica tramite la connessione protetta HTTPS puoi usare HTTP/2, un protocollo più veloce in quanto permette il download simultaneo dei files. Su SupportHost HTTP/2 è attivo di default su tutti gli account.

Con SupportHost il certificato SSL è attivo gratuitamente tutti gli account, quindi devi solo configurare il tuo CMS per utilizzarlo correttamente.

Se hai un sito WordPress ed ancora non stai usando la connessione https controlla la nostra guida per passare da http ad https con WordPress.

Perché la velocità del sito è importante?

Google ha dichiarato che la velocità è uno dei fattori di ranking. Vale a dire che se il tuo sito è molto lento potrebbe essere penalizzato e quindi non arrivare alla prima pagina.

Inoltre un sito lento fa letteramente scappare via i tuoi visitatori

Il 40% dei visitatori abbandonano il sito se impiega più di 3 secondi per il caricamento. Neil Patel

Anche le statistiche di Google ci confermano questi numeri relativi a un sito lento:

Aumento Bounce Rate Coi Tempi Di Caricamento
Aumento del bounce rate con l’aumentare del tempo di caricamento

Puoi quindi diminuire il bounce rate semplicemente migliorando le prestazioni del tuo sito web.

Tanta è l’importanza della velocità di caricamento nell’esperienza utente che Google Analytics ha una sezione dedicata alla velocità del tuo sito.

Come scegliere il tema perfetto

Spesso si tende a scegliere il tema in modo errato.

Supponiamo che vuoi creare un sito per un ristorante. Nella maggior parte dei casi si va su ThemeForest facendo una ricerca di temi per ristoranti, si sceglie quello che più ci piace e si compra, senza controllare granché.

Il problema della maggior parte dei temi è che sono creati in modo da poter essere utilizzati per le più svariate funzioni. Vale a dire che tu usi il tema per il sito di un ristorante mentre un altro utente lo usa per una web app.

Questo comporta la creazione di tanti diversi elementi. Ad esempio una tabella di prezzi che non userai mai nel sito del tuo ristorante ed un modulo per creare un menù che non userai mai nel sito per la web app.

Scegliere Un Tema Veloce Per Velocizzare WordPress

Oltre a questo ci sono altre funzioni del tema che potresti non usare mai, come ad esempio una funzione per lo sticky menu che però a te non piace e tieni disabilitata.

Ognuno di questi elementi ha bisogno di righe di CSS ed in alcuni casi anche di JavaScript. Queste righe di codice si sommano a tutte le altre andando a creare in alcuni casi dei foglio di stile e dei JavaScript di dimensioni enormi.

Alcuni temi di default hanno quasi 1MB di risorse, che per essere scaricate richiedono del tempo.

Come scegliere il tema?

La mia opinione è quella di eseguire una ricerca dei tempi più veloci per WordPress e scegliere tra loro quelli che più ci piacciono.

Appena abbiamo una lista di temi che ci piacciono e che si suppone siano veloci andiamo a cercare le demo ed eseguiamo un test su gtmetrix su ognuna delle demo.

In questa fase non ci interessa il tempo di caricamento ma il waterfall, il numero delle richieste e la dimensione della pagina.

Dal momento che non sappiamo se le immagini sono ottimizzate o meno nella demo, andiamo a controllare il waterfall, selezionando tutte le risorse tranne le immagini.

In basso vediamo la dimensione della pagina ed il numero di risorse. L’idea è di scegliere temi che hanno una dimensione massima di 500kb e meno di 20 richieste, escludendo le immagini.

Ovviamente si tratta di dati indicativi.

Abbiamo eseguito un’analisi di uno dei temi più gettonati: oceanwp che ha una versione gratis ed una a pagamento

Test Velocita Demo Tema Ocean Wp

Ci sono altre opzioni disponibili?

A seconda delle tue capacità (o del tuo budget) è possibile creare un tema ad hoc per il tuo sito. Data la mole di lavoro questa è un’opzione molto onerosa, ma che ti permette di ottenere il massimo delle prestazioni.

In alternativa è possibile usare un builder che sta riscuotendo molto successo recentemente: Oxygen Builder. Questo builder ha la particolarità di includere soltanto il minimo indispensabile quando si tratta di JavaScript e fogli di stile, garantendo delle prestazioni da capogiro.

L’unico neo di questo builder è che non è proprio adatto all’utente inesperto, mentre invece dei builder come elementor o divi lo sono

La verità sui sitebuilders

I sitebuilder aiutano non poco l’utente medio nella creazione di un sito web.

Usando elementor o divi quasi tutti possono creare un sito in modo professionale.

Il problema di questi builder sono le risorse che caricano in ogni pagine per poter mostrare i vari elementi grafici.

Comparativa Delle Prestazioni Di Diversi Bulder

Per questo motivo ti sconsigliamo di usare questi builder, mentre invece riteniamo che Oxygen Builder sia un’ottima scelta. Non abbiamo alcun tipo di partnership o affiliazione con Oxygen, si tratta di un ottimo prodotto che consigliamo quando possibile.

La verità sui plugin di WordPress

Avrai sentito dire che troppi plugin rallentano il sito. Anche se questo è vero in alcuni casi non è sempre vero.

Non è il numero di plugin che rallentano WordPress ma la loro qualità.

Ad oggi esistono più di 55.000 plugin per WordPress, e stiamo parlando solamente della repository ufficiale. A questo numero dobbiamo aggiungere tutti i plugin premium che vengono venduti altrove.

Plugin Di WordPress

Chiunque può scrivere un plugin e renderlo disponibile per tutti. Alcuni di questi plugin sono scritti in modo da eseguire delle operazioni che rallentano il tuo sito web.

In altri casi invece le operazioni che un plugin deve eseguire sono ben programmate, ma il numero di calcoli da eseguire rende il plugin “pesante”.

L’eredità dei plugin

Un altro problema dei plugin sono le “tracce” che lasciano sul database.

Quando installiamo un plugin vengono create delle tabelle (non per tutti i plugin) e vengono aggiunte delle righe nella tabella wp_options per le opzioni del plugin.

Puoi trovare la dimensione per la tua installazione lanciando questa query:

SELECT SUM(LENGTH(option_value)) as autoload_size FROM wp_options WHERE autoload = 'yes'
Ottimizzare Le Opzioni Di WordPress

Quando andiamo a eliminare il plugin non sempre questi dati vengono eliminati dal database.

In alcuni casi si tratta di un errore di programmazione, in altri casi l’autore del plugin non vuole che tu perda le impostazioni nel caso tu decida di reinstallarlo in futuro. In altri casi invece l’autore del plugin non aveva pensato all’impatto sulle prestazioni.

In un altro capitolo di questa guida spieghiamo come ottimizzare il database.

Ti servono tutti quei plugin?

In alcuni casi abbiamo trovato siti di clienti pieni di plugin, molti inutili.

Può succedere che nel tempo si alternino vari webmaster (o peggio ancora cuggini) e che vengano aggiunti nuovi plugin senza controllare cosa è già installato.

In alcuni casi abbiamo trovato 2 plugin per i form e nessuno dei due era utilizzato perché il tema WordPress aveva un suo form di contatto.

Un’altra volta abbiamo trovato woocommerce e easy digital downloads sullo stesso sito, ma non erano mai stati nemmeno impostati. Installati, attivati e abbandonati.

Al di là di questi casi ovvi, consigliamo di passare in rassegna tutti i plugin, e chiedersi per quali funzioni si stanno utilizzando.

Riduci Il Numero Dei Plugin

In molti casi si può fare a meno di quella funzione. In altri casi un plugin pesante è utilizzato per una singola funzione, in questo caso si può creare un “site specific plugin” con quella funzione specifica e disattivare il plugin.

Il primo passo consiste nell’eliminare tutti quei plugin di cui puoi fare a meno. Oppure seguire la nostra guida Plugin che rallentano WordPress e sostituire i plugin più pesanti con altri che influiscono meno sulle prestazioni del tuo sito WordPress.

Riduci la dimensione delle tue pagine

Quando un sito ha un alto numero di richieste o una dimensione di pagina troppo grande, una delle cause del problema (insieme ad immagini e font) sono gli script ed i fogli di stile.

Come dicevamo molti dei temi che si comprano sono fatti in modo da essere utilizzati da tutti e per siti che hanno le più svariate funzioni.

Questo fa si che chi vende il tema deve prendere in considerazione tutte le possibilità quando crea il tema.

Riduci La Dimensione Delle Tue Pagine800x

Alcuni plugin ed il core di WordPress includono dei fogli di stile e degli script completamente inutili.

Altri plugin invece inseriscono i loro fogli di stile e i loro script in tutte le pagine del tuo sito.

Come dicevamo prima un esempio classico è quello di Contact Form 7 che aggiunge un CSS ed un JavaScript a tutte le pagine del sito, ma le usa soltanto nella pagina dei contatti ed in altre eventuali pagine che usano un form di contatto.

Vediamo quindi come eliminare le risorse non utilizzate dalle pagine che non ne hanno bisogno per migliorare la velocità di caricamento delle pagine web.

Eliminare le risorse inutili dove non servono

Andiamo ad installare il plugin “Asset cleanup”, che ci permetterà di disabilitare alcune di queste risorse dove non ci servono.

Nota che puoi eseguire questa stessa operazione con una semplice funzione nel file functions.php del tuo tema oppure creando un “site specific plugin”. Vogliamo però che chiunque sia in grado di seguire questa guida, per questo abbiamo optato per far utilizzare un plugin.

Una volta installato il plugin andiamo sulle impostazioni dal menu a sinistra in “Asset cleanup -> settings”. Clicchiamo quindi sul tab “common unloads” e disabilitiamo quello che non ci serve. Sotto ogni voce vediamo una descrizione della risorsa.

Ad esempio se non usi le emoji nel tuo sito WordPress puoi disabilitare lo script.

Eliminare Risorse Inutili Dal Tuo Sito

Adesso andiamo ad eliminare quelle risorse che ci servono solo in alcune pagine del sito.

Ad esempio andiamo alla nostra pagina contatti, che contiene il form di contatto di contact form 7.

In questa pagina avremo bisogno dei fogli di stile di contact form 7 e degli script, ma non nelle altre pagine.

Sotto l’editor nella pagina contatti vediamo il box di “Asset cleanup” dal quale possiamo andare a rimuovere gli script e i fogli di stile di contact form 7 e lasciarli attivi solo su questa pagina.

Velocizzare WordPress Eliminare Risorse Per Pagina

Eliminazione di font inutili

In alcuni casi, come ad esempio nel tema che usiamo nel nostro sito web, venivano caricati dei font assolutamente inutili.

Nel nostro caso avevamo un font che veniva caricato soltanto per un titolo. Abbiamo deciso di utilizzare un altro font per quel titolo ed eliminare il caricamento di una risorsa aggiuntiva.

In questo modo abbiamo risparmiato una risorsa e 80Kb.

Se il nostro obiettivo è velocizzare WordPress dobbiamo eliminare tutte le cose inutili.

L’eliminazione di una singola risorsa non farà gran differenza, ma tutte le operazioni messe insieme ci porteranno ad avere un sito che carica in meno di 1-2 secondi.

Inoltre per le icone venivano caricati 2 diversi font di icone oltre a font awesome.

Abbiamo eseguito una revisione di ogni pagina sostituendo tutte le icone con quelle di fotnawesome, eliminando così il caricamento di altri 2 font.

Questo ci ha fatto risparmiare 2 risorse e 287Kb totali.

Eliminare I Font Inutili Velocizzare Wp

In altri casi invece lo stesso font viene caricato diverse volte per il grassetto, corsivo, ecc…

Anche in questo caso è opportuno chiedersi se possiamo fare in altro modo in modo da ridurre le risorse necessarie al caricamento della pagina. 

L’eliminazione dei font dipende dal builder che stai utilizzando ed dal tema, quindi non possiamo dare delle linee guida che siano sempre valide per questo tipo di operazione.

Merge e minify: riduci al massimo

A questo punto abbiamo eliminato tutte le risorse inutili.

Possiamo ancora ridurre le dimensioni della pagina ed il numero di richieste.

Questo processo si chiama merge e minify.

Merge significa unire. Andremo infatti ad unire i files CSS in modo da avere un numero inferiore di files. Andremo poi ad unire i js che contengono gli script per ridurre il numero di richieste.

Merge E Minify

Abbiamo anche la possibilità di ridurre le loro dimensioni eseguendo un’azione che si chiama minify, in italiano minificazione.

La minificazione di un file consiste nell’eliminazione di caratteri inutili (ad esempio le interruzioni di riga) e l’eliminazione dei commenti.

Un file minificato sarà difficile da leggere se vuoi apportare delle modifiche, è però utile perché ci consente di ridurre le dimensioni finali del file.

Questo processo viene gestito in modo automatico da un plugin. Puoi usare il plugin che abbiamo installato prima (asset cleanup) per minificare ed unire i files, oppure un plugin ulteriore come ad esempio fast velocity minify.

Merge e minify con Asset Cleanup

Se vuoi usare questa funzione di Asset Cleanup devi andare sulle impostazioni del plugin, ed al tab “Combine CSS & JS Files” spuntare le opzioni.

Una volta salvate le impostazioni pulisci la cache del browser e visita il sito per vedere se questa operazione ha creato problemi.

Se così fosse devi trovare il CSS o il JavaScript che crea il problema se unito agli altri ed escluderlo.

Una volta che abbiamo impostato il plugin per eseguire il merge ed abbiamo quindi unito tutti i files possiamo fare un altro test. Sicuramente noteremo una ulteriore riduzione del numero di richieste e della dimensione della pagina.

A questo punto possiamo andare al tab “Minify CSS & JS Files” ed impostare in modo da eseguire anche la minificazione dei files. Anche in questo caso svuotiamo la cache del browser e controlliamo il sito alla ricerca di problemi.

Merge E Minify Con Wp Asset Cleanup

Se è tutto ok eseguiamo un altro test con GTmetrix in modo da vedere se c’è stato un miglioramento e anche quantificarlo.

La ricerca di problemi nel sito web non sarà complicata. Se dopo aver salvato le impostazioni avrai un problema, questo sarà lampante.

Ad esempio potresti vedere parte della grafica completamente mancante oppure delle funzioni del sito che non funzionano. Non c’è bisogno di trasformarsi in Sherlock Holmes con tanto di lente di ingrandimento, non preoccuparti.

È possibile che se usi un tema WordPress base o un builder come Oxygen Builder non ci sia tanta differenza prima e dopo queste operazioni, mentre in altri casi le differenze saranno enormi, ad esempio in quei casi di temi che creano tanti CSS diversi per ogni pagina.

Merge e minify con FVM

Fast Velocity Minify è un plugin che serve soltanto ad eseguire il merge e minify delle risorse per aumentare la velocità di WordPress.

Consigliamo l’utilizzo di Asset Cleanup per la sua facilità d’uso, ma per casi particolari è possibile usare questa alternativa.

Ad esempio su SupportHost avevamo una situazione complessa.

Abbiamo disattivato le risorse su alcune pagine direttamente tramite una funzione personalizzata nel tema, quindi non stavamo usando Asset Cleanup.

Inoltre avevamo la necessità di impostare delle scadenze maggiori per i files minificati e di sincronizzarli con i files di cache di WP Super Cache e quindi abbiamo preferito usare questo plugin per una maggiore possibilità di personalizzazione delle opzioni.

Nel 99% dei casi il semplice utilizzo di Asset Cleanup è più che sufficiente.

Ottimizzazione delle immagini

Andiamo adesso ad ottimizzare le immagini. Apri il tab waterfall su gtmetrix e selezione solo le immagini.

Velocita WordPress Ottimizza Immagini

Se non ha mai ottimizzato le immagini del tuo sito web è possibile che gran parte della dimensione delle tue pagine web dipenda appunto dalle immagini.

Se vogliamo velocizzare WordPress è di massima importanza ottimizzare le immagini.

In particolar modo nei blog, si tende a caricare immagini senza pensare alle conseguenze per le prestazioni, quindi in formati errati o dimensioni esagerate.

Filtrando le immagini in questo modo vediamo la dimensione totale di tutte le immagini, ed il loro numero.

Questo ci permette di individuare immagini con dimensioni eccessive e capire come fare per ridurne il peso.

Dimensioni delle immagini

In alcuni casi abbiamo visto immagini di 3000 o 5000 px di larghezza e qualche MB di peso, che poi venivano ridimensionate dal browser.

Raramente nel tuo sito web avrai bisogno di immagini più grandi di 1600px.

In molti casi si tratta di immagini che vengono caricate all’interno di articoli nel blog.

La maggior parte dei temi impostano una larghezza massima per la colonna del testo, che di solito oscilla tra 700 px e 980 px. vale a dire che ogni immagine più larga verrà ridimensionata dal browser.

È quindi opportuno ridimensionare le immagini prima di caricarle (oppure farlo in automatico come vedremo tra poco).

Ridimensionare Le Immagini

Possiamo usare la funzione di WordPress direttamente per modificare le dimensioni delle immagini, direttamente dall’area amministratore alla sezione media

Cambiare tipo di immagine

Le immagini in png hanno una maggiore definizione e sono spesso usate per i loghi e le icone, dove c’è bisogno della trasparenza.

Certi siti hanno molte immagini in formato png all’interno dei loro post. Questo accade spesso nel caso degli screenshot, che vengono creati in questo formato.

Se si tratta di una foto è conveniente usare il formato jpg. Se all’interno dei tuoi post hai delle immagini in formato png è opportuno convertirle tranne che in pochi casi particolari.

Compressione delle immagini

Consigliamo di acquistare shortpixel, un plugin che permette la compressione delle immagini in modo automatico.

Dopo l’installazione shortpixel eseguirà una compressione (e se vogliamo anche il ridimensionamento) delle immagini in automatico.

Questa prima operazione prenderà un po’ di tempo. Poi eseguirà la compressione in automatico ad ogni upload. Ecco come abbiamo impostato shortpixel:

Velocizzare WordPress Impostazioni Shortpixel

Ridimensionamento automatico delle immagini

In molti casi nei blog ci sono diversi autori, e sarebbe molto difficile controllare che tutti ottimizzino le immagini in modo corretto.

Capita spesso infatti che un autore carichi immagini con dimensioni esagerate o in un formato errato.

In questo caso un plugin gratuito ci viene in aiuto. Si tratta di un plugin gratuito rilasciato da shortpixel che controlla le immagini quando vengono caricate e ne esegue il ridimensionamento in automatico.

Qui possiamo impostare una dimensione massima delle immagini.

Velocizzare WordPress Ridimensionamento Automatico Immagini

Questo plugin ti permette inoltre di ricomprimere le immagini in formato jpg, scegliendo la nuova compressione, che in questo esempio abbiamo impostato ad 80:

Velocizzare WordPress Compressione Jpg

Inoltre se vogliamo possiamo spuntare l’opzione per convertire le immagini da png a jpg.

Usare le immagini in formato webp

Normalmente per il web si usano le immagini in formato jpg, png o gif.

Google ha di recente introdotto un nuovo formato: webp.

Stando ai dati di Google il formato webp è il 26% ridotto rispetto al formato png, mentre la dimensione dell’immagine si riduce dal 25% al 34% se comparato con jpg.

Compressione Webp

Possiamo vedere la differenza di qualità e di dimensioni nella galleria webp di Google.

Pro e contro del formato webp

Questo formato fa un ottimo lavoro nel ridurre le dimensioni del file ed allo stesso tempo mantenere la qualità dell’immagine.

Le immagini webp supportano, come anche nel caso del formato png, a trasparenza. Questa è una funzione importantissima per le immagini per il web.

Il formato webp non è ancora supportato da tutti i browsers. Ecco una lista dei browsers che supportano webp ed il loro market share:

Browsers Che Supportano Webp

Qui invece vediamo i browsers che non supportoano webp ed il loro market share

Browsers Che Non Supportano Webp

Fortunatamente è possibile usare un’immagine in formato jpg o png come backup per quei browser che ancora non supportano questo nuovo formato.

Shortpixel si prende cura di tutto, vediamo come fare nella prossima sezione.

Come usare webp su WordPress

Al momento WordPress non supporta webp, ma come al solito, possiamo risolvere questo problema con un plugin.

Puoi usare shortpixel per creare le immagini in webp e fornire le immagini ai browser che le supportano in modo semplice ed automatico.

Usare Webp Con Shortpixel Su WordPress

Aumenta ulteriormente le prestazioni col Lazy Load

Il Lazy Load consiste nel non scaricare le immagini quando non necessario.

Questo ti permette di scaricare soltanto le immagini “above the fold”, ovvero nella parte della pagina visibile prima di iniziare lo scorrimento verso il basso.

Il resto delle immagini saranno scaricate man mano che l’utente scorre la pagina.

Per aggiungere questa funzione al nostro sito WordPress consigliamo l’utilizzo di a3 Lazy Load.

Questo plugin è stato utilizzato su più di 200.000 diverse installazioni WordPress e viene mantenuto costantemente aggiornato.

Il plugin è semplicissimo da utilizzare e funziona benissimo già con le impostazioni di base.

Ottimizzare il database di WordPress

A meno che tu non stia usando un plugin di cache per ogni pagina che viene visitata WordPress accede al database per prendere i dati e generare il codice della pagina.

Quanto maggiori sono le dimensioni del database maggiore sarà il tempo impiegato per recuperare le informazioni necessarie. Questo è vero anche se tutti le tabelle hanno gli indici.

Se vogliamo veramente velocizzare WordPress dobbiamo fare in modo che le informazioni vengano trovate nel modo più rapido possibile nel database.

Il nostro obiettivo è quindi quello di ripulire il database.

In molti casi viene consigliato l’utilizzo di WPoptimize, che è senz’altro un’ottima scelta per l’utente non avanzato.

Ottimizzare Database Con Wp Optimizer

Puoi eseguire le operazioni di pulizia direttamente usando PhpMyAdmin.

Elimina le tabelle inutili

Il primo controllo che andremo ad eseguire consiste nel cercare se ci sono tabelle non utilizzate.

Alcuni plugin durante la loro installazione aggiungono delle tabelle al database, e come abbiamo detto prima non le eliminano quando vengono disinstallati.

È possibile quindi che nel tuo database siano presenti alcune tabelle che sono rimaste lì inutilizzate da tempo.

È opportuno eliminarle, ovviamente sempre dopo aver eseguito un backup.

Riduci le dimensioni di wp_options

Una tabella che tende ad avere dimensioni enormi è la tabella wp_opzions, che contiene le opzioni di WordPress e dei plugin.

Il problema in questo caso è che alcune delle opzioni vengono salvate con l’opzione autoload, talvolta anche quando non necessario.

Anche in questo caso molti di questi dati appartengono a plugin che abbiamo usato in passato e non sono più attivi.

È possibile fare una ricerca nel database ed analizzare le tabelle una ad una eliminando quelle inutili.

Ottimizzazione Database

Ottimizzare wp_posts

WordPress memorizza tutti i dati relativi ai post, pagine e agli altri tipi di contenuto nella tabella wp_posts.

Inoltre per ogni post vengono memorizzate delle revisioni.

Tutti questi dati vanno ad aumentare le dimensioni della nostra tabella.

Coma prima cosa possiamo eliminare le revisioni di WordPress, operazione che possiamo fare con un plugin come wp rocket, oppure direttamente tramite PhpMyAdmin. Ovviamente con le dovute precauzioni.

Ottimizza La Tabella Wp Posts 1
558 righe di contenuti nel cestino o revisioni

Il prossimo passo consiste nel limitare o evitare il numero di revisioni che vengono mantenute sul database di WordPress.

Per fare questo Andiamo ad aggiungere una costante nel file di configurazione di WordPress. Stiamo parlando del file wp-config.php

define('WP_POST_REVISIONS', 3);
Limitare Il Numero Di Revisioni Su WordPress

In alternativa possiamo disattivare le revisioni di WordPress completamente.

Disattivare Le Revisioni Su WordPress

Ripulire la tabella wp_postmeta

Questa tabella contiene dei dati aggiuntivi per ogni post. Molti plugin usano questa tabella per aggiungere dei metadati ai post.

In alcuni casi può succedere che quando eliminiamo i post restino delle righe orfane. Queste righe non sono collegate a nessun post e quindi completamente inutili.

Possiamo trovarle ed eliminarle con una semplice query.

Ottimizzare La Tabella Wp Postmeta WordPress

Consigli di GTmetrix

A questo punto abbiamo eliminato tutti quei files e plugin inutili che rallentavano il caricamento ed ottimizzato al meglio quello che ci serve.

Sicuramente avrai notato una riduzione nelle dimensioni della pagina ed una riduzione del numero di richieste.

Adesso è il momento di controllare le raccomandazioni di GTmetrix, in modo da eseguire gli ultimi aggiustamenti.

L’individuazione dei problemi in questa fase è molto semplice  dal momento che GTmetrix mette in alto i problemi che trovi elencati nel tab “Pagespeed”.

Questa raccomandazioni sono ovviamente diverse per ogni sito web e GTmetrix fornisce una spiegazione ed una soluzione per ognuna.

Attivazione di un plugin di cache per velocizzare WordPress

L’ultimo passo dell’ottimizzazione che ci permette di velocizzare WordPress è l’attivazione di un plugin di cache.

Un plugin di cache crea dei files html statici per ogni pagina del tuo sito in modo da non dover generare ogni volta il codice della pagina. Questo riduce il numero di calcoli che il server deve eseguire ad ogni visita, riducendo quindi i tempi di caricamento del sito web.

Esistono vari plugin di cache che puoi utilizzare, tra tutti consigliamo WP Super Cache.

Wp Super Cache Plugin

Sconsigliamo l’utilizzo di w3 total cache, su diversi gruppi sono stati eseguiti dei test e in tutti i casi viene sconsigliato l’uso del plugin.

Una volta installato Wp Super cache andiamo alla pagina delle impostazioni.

Le impostazioni di default sono studiate per funzionare al meglio nella maggior parte dei casi.

Consigliamo di attivare il modo esperto nel tab advanced perché permette maggiori prestazioni.

Il modo “expert” infatti usa mod_rewrite per fornire al visitatore in files in cache, mentre il metodo “simple” esegue delle chiamate php prima di fornire il file statico.

Usare un CDN

Un passo ulteriore per velocizzare WordPress consiste nell’attivazione di un CDN (Content Delivery Network). Una volta che il tuo sito web è ben ottimizzato un CDN può migliorare ulteriormente le prestazioni.

Attivare un CDN a prescindere può non aver senso, o essere pure deleterio. Vediamo nel dettaglio.

Cosa fa un CDN?

Per capire come l’utilizzo di un Content Delivery Network ci aiuta nel migliorare le prestazioni del nostro sito web dobbiamo innanzitutto capire come funziona.

Questo network ci permette di fornire le parti statiche della pagina (ad esempio le immagini) da un server situato il più vicino possibile all’utente.

Ad esempio col nostro servizio hosting il tuo sito risiede fisicamente in Germania. I tuoi clienti in Europa avranno dei caricamenti rapido, ma gli utenti che visitano il tuo sito dall’Asia, Oceania o America avranno dei tempi di caricamento più lunghi dovuti alla distanza dal server.

Un Content Delivery Network fornisce il caricamento da un altro server del loro network, quello che è più vicino all’utente.

Quando usare un CDN

Dai nostri test abbiamo riscontrato che l’uso di un CDN come CloudFlare se tutti i tuoi utenti sono in Europa è non solo superfluo, ma dannoso perché ti fa perdere qualche decimo di secondo.

Se invece hai utenti in tutto il mondo la perdita di qualche millisecondo per gli utenti in Europa significa aver guadagnato 1 o anche 2 secondi per gli utenti più lontani, quindi in questo caso si rivela una buona scelta.

Conclusioni

Se hai seguito i passi che ti ho indicato in questa guida sicuramente sei riuscito a velocizzare WordPress.

Che miglioramento hai avuto? In quanti secondi caricava prima ed in quanti secondi carica adesso il tuo sito?

Qualche passaggio non era chiaro o non sei riuscito a eseguirlo per qualche motivo?

Fammelo sapere nei commenti.

Potrebbe interessarti anche:

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *