Migliorare le performance di un sito web WordPress: plugin e soluzioni

Sappiamo bene come, al giorno d’oggi migliorare le prestazioni di un sito web sia diventato fondamentale, per la Seo, per finalità di marketing, ma in generale ma soprattutto per il corretto funzionamento del portale. Il web si sposta ogni giorno sempre più su mobile, e avere un caricamento pressochè immediato diventa fondamentale, per evitare che gli utenti abbandonino il sito in maniera prematura. Se usiamo WordPress come cms abbiamo il vantaggio, di poter godere di una mole di plugin già pronti per poter lavorare sull’ottimizzazione, rendendo le operazioni più semplici anche per i meno esperti.

Le statistiche più recenti parlano di un tempo massimo di caricamento su mobile di tre secondi: quando un portale è più lento, viene abbandonato prima del caricamento completo. In questo modo, il portale non vende, non converte, non ottiene visitatori utili.

Velocità e performance, come misurarle

Gli strumenti per misurare la velocità e le performance del proprio sito web sono le seguenti:

Pagespeed Insight: la pagina ufficiale di Google che offre tutte le indicazioni per poter ottenere pagine perfette, prive di errori, veloci e performanti.
Web.dev e “Ispeziona elemento” di Google Chrome: sono strumenti molto simili a Pagespeed Insight, che rilevano dati utili per programmare future ottimizzazioni. Per poter utilizzare Isperiona elemento, è necessario utilizzare Chrome, cliccare con il tasto destro nella pagina, scegliere la voce Ispeziona e, nel menù a destra, selezionare Performance. Oltre alla velocità, si può scegliere se eseguire o meno un audit completo (vds immagine seguente).

GtMetrix è un must per tutti colori che intendono ottimizzare un sito web. Offre dei punteggi basati su lettere dalla A alla F ed offrono soluzioni precise ai problemi riportati.
Pingdoom Tools: analizza i siti web in maniera diversa dai precendenti. Si occupa infatti di fornire informazioni precise sui tempi di caricamento di ognuno dei singoli elementi di una pagina, grazie al cosiddetto waterfall. In questo modo, si possono individuare facilmente elementi più lenti (esempio: immagini grandi non ottimizzate) e poter procedere ai dovuti miglioramenti.
Webpagetest.org: per certi versi molto simile al precedente, offre risultati rilevanti.

Gli errori rilevati: significato degli errori più comuni

Diamo una breve descrizione del significato degli errori più comuni, rilevati con gli strumenti soprariportati:

Leverage browser caching

I file statici della pagina possono essere salvati dal tuo browser, per ridurre i caricamenti successivi.

Minimize redirects / Avoid landing page redirects

Ridurre i redirects della pagina è fattore di velocità

Minify JavaScript / CSS / HTML

Comprimere i codici è fondamentale

Server Scaled Images

Le immagini andrebbero pubblicate senza riduzioni, già dimensionate in base alla visualizzazione definita via CSS o HTML.

Defer parsing of JavaScript

Nel codice, muovi gli Javascrip nella parte bassa, oppure attiva il caricamento asincrono. Le altre risorse caricano più velocemente.

Rimuovi il CSS inutilizzato

Gli sviluppatori tendono a creare template multifunzione con numerosi script. Rimuovere le parti di CSS che non servono può essere d’aiuto, magari con strumenti come UnusedCSS che ci aiutano a verificare quale codice CSS non serve.

Rimanda immagini fuori schermo

Utilizza immagini dimensionate correttamente per lo schermo di pc, tablet e smartphone. Impara ad usare bene il responsive.

Evita i reindirizzamenti tra più pagine

Troppi redirect rallentano? Decisamente sì.

Elimina le risorse di blocco della visualizzazione

Dobbiamo applicare a javascript e CSS async o defer, dando preferenza ai contenuti della pagina. Javascript on footer può essere sicuramente di grande aiuto.

Problemi con i font

Alcuni template eseguono chiamate multiple a librerie di font, come i Google Fonts. Caos Webfont riesce ad ovviare il problema, scaricandoli in locale e creando il foglio di stile.

Cache, minify Javascript e HTML, compressione GZip: i plugin WordPress

1. Wp Rocket è una delle migliori soluzioni per la gestione della cache, occupandosi nel contempo di poter ottimizzare ogni aspetto del nostro portale. Può gestire i caricamenti asincroni, minifizzare e combinare gli script della pagina, e molto altro ancora.
2. W3 Total Cache: assieme a Wp Rocket è sicuramente una delle migliori proposte per la gestione della cache, se è ben configurato, la velocità di caricamento delle pagine si riduce sensibilmente. Purtroppo non è sempre così facile da impostare, è infatti necessario conoscere a fondo le caratteristiche del server utilizzato, o richiederle al proprio sistemista.
3. Super Cache
4. Autoptimze è un plugin wordpress che semplifica il processo di ottimizzazione. Può agire da solo o in combinazione con altri plugin cache.Ottimo per minimizzare, aggregare e mettere nella cache script e codici. Lavora bene anche su siti con protocollo HTTP/2.
5. Hummingbirds è un’altra soluzione particolarmente apprezzata da molti utenti, per un sistema di velocizzazione di WordPress abbastanza elementare da configurare.
6. Compressione Gzip: va abilitata sul server, ed è una funzionalità integrata nei migliori plugin di cache ed ottimizzazione. Tra i più noti plugin WordPress per la compressione Gzip, c’è Enable Gzip Compression.
7. Asset Clean up, un vero e proprio booster, che consente di personalizzare quali script vanno caricati, ed in quali pagine. Ad esempio, quelli relativi al Contact form, li ho lasciati esclusivamente per la pagina del modulo contatti, non su tutte le pagine. E’ importantissimo. Il numero di chiamate HTTP risulta notevolmente ridotto, se eliminiamo Javascript e CSS inutilizzati. Quelli necessari, invece, vengono conbinati tra di loro. Molto simile a questo c’è anche Fresoul deactivate plugin.
8. Usage DD esegue un check all’interno portale per verificare l’uso delle risorse disponibili e la presenza di eventuali errori o problematiche. Tra le possibili alternative, citiamo WP Health Checkup, e Health Check, nonchè – in alcuni casi – l’attivazione del debug . Non mettiamo Wp P3 Profiler, che è un plugin abbandonato e non più aggiornato.

Ottimizzare le immagini

L’ottimizzazione delle immagini per il web dovrebbe essere una procedura abbastanza comune: le immagini caricate dovrebbero essere già in formato compresso, e di dimensioni in pixel adatte alla visualizzazione corretta. E’ importante utilizzare un formato .png o .jpg anche se ormai si predilige l’utilizzo di nuovi formati come il Webp

Migliori plugin per ottimizzare le immagini su WordPress

Possiamo utilizzare:

Cloudflare può ottimizzare la distribuzione ed il caricamento delle immagini, così come il loro spostamento su CDN (Content Delivery Network). Utile anche un sistema di Lazy Load per ridurre i tempi di attesa per il caricamento.

Ottimizzazione lato server

Anche se è un argomento relativamente complesso per i webmasters, l’ottimizzazione lato server è sicuramente la più importante. La figura di un sistemista o, più in generale, dell’assistenza dell’hosting utilizzato, deve essere in grado di mettere in atto le normali procedure di ottimzzazione procedendo, nel contempo, a fornire la massima assistenza agli sviluppatori. La buona riuscita dell’ottimizzazione in termini di velocità e performance non dipende, infatti, semplicemente dall’installazione dei plugin WordPress.

In questa ottica vale la pena citare l’error log. Generalmente è un semplice file di testo presente sul proprio server, che segnala gli errori riscontrati durante il normale funzionamento del proprio sito web. Si presenta con un aspetto simile:

Anche per i meno esperti, “googlando” un poco o leggendo i contenuti, è possibile individuare quale elemento del proprio sito sta causando problematiche e/o limitando le performance globali.

Fragmented caching: sicuramente un aspetto da approfondire, solo per i più esperti.
Il protocollo di rete HTTP/2 è più veloce? Ne sentiremo sicuramente parlare.

Ottimizzazione o velocità

Anche i webmasters più esperti a volte si perdono in procedure di ottimizzazione che complessivamente generano più problemi che benefici. Utilizzando, ad esempio, Pingom Tools (già citato in precedenza), riusciamo in primis ad avere un quadro ben definito dei tempi di caricamento dei singoli elementi di ogni pagina, così da comprendere quali sono quelli che rallentano e quali vanno eliminati.

Altri sistemi di ottimizzazione di terze parti

Sul web si susseguono offerte di aziende come Ezoic che consentono una rapida integrazione con una CDN e offrono nel contempo interessanti possibilità di velocizzare il caricamento delle singole pagine. La scelta sul possibile utilizzo di tali opportunità è strettamente personale e legata alla fiducia che l’utente ripone nell’azienda fornitrice, verso quali sarà necessario dirottare i DNS del sito web.