Core Web Vitals mostra le tre metriche su cui Google si posiziona - LCP, CLS e INP - misurate in tempo reale sulla pagina che stai visualizzando, valutate rispetto alle soglie di Google e ricondotte all'elemento esatto dietro ciascun numero.
Core Web Vitals decide parte del posizionamento delle tue pagine, ma i soliti modi per misurarle sono scomodi. Gli strumenti di laboratorio generano un carico sintetico che nessuno sperimenta. Search Console segnala gli utenti reali, con quattro settimane di ritardo, raggruppati in segmenti URL. Nessuno dei due ti dice quale elemento della pagina di fronte a te è il problema.
Questo strumento misura la pagina che stai effettivamente guardando, mentre la usi. LCP, CLS e INP ricevono ciascuno un riquadro con il proprio valore, una valutazione Buono, Richiede lavoro o Scarso rispetto alle soglie pubblicate di Google e una barra che mostra la tua posizione. FCP e TTFB si affiancano a loro per il contesto, perché un LCP lento causato da un server lento è un problema diverso da quello causato da un'immagine pesante.
Le definizioni corrispondono a ciò che Chrome riporta a CrUX, il che è importante se intendi confrontare i numeri con Search Console. CLS utilizza finestre di sessione (una finestra termina dopo un intervallo di un secondo o dopo cinque secondi e vince la finestra peggiore) anziché sommare ingenuamente tutti i turni. INP è il 98° percentile delle tue latenze di interazione, che per una visita normale è semplicemente l'interazione più lenta. LCP smette di cambiare alla tua prima interazione, esattamente come fa Chrome.
Più utilmente, ogni numero viene attribuito. Il pannello nomina l'elemento di disegno più grande, gli elementi che si sono spostati e le interazioni più lente, e un pulsante Mostra scorre fino a ciascuno di essi e lo delinea sulla pagina. Invece di sapere che CLS è 0.31, vedi il banner che spinge verso il basso i tuoi contenuti. Copia il rapporto ti consegna il tutto come testo per un ticket.
Le tre metriche di classificazione si aggiornano mentre utilizzi la pagina: lo scorrimento sposta CLS, facendo clic e digitando sposta INP. Ciascuno è valutato Buono, Richiede lavoro o Scarso rispetto alle soglie di Google.
Denomina l'elemento di verniciatura più grande, gli elementi che si sono spostati e le interazioni più lente. Premi Mostra per scorrere fino a uno qualsiasi di essi e delinearlo direttamente sulla pagina.
CLS utilizza finestre di sessione con un intervallo di 1 secondo e un limite di 5 secondi, INP è il 98° percentile delle latenze di interazione e LCP si blocca alla prima interazione, quindi i tuoi numeri sono in linea con Search Console.
First Contentful Paint e Time To First Byte si trovano accanto ai tre grandi, quindi puoi distinguere un server lento da un'immagine di eroe pesante prima di iniziare a ottimizzare la cosa sbagliata.
Elenca le tue interazioni più lente con il tipo di evento e l'elemento coinvolto, in modo che sia possibile trovare un menu a discesa o un filtro lento anziché indovinarlo.
Con un clic copia ogni metrica, valutazione e selettore offensivo come testo semplice, pronto per essere incollato in un ticket, una richiesta pull o un'e-mail del cliente.
Conferma che LCP, CLS e INP siano in verde su un nuovo modello prima che venga pubblicato, anziché scoprirlo da Search Console un mese dopo.
Search Console ti dice che un gruppo di URL non supera il CLS; aprine uno con questo strumento e vedi esattamente quale elemento effettua lo spostamento.
Scorri la pagina e guarda CLS salire, quindi premi Mostra per delineare l'annuncio, il banner o il carattere web a caricamento tardivo che sta spostando i tuoi contenuti.
Fai clic su filtri, menu e modalità, quindi leggi l'elenco delle interazioni più lente per scoprire quale controllo costa centinaia di millisecondi.
Registra i numeri, implementa la correzione, quindi misura nuovamente la stessa pagina e confronta i due rapporti fianco a fianco.
Fare clic sull'icona Core Web Vitals nel dock DevSuite Pro. I riquadri metrici vengono visualizzati immediatamente utilizzando ciò che la pagina ha già registrato.
LCP è significativo solo dall'inizio del caricamento di una pagina, quindi ricarica con il pannello aperto quando desideri una lettura di cui ti puoi fidare.
Scorri l'intera pagina per esercitare CLS, quindi fai clic, tocca e digita per generare misurazioni INP. I riquadri si aggiornano man mano che procedi.
Premi Mostra accanto all'elemento LCP, una fonte di spostamento del layout o un'interazione lenta. La pagina scorre fino ad esso e lo delinea in modo che non vi siano ambiguità su quale elemento sia responsabile.
Fai clic su Copia report per un riepilogo in testo semplice di ogni metrica, valutazione e selettore. Premere Reset per avviare nuovamente CLS e INP da zero.
Installa DevSuite Pro gratuitamente e sblocca più di 71 strumenti per sviluppatori per il tuo browser.