Core Web Vitals spiegati ai proprietari di siti web

I Core Web Vitals sono tre misurazioni che Google usa per descrivere come una pagina viene percepita da un visitatore reale: quanto velocemente compare il contenuto principale, quanto rapidamente la pagina reagisce quando qualcuno tocca o clicca e se il layout salta qua e là durante il caricamento. Fanno parte dei segnali di esperienza di pagina di Google, ma il motivo più importante per occuparsene è più semplice. I visitatori abbandonano le pagine lente e instabili, e raramente ti dicono perché.

Questa guida spiega le tre metriche in modo semplice, le soglie pubblicate da Google e come decidere che cosa correggere per primo in un normale sito di una piccola impresa.

Le tre metriche in sintesi

Metrica	Cosa misura	Buono	Scarso
LCP (Largest Contentful Paint)	Tempo fino al rendering dell'elemento visibile più grande	2,5 secondi o meno	Oltre 4 secondi
INP (Interaction to Next Paint)	Quanto tempo impiega la pagina a rispondere visivamente dopo un tocco, un clic o la pressione di un tasto	200 millisecondi o meno	Oltre 500 millisecondi
CLS (Cumulative Layout Shift)	Quanto si sposta in modo inatteso il contenuto visibile	0,1 o meno	Oltre 0,25

I valori compresi tra "buono" e "scarso" rientrano in una fascia "da migliorare". Google valuta una pagina al 75° percentile delle visite reali, il che significa che tre quarti dei tuoi visitatori dovrebbero avere un'esperienza pari o migliore della soglia. Un solo test veloce sul tuo portatile non dimostra che la pagina superi la verifica.

Largest Contentful Paint: la pagina compare?

L'LCP considera l'immagine, il poster video o il blocco di testo più grande nella prima schermata e registra quando ne termina il rendering. Nella maggior parte dei siti si tratta di un'immagine hero o di un titolo grande. Un LCP lento deriva di solito da una di quattro cause: una risposta lenta del server, un'immagine pesante o formattata male, CSS o JavaScript che bloccano il rendering, oppure il browser che scopre troppo tardi l'immagine chiave.

Interaction to Next Paint: la pagina risponde?

L'INP ha sostituito la vecchia metrica First Input Delay a marzo 2024. Mentre il First Input Delay considerava solo la prima interazione e solo il ritardo prima del suo avvio, l'INP prende in esame le interazioni durante tutta la visita e riporta una delle più lente, dall'input fino al disegno del fotogramma successivo. Le pagine che si caricano in fretta ma sembrano "appiccicose" quando apri un menu o premi un pulsante di solito hanno un problema di JavaScript: troppo codice in esecuzione contemporaneamente sul thread principale.

Cumulative Layout Shift: la pagina resta ferma?

Il CLS somma gli spostamenti inattesi degli elementi visibili. Lo hai provato quando stavi per toccare un link e sopra è comparso un banner che lo ha spinto in basso. Le cause più comuni sono immagini senza attributi di larghezza e altezza, annunci ed embed che si caricano in ritardo, font che si sostituiscono e cambiano la dimensione del testo e banner dei cookie inseriti in cima alla pagina.

Dati di laboratorio e dati sul campo

Esistono due tipi di misurazione, e confonderli genera equivoci.

• I dati sul campo provengono da visitatori reali che usano dispositivi e reti reali. Google li raccoglie dagli utenti Chrome e li mostra in PageSpeed Insights e Search Console quando il tuo sito ha traffico sufficiente. Sono quelli che contano per la valutazione.
• I dati di laboratorio provengono da un test simulato, come Lighthouse. Sono riproducibili, il che li rende ideali per il debug, ma riguardano un solo dispositivo su una sola connessione.

Un piccolo sito può non avere affatto dati sul campo. In tal caso usa i test di laboratorio per trovare i problemi e considera i risultati un'indicazione, non un verdetto.

Da dove iniziare a correggere

1. Misura le pagine che contano. Testa la home page, la landing page più visitata e un tipico articolo o pagina prodotto con un profilo mobile. Non fare la media dell'intero sito.
2. Correggi per prima la metrica più lenta. Se l'LCP è scarso e il CLS è a posto, lavora sull'LCP.
3. Parti dai miglioramenti economici. Comprimi e ridimensiona l'immagine hero, imposta le dimensioni delle immagini, abilita il caching, valuta una CDN e rimuovi plugin o script che non usi più.
4. Ripeti il test dopo ogni modifica. Cambia una cosa alla volta per sapere che cosa ha aiutato.
5. Aspetta che i dati sul campo si aggiornino. I numeri reali vengono raccolti su un periodo mobile, quindi i miglioramenti impiegano alcune settimane a mostrarsi per intero.

Che cosa c'entra l'hosting

I Core Web Vitals riguardano soprattutto come è costruita una pagina, ma l'hosting stabilisce la base di partenza. Una risposta lenta del server ritarda tutto ciò che segue, e questo danneggia direttamente l'LCP. Server affollati, versioni obsolete di PHP e assenza di caching lato server aggiungono tempo prima che il browser riceva il primo byte. Un buon lavoro sul front-end non può compensare del tutto un back-end lento.

Un'aspettativa realistica

Superare tutte e tre le metriche è un obiettivo valido, ma non è un interruttore magico per il posizionamento. La pertinenza dei contenuti conta ancora molto di più. Pensa ai Core Web Vitals come a una riduzione dell'attrito: non faranno posizionare una pagina debole, ma una pagina lenta e instabile rende più difficile trattenere i visitatori che ti sei già guadagnato.

Errori comuni dei proprietari di siti

• Inseguire un punteggio Lighthouse perfetto. Un punteggio di 100 in un test di laboratorio non è l'obiettivo. L'obiettivo è superare le tre soglie per i visitatori reali.
• Testare solo su desktop. La maggior parte della valutazione avviene su mobile, e i dispositivi mobili hanno processori e connessioni più lenti.
• Installare un plugin di velocità e fermarsi lì. I plugin possono aiutare con caching e gestione delle immagini, ma non possono eliminare un'immagine hero da 3 MB o una dozzina di script di marketing.
• Ignorare i template. Le pagine costruite dallo stesso template di solito condividono gli stessi problemi, quindi correggere il template ne sistema molte in una volta. Search Console raggruppa gli URL simili proprio per questo motivo.

Tieni un semplice registro di ciò che hai cambiato e del punteggio prima e dopo. Evita di andare a tentativi quando qualcosa peggiora dopo l'aggiornamento di un plugin.

Le pagine veloci partono dal server

Su Zebra Hosting Cloud, ogni piano include il pannello di controllo Plesk, dove puoi scegliere le versioni PHP più recenti, e la CDN Cloudflare è disponibile sui siti ospitati per servire i file statici più vicino ai visitatori. Insieme coprono il lato server dell'equazione, così puoi concentrarti sulla pagina stessa. Scopri cosa offre ogni piano nella panoramica hosting.