Guida completa all’ottimizzazione della velocità dei siti WordPress: le strategie essenziali per migliorare i Core Web Vitals

Oggi, in un’epoca in cui l’esperienza digitale è di fondamentale importanza, la velocità dei siti web è strettamente legata alla retention degli utenti, ai tassi di conversione e alle posizioni nei motori di ricerca. Per i siti WordPress, i fattori che influenzano le prestazioni di caricamento sono molti: dalla configurazione del server al codice dei temi, tutti possono rappresentare dei colli di bottiglia. I siti che si caricano rapidamente migliorano notevolmente l’esperienza utente e contribuiscono al miglioramento delle prestazioni SEO; in questo contesto, i “Core Web Vitals” di Google rappresentano il insieme di indicatori chiave per misurare tale esperienza.

Comprendere i Core Web Vitals e il loro significato per WordPress

Core Web Vitals è un insieme di indicatori chiave per l’esperienza utente definiti da Google, che si concentrano sulle prestazioni di caricamento delle pagine, sull’interattività e sulla stabilità visiva dello stile grafico. Questi indicatori influenzano direttamente la posizione di un sito web nei risultati di ricerca di Google. Per i gestori e i sviluppatori di siti WordPress, ottimizzare questi indicatori rappresenta un lavoro fondamentale per aumentare la competitività del proprio sito web.

LCP (Maximum Content Paint): il momento in cui viene completato il disegno di tutti i componenti del contenuto visivo.

LCP (Last Content Paint) misura il tempo necessario per completare la rendering del blocco di testo più grande o dell’elemento grafico più grande all’interno della viewport, a partire dal momento in cui la pagina inizia ad essere caricata. Per offrire un’esperienza utente positiva, il valore di LCP dovrebbe essere inferiore a 2,5 secondi. In WordPress, le cause comuni di un valore LCP negativo includono immagini di grandi dimensioni non ottimizzate, codice CSS e JavaScript che bloccano il processo di rendering, nonché tempi di risposta lenti del server.

FID (First Input Delay): Il ritardo nella prima digitazione da parte dell’utente.

Il FID (First Interaction Time) misura il tempo trascorso dal momento in cui l’utente interagisce per la prima volta con una pagina (ad esempio cliccando su un link o un pulsante) fino al momento in cui il browser riesce effettivamente a rispondere a quell’interazione. Questo indicatore è influenzato principalmente da compiti di esecuzione JavaScript che richiedono troppo tempo sul thread principale del browser. Per garantire un’interazione fluida con la pagina, il valore del FID dovrebbe essere inferiore a 100 millisecondi. Nei siti WordPress, il caricamento di troppi script di terze parti o codice di plugin scritti in modo non ottimale è spesso la causa principale di valori elevati di FID.

CLS: Offset cumulativo del layout

CLS (Cumulative Layout Shift) misura la somma dei valori relativi a tutti gli spostamenti improvvisi nella disposizione degli elementi della pagina durante il suo intero ciclo di vita. Immaginate di voler cliccare su un pulsante, ma gli elementi presenti sulla pagina si spostano all’improvviso, facendovi cliccare in un punto sbagliato: questo rappresenta un esempio di cattivo comportamento del CLS. Il punteggio CLS dovrebbe essere inferiore a 0,1. In WordPress, immagini senza dimensioni specificate, annunci pubblicitari, contenuti inseriti (ad esempio, iframe) o contenuti inseriti dinamicamente (come finestre pop-up) possono causare spostamenti nella disposizione degli elementi della pagina, influenzando negativamente il punteggio CLS.

UltaHost – Hosting per siti WordPress

Garanzia di rimborso entro 30 giorni, larghezza di banda illimitata e accesso ai database, protezione gratuita contro gli attacchi DDoS; sconto del 50% per l’acquisto di un piano valido per 3 anni (da 3 a 4 TB di spazio di archiviazione).

pagina di accesso

Ottimizzazioni di base per i server e gli ambienti di hosting

I lavori di ottimizzazione iniziano dall’infrastruttura: un ambiente di hosting non configurato correttamente può rendere tutte le successive azioni di ottimizzazione del lato front-end meno efficaci di quanto potrebbero essere.

Scegliere e configurare un host ad alte prestazioni

I server condivisi, sebbene siano economici, presentano gravi problemi di condivisione delle risorse e di solito non garantiscono prestazioni stabili e elevate. Per i siti web che richiedono elevate velocità di caricamento, si consiglia di passare a server gestiti da WordPress, VPS (Virtual Private Server) o server cloud. Queste soluzioni offrono un’isolazione hardware migliore, risorse dedicate e un’ottimizzazione più approfondita dello stack tecnologico di WordPress. I server gestiti da WordPress includono solitamente cache a livello di server, servizi CDN (Content Delivery Network) e le ultime versioni di PHP.

Si consiglia di leggere La guida definitiva all'ottimizzazione della velocità dei siti WordPress: dall'introduzione alla perfezione.。

Aggiornare la versione di PHP e configurare OPcache

Utilizzate sempre la versione stabile e più recente di PHP che sia supportata. La serie PHP 8.x offre notevoli miglioramenti in termini di prestazioni rispetto a PHP 5.6 o 7.x, con un’esecuzione più efficiente e un consumo di memoria ridotto. Inoltre, assicuratevi di abilitare e configurare correttamente OPcache. OPcache memorizza il bytecode dei script PHP precompilati in memoria, evitando il costo della ricompilazione ad ogni esecuzione; questo è particolarmente vantaggioso per i siti WordPress che utilizzano un gran numero di plugin o temi complessi.

Puoi… php.ini Verifica o regola le impostazioni di OPcache:

opcache.enable=1
opcache.memory_consumption=128
opcache.max_accelerated_files=10000
opcache.revalidate_freq=2

Ottimizzazione del caricamento e della rendering dei risorse front-end

La velocità percepita dall’utente deriva principalmente dal processo di rendering del browser. Ottimizzare il caricamento, l’esecuzione e la visualizzazione dei risorse front-end rappresenta un mezzo diretto per migliorare i punteggi dei Core Web Vitals.

Ottimizzazione delle immagini e caricamento differito.

Le immagini sono solitamente i file più voluminosi all’interno di una pagina web. Le strategie di ottimizzazione includono:
1. Utilizzare un formato moderno: convertire i file JPEG e PNG in formato WebP per ridurne notevolmente le dimensioni senza compromettere la qualità dell’immagine. È possibile farlo utilizzando strumenti appositi. wp_get_attachment_image_srcset La funzione viene implementata in collaborazione con un plugin.
2. Specificare le dimensioni dell’immagine: sempre…

Non ho bisogno di un amico che cambia ogni volta che soffia il vento.

Impostazioni delle etichette width 和 height Gli attributi rappresentano una delle misure più importanti per prevenire i problemi legati al CLS (Consistent Layout Style).
3. Implementazione del caricamento differito: utilizzare il meccanismo di caricamento “lazy loading” nativo per le immagini presenti al di fuori della prima pagina.loading=”lazy”), oppure tramite JavaScript.

hosting.com Hosting condiviso

Prestazioni elevate con CPU AMD EPYC, storage SSD NVMe e LiteSpeed, supporto interno di esperti 24 ore su 24, 7 giorni su 7, misure di sicurezza avanzate, tra cui SSL, brute force, malware e protezione DDoS, risparmi fino a 73%

pagina di accesso

Eliminare i risorse che causano blocchi nella rendering (l’elaborazione grafica del contenuto).

I file CSS e JavaScript, se non gestiti correttamente, possono bloccare il rendering della pagina da parte del browser.
1. Ottimizzazione del CSS: Rimuovere il CSS non utilizzato, inserire il CSS essenziale direttamente nel codice (CSS “above-the-fold”) e caricare in modo asincrono il CSS non essenziale. Plugin come Autoptimize possono aiutare in questo processo.
2. Ottimizzazione del JavaScript: Etichettare i codici JavaScript non essenziali come “non critici” (non fondamentali per il funzionamento del sito). async 或 deferUtilizzare defer È possibile garantire che lo script venga eseguito in ordine corretto e che non blocchi l’analisi del codice HTML.

È possibile modificare il codice presente nel tema in modo da caricare i script in modo differito (cioè in modo ritardato) utilizzando il seguente frammento di codice:

function defer_parsing_of_js( $url ) {
    if ( is_user_logged_in() ) return $url; // 不对登录用户启用
    if ( FALSE === strpos( $url, '.js' ) ) return $url;
    if ( strpos( $url, 'jquery.js' ) ) return $url; // 排除可能依赖的库
    return str_replace( ' src', ' defer src', $url );
}
add_filter( 'script_loader_tag', 'defer_parsing_of_js', 10 );

Attuare strategie di caching efficaci

Il caching è uno dei metodi più efficaci per migliorare la velocità di WordPress: consente di rendere statiche le pagine generate dinamicamente, riducendo notevolmente i tempi di elaborazione da parte del server e il numero di query al database.

Si consiglia di leggere Esplorare i migliori temi per WordPress: una guida completa dalla scelta, alla personalizzazione, all’ottimizzazione delle prestazioni。

Costruire un sistema di cache a più livelli

Un sistema di cache solido dovrebbe includere più livelli:
1. Caching delle pagine: Vengono generate pagine HTML statiche complete per i visitatori anonimi. Questo rappresenta il metodo più efficace per migliorare i tempi di caricamento delle pagine (TTFB – Time To First Byte) e i tempi di risposta del server (LCP – Last Content Packet). È possibile implementarlo facilmente utilizzando plugin come WP Rocket, W3 Total Cache, o soluzioni offerte dagli host (ad esempio LiteSpeed Cache).
2. Caching degli oggetti: Storire i risultati delle query al database nella memoria (ad esempio, in Redis o Memcached). Per siti con contenuti dinamici e un elevato carico di query al database (come forum o negozi gestiti con WooCommerce), il caching degli oggetti può ridurre notevolmente il carico sul database.
3. Caching del browser: impostando i header delle risposte HTTP, si indica al browser di memorizzare localmente risorse statiche (come immagini, CSS, JS), riducendo così il numero di download durante accessi ripetuti.
4. CDN caching: I contenuti statici vengono distribuiti su server distribuiti in tutto il mondo; gli utenti ottengono tali contenuti dal nodo più vicino a loro geograficamente, riducendo notevolmente i tempi di latenza e migliorando in modo significativo l’esperienza di navigazione per i visitatori provenienti da tutto il mondo.

Punti chiave per la configurazione dei plugin di cache

Quando si utilizza un plugin di cache, è necessario prestare attenzione alle seguenti configurazioni:
Pagine da escludere: non memorizzare nella cache le pagine dinamiche come il carrello, il profilo utente, la pagina di checkout, ecc.
Prefetching: generare una cache per l'intero sito web in anticipo, per evitare che il primo visitatore debba affrontare un cold start.
Regole di pulizia della cache: impostare regole di pulizia automatiche ragionevoli, ad esempio quando si pubblica un nuovo articolo, pulire la cache solo della home page, delle pagine degli articoli e delle pagine delle categorie correlate, anziché svuotare l'intero sito.

Hosting condiviso InterServer

Hosting condiviso $2,50 USD al mese, primo mese $0,1 USD codice promozionale tryinterserver, 461 script di applicazioni cloud, installazione con un clic.

pagina di accesso

Manutenzione del database e gestione dei temi per i plugin

Dietro la flessibilità e l’usabilità di WordPress ci sono un database in costante crescita e possibili ridondanze nel codice. Buone abitudini di manutenzione sono la chiave per garantire il corretto funzionamento del sito web nel lungo periodo.

Ottimizzare regolarmente il database.

Con il passare del tempo, il database di WordPress accumula versioni modificate, bozze, commenti inutili, dati temporanei scaduti e altre informazioni ridondanti. Una pulizia regolare può ridurre le dimensioni del database e migliorare l’efficienza delle query.
È possibile effettuare pulizie in modo sicuro utilizzando plugin come WP-Optimize o Advanced Database Cleaner. È anche possibile procedere manualmente tramite phpMyAdmin o eseguendo comandi SQL; ad esempio, per eliminare i record di revisione degli articoli.

DELETE FROM wp_posts WHERE post_type = ‘revision’;

(Dovete assolutamente creare un backup del database prima di eseguire l’operazione.)

Si consiglia di leggere La guida definitiva all'ottimizzazione delle prestazioni dei siti WordPress: dall'introduzione alla perfezione.。

Scegliere e gestire con attenzione i plugin e i temi (temi grafici per i siti web).

Ogni plugin e tema potrebbe aumentare il numero di richieste HTTP, introdurre file CSS/JS aggiuntivi o eseguire query al database inefficienti.
“La qualità conta più della quantità”: installa soltanto i plugin assolutamente necessari, che siano ben valutati dagli utenti e vengano aggiornati con frequenza.
– Audit delle prestazioni: Utilizzare Query Monitor o il plugin P3 (Plugin Performance Profiler) per individuare quali plugin rallentano in modo significativo la velocità del sito web.
– Efficienza tematica: Scegliere temi con codice semplice, che seguano gli standard di codifica di WordPress e che si concentrino sulle prestazioni del sito. Evitare l’uso di temi “onnicomprensivi” che offrono troppe funzionalità decorative ma inutili.

Riassumendo

Ottimizzare la velocità di un sito WordPress al fine di migliorare i valori dei Core Web Vitals rappresenta un progetto sistematico che coinvolge aspetti legati all’infrastruttura, all’ingegneria front-end, alle strategie di caching e alla manutenzione quotidiana del sito. La chiave del successo consiste nell’adottare un approccio completo e misurabile: innanzitutto, utilizzare strumenti di diagnosi per individuare i punti di blocco specifici relativi ai parametri LCP, FID e CLS; successivamente, intervenire a livelli fondamentali come la configurazione del server e di PHP per garantire una base solida per il funzionamento del sito; in seguito, ottimizzare in modo sistematico il caricamento e l’esecuzione di immagini, CSS e JavaScript; poi, elevare ulteriormente le prestazioni grazie a meccanismi di caching a più livelli; infine, mantenere i risultati ottenuti attraverso buone pratiche di gestione del database e degli plugin. Monitorando costantemente questi indicatori chiave e apportando modifiche mirate, il tuo sito WordPress non solo offrirà un’esperienza utente eccellente, ma si posizionerà anche in modo vantaggioso nella concorrenza sui motori di ricerca.

FAQ - Domande frequenti

Ho già installato il plugin per il caching, ma perché il punteggio di PageSpeed Insights rimane basso?

I plugin di cache mirano principalmente a migliorare la velocità di generazione delle pagine da parte del server (riducendo i tempi di caricamento, indicati con TTFB e LCP), ma strumenti come PageSpeed Insights valutano anche l’ottimizzazione del lato client. Se il tuo punteggio in PageSpeed Insights non è elevato, è molto probabile che il problema risieda nei “risorse del lato client”: ad esempio, immagini di dimensioni eccessive, utilizzo di formati obsoleti, codice CSS/JS che bloccano il processo di rendering, o mancata specifica delle dimensioni delle immagini, il che può causare problemi legati al CLS (Cumulative Layout Shift). I plugin di cache non sono in grado di risolvere questi problemi legati al lato client. È necessario utilizzare strumenti di diagnosi per ottenere suggerimenti specifici e apportare modifiche mirate, seguendo le indicazioni presenti nella terza parte di questo articolo, intitolata “Ottimizzazione del caricamento e del rendering delle risorse del lato client”.

È necessario trattare in modo diverso l’ottimizzazione dei Core Web Vitals per i dispositivi mobili e per i desktop?

Sì, è molto importante trattare i diversi dispositivi in modo appropriato. I dispositivi mobili e quelli desktop condividono solitamente lo stesso set di temi e lo stesso codice, ma ci sono grandi differenze nelle condizioni di rete, nelle prestazioni dei dispositivi e nelle dimensioni degli schermi. Gli utenti mobili si trovano spesso in ambienti di rete più lenti (ad esempio, con connessione 4G) e quindi sono più sensibili all’efficienza del caricamento dei contenuti. Durante l’ottimizzazione, è fondamentale assicurarsi che i valori relativi ai Core Web Vitals siano soddisfacenti per i dispositivi mobili, poiché Google utilizza principalmente le versioni mobili delle pagine per l’indicizzazione e la classificazione. Durante i test, è necessario esaminare separatamente i report relativi ai dispositivi mobili e a quelli desktop, e prestare attenzione al fatto che i dispositivi mobili potrebbero caricare immagini di dimensioni o stili diversi.

L’utilizzo di troppi plugin di ottimizzazione potrebbe effettivamente rallentare il funzionamento del sito web.

È del tutto possibile; questo è ciò che viene definito “paradosso dell’ottimizzazione”. Ogni plugin aumenta leggermente il carico di esecuzione del codice PHP e il carico sul pannello di amministrazione del sito. Se vengono installati più plugin con funzionalità sovrapposte (ad esempio, due plugin di cache o tre plugin per l’ottimizzazione delle immagini), questi possono interferire tra loro, generando richieste HTTP aggiuntive o eseguendo operazioni ripetute, con conseguente peggioramento delle prestazioni del sito. La pratica migliore consiste nel valutare attentamente le funzionalità dei plugin, scegliere un insieme di plugin che copra tutte le esigenze o che lavorino bene insieme, e attenersi al principio del “minimo indispensabile”. Inoltre, è consigliabile utilizzare regolarmente strumenti di analisi delle prestazioni per verificare l’effettivo impatto dei plugin sul carico del sito.