Performance

Core Web Vitals Spiegati Semplici: LCP, INP e CLS

Core Web Vitals: cosa sono LCP, INP e CLS, quali soglie contano, perché i page builder li peggiorano e come misurare il tuo sito gratis.

Foto di Alessandro Zoncada - Web Design Milano
Alessandro Zoncada
Web Designer
28 Giugno 20268 min
Core Web Vitals Spiegati Semplici: LCP, INP e CLS — Performance, articolo di Alessandro Zoncada
Indice dei contenuti

I Core Web Vitals sono tre metriche con cui Google misura l'esperienza reale di chi visita una pagina: LCP sotto 2,5 secondi, INP sotto 200 millisecondi, CLS sotto 0,1. Si misurano gratuitamente con PageSpeed Insights e riguardano soprattutto la navigazione da smartphone, dove i problemi emergono per primi.

Le tre metriche e le soglie da rispettare

MetricaCosa misuraBuonoDa migliorareScarso
LCPQuando compare l'elemento principale della pagina≤ 2,5 s2,5 – 4 s> 4 s
INPQuanto la pagina è reattiva quando ci interagisci≤ 200 ms200 – 500 ms> 500 ms
CLSQuanto il layout si sposta mentre carica≤ 0,10,1 – 0,25> 0,25
INP ha sostituito la vecchia metrica FID nel 2024: se leggi guide che parlano ancora di FID, sono superate.

LCP: perché il contenuto principale tarda ad apparire

L'LCP misura quanto tempo passa prima che compaia l'elemento più grande visibile senza scorrere — di solito l'immagine di apertura o il titolo principale. È la metrica che corrisponde più da vicino alla sensazione di "sito lento".

Le cause più frequenti sono sempre le stesse: un'immagine di apertura pesante che nessuno ha ottimizzato, font caricati da server esterni che bloccano la comparsa del testo, fogli di stile e script che devono essere scaricati ed eseguiti prima che si veda qualcosa, e un hosting economico che impiega troppo a rispondere alla prima richiesta.

INP: la metrica che punisce il codice in eccesso

L'INP misura quanto tempo passa tra un'interazione — un tocco su un menu, un click su un pulsante — e il momento in cui la pagina reagisce visibilmente. È la metrica dove i siti costruiti accumulando plugin soffrono di più.

Il motivo è che ogni estensione porta con sé il proprio codice JavaScript, e tutto quel codice compete per lo stesso thread del browser. Quando l'utente tocca qualcosa, il browser deve finire quello che sta facendo prima di rispondere. Su un computer recente è impercettibile; su uno smartphone di fascia media diventa un ritardo che si sente.

CLS: gli elementi che saltano mentre leggi

Il CLS misura quanto gli elementi si spostano durante il caricamento. È il fenomeno per cui stai per toccare un link e la pagina scivola sotto il dito, facendoti premere qualcos'altro.

Le cause sono quasi sempre banali e risolvibili: immagini inserite senza dichiararne le dimensioni, banner dei cookie che si inseriscono sopra il contenuto, pubblicità che occupa spazio solo dopo essere stata caricata, font che al caricamento cambiano dimensione al testo. È la metrica meno costosa da sistemare e quella su cui vedo più siti fermi su valori scarsi per pura disattenzione.

Perché i page builder partono svantaggiati

Non è una questione ideologica, è aritmetica. Uno strumento che permette di trascinare qualsiasi elemento ovunque deve generare una struttura molto più profonda e generica di quella che servirebbe a quel layout specifico, e deve caricare il codice necessario a gestire tutte le combinazioni possibili — anche quelle che nella tua pagina non usi.

A questo si somma il fatto che ogni plugin aggiunge i propri fogli di stile e i propri script, spesso su ogni pagina del sito anche dove non serve. Un modulo di contatto presente solo nella pagina contatti carica frequentemente il proprio codice ovunque.

Un sito sviluppato su misura non ha un vantaggio magico: ha il vantaggio della sottrazione. Nella pagina finisce il codice che quella pagina usa, e nient'altro. È il motivo principale per cui, a parità di contenuti, un progetto su misura tende a partire da valori migliori — argomento che approfondisco nel confronto tra WordPress e sviluppo su misura.

Come misurare il tuo sito gratis

  • PageSpeed Insights: incolli l'URL e ottieni sia i dati di laboratorio sia, se il sito ha abbastanza traffico, i dati raccolti dagli utenti reali di Chrome. Guarda sempre la scheda mobile per prima
  • Search Console, sezione Segnali web essenziali: mostra l'andamento nel tempo su tutte le pagine del sito, non su una sola
  • Lighthouse, integrato negli strumenti per sviluppatori di Chrome: utile durante le modifiche, perché gira in locale

Una precisazione che evita fraintendimenti: il punteggio complessivo da 0 a 100 di PageSpeed è un indicatore di laboratorio, misurato in condizioni simulate. Quello che conta davvero sono le tre metriche raccolte sugli utenti reali, che possono raccontare una storia diversa. Inseguire il 100 su 100 in laboratorio è un esercizio sterile; portare LCP, INP e CLS dentro le soglie sui dati reali no.

Da dove partire, in ordine di resa

  1. Immagini: formati moderni, dimensioni adeguate a come vengono mostrate, caricamento differito per quelle sotto la prima schermata. È quasi sempre l'intervento con il rapporto risultato/sforzo migliore
  2. Dimensioni dichiarate su immagini e contenitori: sistema il CLS con poche righe
  3. Rimozione del codice inutilizzato: plugin disattivati ma ancora installati, script di servizi non più usati
  4. Font: limitare le varianti caricate e servirle in modo che non blocchino la comparsa del testo
  5. Hosting: se il server impiega troppo a rispondere, nessuna ottimizzazione del codice compensa

Perché conviene occuparsene

La ragione più concreta non ha niente a che vedere con le classifiche: è che le persone abbandonano una pagina prima ancora che finisca di caricare. Chi arriva da smartphone, magari in movimento e con una connessione mediocre, dà a un sito pochissimi secondi prima di tornare indietro.

Un sito che risponde subito e non fa saltare il contenuto sotto il dito è semplicemente più usabile. È un vantaggio che si misura in persone che restano e leggono, non in metriche astratte.

Domande frequenti

Quali sono le soglie dei Core Web Vitals?

LCP entro 2,5 secondi, INP entro 200 millisecondi, CLS entro 0,1. Sono considerate superate quando il 75% delle visite reali rientra nella soglia, misurato prevalentemente su mobile.

Perché conviene migliorare i Core Web Vitals?

Perché misurano quanto una pagina è usabile davvero: quanto tempo passa prima che si veda qualcosa, quanto reagisce al tocco e quanto resta ferma mentre carica. Sono le tre cose che fanno abbandonare un sito da smartphone.

Il punteggio di PageSpeed Insights è quello che conta?

No. Il punteggio da 0 a 100 è un indicatore di laboratorio, utile in fase di sviluppo. Quello che conta sono le tre metriche misurate sugli utenti reali, che possono raccontare una storia diversa.

Un sito WordPress può superare i Core Web Vitals?

Sì, con tema leggero, pochi plugin e un hosting adeguato. Richiede però disciplina costante: ogni estensione aggiunta dopo il lancio tende a erodere i margini guadagnati.

Vuoi sapere come sta il tuo sito?

Posso misurare i Core Web Vitals del tuo sito e dirti quali interventi darebbero il guadagno maggiore, in ordine di priorità e senza impegno. Scrivimi.

Disclaimer: Le informazioni di questo articolo hanno finalità informative e orientative. Dati, costi e riferimenti sono indicativi e possono variare in base a settore, periodo ed esigenze specifiche del progetto. Non costituiscono consulenza personalizzata né promessa di risultati.
Logo di Alessandro Zoncada

Alessandro Zoncada

Web Designer

Web designer e sviluppatore frontend specializzato in progetti scritti su misura, senza template. Mi occupo di trasformare idee in siti web professionali, curati nel codice e nelle prestazioni.