Come ottimizzare per Google Core Web Vitals

Come prepararsi per il lancio di Core Web Vitals

Aggiornato il 15.10.2021

La correzione delle esperienze utente scadenti sul sito di un'azienda è stata spostata in cima a molti elenchi di priorità.

Una cosa che sappiamo già è che Google prevede di utilizzare e sviluppare il suo nuovo rapporto sui vitali web principali di Google Search Console. Ha lo scopo di aiutare le aziende a fare di più che semplicemente ottenere la scansione e l'indicizzazione delle loro pagine, si tratta più di renderle più preziose per gli utenti.

Cosa sono i Google Core Web Vital?

Google Core Web Vitals è un insieme di rapporti aggiunti a Google Search Console nel 2019 che comprendono un piccolo insieme di metriche di base sulla velocità di caricamento. Aiutano i professionisti del marketing e i team di sviluppo a sapere quanto bene o male un sito sta fornendo le sue pagine web. Google valuta ogni pagina web in base alle sue prestazioni nell'offrire un'esperienza piacevole ai visitatori del sito. Il rapporto Core Web Vitals descrive in dettaglio le prestazioni delle pagine Web in base ai dati di utilizzo del mondo reale, noti anche come dati sul campo.

Questi nuovi fattori di ranking si stanno avvicinando rapidamente. Sebbene ogni sito tragga vantaggio dall'aggiunta di tipi di markup dello schema essenziali, usa la nidificazione e mantieni ciò che è più importante per evitare il sovraccarico del codice.

Il 5 ottobre 2021, Google ha caricato suggerimenti utili in una presentazione di YouTube intitolata Come migliorare la pittura di contenuti più grandi per una migliore esperienza di pagina .

Suggerimenti di Google su come ottenere un punteggio LCP (Greatest Contentful Paint) migliore:

Le immagini sono in genere la causa dei problemi con Largest Contentful Paint. Ogni morso salvato può accelerare il caricamento della pagina. Usa formati di immagine moderni come AVIF e WebP. Esistono molti casi limite relativi al modo in cui viene calcolato il punteggio LCP.

Che cos'è l'esperienza della pagina Google?

L'esperienza della pagina è un sottoinsieme dell'esperienza utente.

Page Experience è incentrato sugli aspetti tecnici dei prodotti web che più spesso influenzano l'esperienza utente. Sebbene non misuri e rifletta sugli aspetti del design dell'esperienza utente come la qualità dei contenuti o il design visivo, tutti i segnali di Page Experience hanno fondamentalmente il controllo del team di sviluppatori che crea il sito web. Questi segnali hanno un effetto diretto sull'esperienza utente complessiva.

L'iniziativa intenzionale di Google di promuovere Page Experience intende avere un impatto positivo sul Web. Consideralo positivo. È utile disporre di queste metriche di performance aggiuntive correlate alle metriche aziendali per ottenere più facilmente l'adesione da parte di membri del team non tecnici.

Torniamo un po' indietro e rivediamo come siamo arrivati ​​qui.

La storia della velocità del sito e Google Core Web Vitals

Qual è la tempistica per il lancio di Google Page Experience?

Il 10 novembre 2020, Google ha annunciato: "I segnali di esperienza della pagina nella classifica verranno lanciati a maggio 2021. I nuovi segnali di esperienza della pagina combinano Core Web Vitals con i nostri segnali di ricerca esistenti, tra cui ottimizzazione mobile, navigazione sicura, sicurezza HTTPS, e linee guida interstitial invadenti”.

Facciamo il backup e otteniamo una chiara panoramica. L'anno 2010 ha visto Google iniziare per la prima volta a utilizzare la velocità di caricamento di una pagina Web su un computer desktop come segnale di ranking.

Google ha spinto la compatibilità con i dispositivi mobili come segnale di ranking a partire dal 2015. Entro il 2018, il processo Mobile-First Index è stato lanciato come ufficiale. I webmaster e i proprietari dei siti sono stati avvisati nella Search Console quando Google ha stabilito che un sito è pronto per l'indicizzazione mobile-first. Ciò avviene da parte di Google che valuta la versione mobile del tuo sito web durante il processo di valutazione ai fini della ricerca; non puoi attivarlo.

All'inizio del 2020, Google ha introdotto il suo nuovo set di strumenti all'interno della sua Google Search Console, chiamato Core Web Vitals. Ha affermato esplicitamente che le metriche in questi rapporti diventeranno segnali di ranking nel 2021. Core Web Vitals si espande sulle precedenti metriche di velocità del sito per aiutare le aziende ad affrontare il modo in cui alcune pagine Web vengono caricate con annunci mobili e file di supporto.

L'introduzione di Web Core Vitals avverte tutti i proprietari di siti Web sbandati che non si preoccupano della compatibilità con i dispositivi mobili che è chiaramente importante. Sebbene l'aggiornamento di Mobilegeddon sia stato un'implementazione lenta, ora è necessario affrontare l'importanza di rendere un sito un'esperienza migliore per gli utenti mobili .

L'investimento di Google in strumenti e rapporti su Site Speed ​​e Mobile è un segnale per i proprietari di siti Web che devono rendere i loro siti Web più facili da usare o che si aspettano che diventino solo un biglietto da visita online. Oggi annunciamo che i segnali di esperienza della pagina in classifica verranno lanciati a maggio 2021.

Quali metriche di base costituiscono l'esperienza della pagina di ricerca di Google?

Spiegazione delle prime tre metriche relative all'esperienza della pagina di ricerca di Google:

• Caricamento: LCP valuta quanto tempo impiega l'elemento di contenuto più grande (come un'immagine in primo piano, un'immagine eroe o un testo di intestazione H1) su una pagina Web specifica per diventare visibile all'interno di un riquadro di visualizzazione dei visitatori. Cerca di ottenere un LCP di 1,2 secondi o meno.
• Interattività: FID (primo ritardo di input): l'orologio parte dal momento in cui un utente interagisce per la prima volta con la tua pagina (come quando si fa clic su un collegamento, viene attivato un pulsante, ecc.) al momento in cui il browser risponde a tale interazione. Questa misurazione è derivata da qualsiasi elemento interattivo su cui la persona fa clic per la prima volta. Questo è importante nelle pagine in cui il visitatore deve fare qualcosa perché questo è quando la pagina è diventata interattiva. Chiamati anche rapporti TBT (in GTmetrix); rappresenta quanto tempo è bloccato dagli script che vengono richiamati durante il processo di caricamento della pagina. Cerca di ottenere un TBT di 150 millisecondi o meno.
• Stabilità visiva: CLS indica quanto cambiamento del layout di una pagina sperimenta un visitatore durante il caricamento della pagina. Cerca un punteggio CLS di 0,1 o meno.

Per controllare i tuoi contenuti per determinare se soddisfa la soglia dei Core Web Vitals per essere etichettati con un badge Fast Page, utilizza gli strumenti per sviluppatori di Google per valutare la velocità di caricamento. Per assistere con queste attività di ottimizzazione, GTmetrix è diventato più sofisticato. GTmetrix Reports ha aggiunto una nuova metodologia di punteggio. I precedenti rapporti PageSpeed ​​e YSlow sono stati aggiornati a un grado GTmetrix complessivo. Grazie alla tecnologia Lighthouse, gli utenti di GTmetrix ora ottengono un punteggio di prestazioni e struttura.

Che cos'è il primo ritardo di ingresso (FID)?

FID è un punteggio che valuta il tempo impiegato dal browser per gestire altre attività prima di poter gestire una persona che intraprende un'azione come un tocco o un clic. Questo segnala quanto sia reattiva l'esperienza dell'interfaccia utente per un utente e misura il carico della CPU con l'elaborazione JavaScript.

Il modo in cui una pagina esegue JavaScript, sia durante il caricamento della pagina che durante il ciclo di vita della pagina, influisce direttamente sul FID. Il tempo necessario per l'esecuzione completa di JavaScript è importante se i visitatori tentano di completare un'azione prima che l'app sia completamente pronta.

Modi per migliorare il primo ritardo di input:

• Ritardare o eliminare file di terze parti o pixel di tracciamento.
• Rinvia tutti gli script non essenziali.
• Migliora l'esecuzione di JavaScript.

GTmetric e altre cascate eseguono un'ottima traccia delle prestazioni per rivelare dove il tempo di caricamento viene consumato eccessivamente. Una volta identificati, possono essere esaminati e risolti.

Che cos'è il nuovo indicatore dell'esperienza della pagina di Google?

Google mostrerà agli utenti la qualità dei Core Web Vitals di una pagina web con il suo nuovo indicatore Page Experience. Questo è già visualizzato in alcune SERP. È simile per dimensioni e forma all'icona AMP che indica lo stato di una pagina mobile accelerata. Poiché Google è bravo a testare e fare interazioni, questo potrebbe sembrare diverso poiché è più ampiamente adottato.

Sebbene le metriche di Core Web Vitals forniscano informazioni più dettagliate rispetto a prima nei rapporti di Google Search Console, è probabile che molti falsi positivi emergano dopo l'implementazione completa.

Come determinare le attività vitali Web principali più importanti

Concentrati sulle metriche di velocità di caricamento di maggior impatto prima di intraprendere ottimizzazioni più approfondite delle prestazioni del sito web.

1. Risolvi prima tutto ciò che è etichettato come "Scarso".

2. Quindi dai la priorità al tuo elenco di attività in base ai problemi in base ai quali i problemi influiscono negativamente sulla maggior parte degli URL o ai problemi che danneggiano gli URL che generano più entrate.

3. I problemi "Richiede miglioramenti" sono ora i prossimi nell'elenco delle priorità.

La necessità di un drastico miglioramento del Layout Content Shift mi ha abbastanza sorpreso, ma è chiaramente un fattore determinante per ottenere i migliori risultati SEO. La pagina non ha annunci di caricamento in ritardo sopra il contenuto, nessun interstitial invadente e tutte le immagini avevano larghezza e altezza ben definite. Tuttavia, la dimensione dell'immagine in primo piano originale era 1280 per 860 pixel. Ciò causava un problema di ridimensionamento dell'immagine; quando i browser lo caricavano, lo ridimensionavano a 1200 per 800 pixel. Ciò provoca uno spostamento del layout e un conseguente ritardo di caricamento. Assicurati che le tue immagini abbiano le dimensioni corrette per il markup dello schema JASON-LD.

Dopo aver risolto un problema specifico in tutti i tuoi URL, puoi confermare se il problema è stato risolto per tutti gli URL. Fai clic su Avvia monitoraggio per avviare una sessione di monitoraggio di 28 giorni per verificare la presenza di istanze di questo problema nel tuo sito. Se questo problema non è presente in nessun URL del tuo sito durante la finestra di 28 giorni, il problema è considerato risolto. La presenza di quel problema in qualsiasi URL è sufficiente per contrassegnare il problema come non risolto; tuttavia, lo stato dei singoli URL rimane in fase di valutazione per tutti i 28 giorni, indipendentemente dallo stato del problema.

FAQ COMUNI SU CVW

L'apprendimento, la risoluzione dei problemi e il test/modifica di molte opzioni per migliorare i punteggi CWV può richiedere molto tempo. Ecco le risposte:

Come calcolare il punteggio CLS?

Il punteggio CLS di una pagina viene calcolato moltiplicando la proporzione dello schermo dell'utente che si è spostato in modo imprevisto durante il caricamento per la distanza percorsa. I siti a volte devono affrontare anche metà dello schermo influenzata dallo spostamento del contenuto. Questo è fastidioso per gli spettatori. Allo stesso tempo, la distanza che il contenuto doveva percorrere sullo schermo tiene conto. Pertanto, per calcolare il punteggio CLS, moltiplica l'area dello schermo interessata (0,5) per la distanza percorsa (0,15) e puoi ottenere un punteggio utile.

Quali sono le cause comuni che creano problemi di spostamento del layout del contenuto?

• Rimuovi i margini sull'immagine in primo piano : eseguendo lo strumento Lighthouse insieme a Chrome Dev Tools, su un sito Web, il codice figure class="featured-media" si è rivelato un problema. Aggiungendo questo codice CSS aggiuntivo .featured-media { img display: none; } .featured-media { img display: none; } , il punteggio delle prestazioni del desktop è migliorato immediatamente di due punti.
• Risolvi eventuali problemi con il caricamento dei caratteri : alcuni web designer preferiscono l'aspetto di caratteri Web fantasiosi per i titoli; tuttavia, spesso il modo in cui vengono caricati provoca uno spostamento del layout. Test per scoprire se ci sono potenziali problemi di diluizione della cache da risolvere e come viene fornita la dimensione complessiva dei caratteri. Abbiamo scoperto che specificando fallback font-display, aggiungendo { font-display: fallback;} , possiamo migliorare il comportamento di rendering degli elementi usando l'istruzione font face.
• Contenuto inserito dinamicamente : si verifica comunemente quando banner o moduli vengono aggiunti a una pagina in modo dinamico. Inoltre, gli utenti che non riescono a vedere una "x" per la disattivazione di un popup possono essere frustrati. Inoltre, quando gli elementi sulla pagina sono utilizzabili, sono ancora i colpevoli del motivo per cui la pagina viene riorganizzata e "spostata".
• Mancanza di specifiche dell'immagine : quando le immagini di una pagina hanno dimensioni dell'immagine sbagliate, scadenti o non specificate, i browser hanno aggiunto lavoro e tempo per caricare la pagina senza queste informazioni e quindi devono spostarsi in seguito per calcolarle.
• Incorporamenti, annunci e iframe nella pagina senza dimensioni : informando i browser dello spazio di layout necessario per questi elementi visivi nella pagina, puoi evitare che il browser debba spostarsi una volta che ognuno di questi è visivamente a posto.

Dopo aver seguito le strategie di miglioramento CLS di cui sopra, il punteggio di spostamento cumulativo del layout dello stesso sito è ora 0,01. Questo aiuta notevolmente a migliorare i risultati di ricerca per dispositivi mobili di un sito.

Quali metriche di Core Web Vitals possono essere migliorate caricando CSS Async?

Poiché è ciò che le persone vedono per prime, le metriche calcolate nella sezione above-the-fold significano garantire che i contenuti chiave visibili all'utente vengano visualizzati rapidamente. Alcuni contenuti e file di supporto possono essere caricati in background fino a quando non si raggiunge "Tempo di caricamento completo".

Secondo Koray Tugberk GUBUR proprietario di Holistic SEO, "Nella relazione tra il caricamento di file CSS come Async e l'apertura anticipata delle pagine Web per l'utente, alcune metriche di Pagespeed sono influenzate più positivamente di altre. Il caricamento più rapido dei file CSS migliora in particolare le metriche First Paint, First Contentful Paint, Largest Contentful Paint e Speed ​​Index”.

Posiziona il tuo contenuto chiave above the fold dove può essere facilmente visto per corrispondere alle intenzioni degli utenti. Non far aspettare i visitatori del sito per trovare le risposte alle loro domande.

In che modo Google misura la velocità di carico?

I suggerimenti per il miglioramento e la diagnostica trovati in PageSpeed ​​Insights sono generati da test di laboratorio; le metriche delle prestazioni sono più accurate se raccolte dai risultati sul campo. Una volta che hai un'idea generale su come migliorare PageSpeed, la logica del punteggio di Google può avere un impatto positivo sui risultati vitali del tuo web.

Tre nuove metriche delle prestazioni racchiudono questo mondo di prestazioni web. Sono supportati tramite un'API in Chrome, Chrome su Android, browser Chromium Edge. I dati su cui Google fa affidamento per la misurazione dell'esperienza della pagina derivano dal report UX di Chrome (CRUX). È composto da statistiche anonime sulle prestazioni fornite dai caricamenti di pagine reali nei browser Chrome di tutto il mondo.

Essendo indipendente dallo stato della cache, CRUX valuta tutti i normali caricamenti delle pagine, comprese le pagine Web di destinazione e di metà sessione. Salta le navigazioni soft, dette anche modifiche del percorso, all'interno di applicazioni a pagina singola. Le navigazioni soft hanno il potenziale per essere penalizzate. Punteggi CLS e valori LCP inferiori segnalano un cambiamento ridotto di utenti che subiscono cambiamenti di layout imprevisti.

Quanto è importante la compressione delle immagini per un punteggio CWV?

Non è necessario compromettere la qualità dell'immagine per ottenere un buon punteggio CWV.

I browser odierni possono gestire immagini ad alta risoluzione quando fornite; mentre vuoi ancora comprimerli, usa solo le dimensioni che ti servono per avere un bell'aspetto su display ad alta risoluzione. Puoi usare un CND e pensare di iniziare con un'immagine o uno sfondo meno complessi per iniziare. Impara e segui le linee guida per le immagini di Google.

@Jamsession18 ha chiesto a John Mueller di Google il 26 marzo 2021:

“Puoi rispondere alla mia domanda sulla qualità delle immagini utilizzate? Lavoro per un sito di notizie che sta attualmente ottimizzando per CWV e per questo, la nostra tecnologia sta comprimendo le immagini a un livello estremo a scapito della qualità dell'immagine (immagini sfocate ora). Ne vale il costo?"

“Sembra una cattiva idea. L'esperienza della pagina è solo una delle tante cose che esaminiamo per il ranking, ma se agli utenti non piacciono i tuoi contenuti, è improbabile che si convertano (comunque tu voglia) e difficilmente vorranno tornare". -???? John ???? @JohnMu

In che modo i dati sul campo e di laboratorio sono diversi?

Una differenza è che i dati di laboratorio sono utili per i test, i dati di campo sono migliori per la classifica.

I dati di laboratorio riguardano i dati sulle prestazioni trovati in un ambiente unico. Gli strumenti di sviluppo di Chrome e gli strumenti webpagetest.org sono comunemente usati per acquisire dati di laboratorio. I dati sul campo comprendono i dati raccolti dalla raccolta di utenti che visitano le pagine del tuo sito utilizzando il browser Chrome. I dati sul campo sono ciò che popola i rapporti di Google Search Console e Google Page Speed ​​Insights (che si basa sui dati di laboratorio e sul campo per i rapporti sulle pagine).

I dati sul campo possono essere acquisiti utilizzando l'automazione tramite BigQuery. Per i siti o le pagine più recenti che non ricevono molto traffico organico, potresti scoprire che non sono disponibili dati sul campo.

Perché è importante migliorare tutte e tre le metriche di Web Core Vitals?

Tutti e tre i benchmark Core Web Vitals (CWV) segnalano una componente chiave di ciò che serve per fornire una buona esperienza utente. Ognuna delle 3 metriche deve essere soddisfatta per qualificarsi per il relativo aumento del segnale di ranking di Google che verrà lanciato a maggio 2021. Google ci offre 6 modi per misurare questi Core Web Vitals. Come apprendiamo da John Mueller, Senior Webmaster Trends Analyst di Google, tutti i requisiti minimi devono essere soddisfatti per beneficiare di questo aggiornamento dell'algoritmo in arrivo.

“La mia comprensione è che vediamo se è nel verde e poi conta perché va bene o no. Quindi se è in giallo, non sarebbe in verde, ma non so quale sarà l'approccio finale.

Ci sono una serie di fattori che si uniscono e penso che l'idea generale sia se siamo in grado di riconoscere che una pagina soddisfa tutti questi criteri, allora vorremmo usarli in modo appropriato nel ranking di ricerca.

Non so quale sarebbe l'approccio in cui ci sono alcune cose che vanno bene e alcune cose che non sono perfettamente a posto, come il modo in cui ciò si equilibrerebbe". – John Mueller

Ciò rende di grande importanza la percezione di una pagina a caricamento veloce rispetto a un caricamento lento. Soddisfare tutte e tre le metriche è un'opportunità; le piccole imprese possono aumentare di livello la loro SEO e ottenere un vantaggio competitivo per aiutarle a conquistare nuovi affari. L'obiettivo di ogni sito dovrebbe essere quello di migliorare i risultati di ricerca su dispositivi mobili rispetto all'esperienza desktop, poiché ciò è più importante per il maggior numero di utenti che effettuano ricerche.

Come gran parte del marketing di ricerca, un approccio olistico è il migliore. È facile concentrarsi eccessivamente su un'area delle prestazioni del sito per licenziare altre che richiedono attenzione. Un esempio di ciò è l'aggiunta di tutto il markup dello schema a cui puoi pensare quando potrebbe semplicemente aggiungere codice di scarso valore. Leggi la nostra Guida completa al markup dello schema di e-commerce per amplificare al meglio la visibilità dei tuoi prodotti nelle SERP.

Una persona che effettua una ricerca sarà in grado di dire quali siti superano il test Core Web Vitals?

Le persone che desiderano un segnale che i fattori di velocità della pagina, reattività della pagina e stabilità visiva della pagina sono stati presi in considerazione da un'azienda prima di fare clic su una pagina vedranno un badge.

John Mueller ha indicato che Google potrebbe introdurre un badge nei risultati di ricerca per le pagine che superano i Core Web Vitals di Google. Il badge fungerà da una sorta di filtro. Afferma a una persona che utilizza la Ricerca Google che se fa clic su una pagina Web con questo badge CWV, può aspettarsi un'esperienza positiva.

Strumenti di test dei principali vitali Web

Quando si testano i Core Web Vitals, utilizzare una finestra di navigazione in incognito per aggirare i problemi indesiderati.

Ci sono diversi strumenti ora disponibili; preferiamo Faro. Usandone molti puoi avere più di una prospettiva generale. Tuttavia, differiscono considerevolmente nelle loro applicazioni, nei livelli di abilità richiesti per la competenza tecnica e nei rapporti. La Search Console è molto utile per essere la dashboard di Core Web Vitals di ogni sito. Ottenere una vista a volo d'uccello di un intero sito web – secondo Google – è vitale per il successo. L'estensione di Chrome e PageSpeed ​​Insights sono migliori per quelle rapide valutazioni delle pagine. Ne aggiungeremo altri qui nel tempo.

Una volta che questo lavoro sarà a posto, tratteremo di persona i tuoi rapporti sullo stato di avanzamento del marketing di ricerca. Vogliamo che tu capisca e goda dei vantaggi.

Il miglioramento degli aspetti tecnici della SEO ha sempre richiesto il necessario buy-in e le risorse degli sviluppatori per poter essere portato a termine. I marketer della ricerca che lavorano con aziende di tutte le dimensioni hanno lottato per sempre con l'approvazione del budget. Oggi, le prestazioni di ogni sito Web ora hanno un chiaro punteggio di importanza. Se qualcuno non è riuscito a prenderlo sul serio in passato, ora è una cruda realtà. Perché aspettare di essere penalizzato in classifica?

Google ha assistito a queste lotte e ha ascoltato per anni le domande di SEO su come ottenere il buy-in. Il gigante della tecnologia sta evidenziando in modo intelligente l'importanza delle prestazioni rendendole trasparenti nei rapporti di Google Search Console e stabilendole come ulteriore segnale di ranking. La Google Page Experience è meglio descritta come un insieme di fattori che misurano quanto sia soddisfacente per una persona interagire con una pagina web. Concentrati sui tuoi clienti e sui visitatori del tuo sito e su come rendere la loro esperienza sul tuo sito web la migliore possibile per loro.

SOMMARIO

L'ottimizzazione per le metriche delle prestazioni di Core Web Vital, misurate da Google in CRUX, potrebbe essere un grande impulso in futuro. Ma anche prima che questi elementi vitali web diventino un fattore di ranking, avranno un impatto positivo sull'esperienza utente del tuo sito. I consumatori vogliono esperienze più veloci. Il miglioramento dei problemi di velocità di caricamento porta a una frequenza di rimbalzo inferiore, una maggiore durata della sessione della pagina, migliori punteggi di soddisfazione degli utenti, un migliore punteggio di conversione e un aumento del traffico SEO. In definitiva, tutto questo porta ad un aumento delle entrate.

Il bello dell'ottimizzazione delle prestazioni della pagina è che spesso viene raggiunta con miglioramenti del codice relativamente minori.

Hill Web Creations può guidare i tuoi sforzi di ottimizzazione iniziando con un audit SEO tecnico completo .