Pubblicato il - Aggiornato il
Come usare Google PageSpeed Insights, il tool per monitorare la velocità del sito web
Parlare del PageSpeed Insights di Google vuol dire mettere in evidenza uno dei tool per misurare la velocità del sito più famosi e utilizzati. Perché restituisce con precisione i risultati necessari per migliorare le pagine web in termini di upload. E sai bene quanto sia importante per la SEO e l’UX.
Ma non solo, qui trovi consigli e punti da ottimizzare. Inoltre PSI raccoglie il giudizio di Google, giudice incontrastato quando si parla di performance e velocità dei siti web. Sarà questo il punto di forza?
No, come sempre dobbiamo mettere in evidenza un aspetto: noi non miglioriamo le prestazioni delle pagine web per far felice Google ma per rispettare il desiderio dei nostri utenti. Mountain View è solo il tramite, il mezzo che scegliamo per migliorare il risultato grazie al Pagespeed Insights. Ma come si usa?
Indice dei contenuti
Cos’è il Pagespeed Insights di Google
Si tratta di un tool gratuito che permette a SEO expert e webmaster di scoprire la velocità delle pagine web. PageSpeed Insights, soprattutto dopo gli aggiornamenti del novembre 2021, è diventato una fonte unica per verificare le prestazioni di un sito web grazie ai dati registrati sul campo e in laboratorio.
I risultati – unendo le informazioni UX di Chrome (CrUX) e del tool di diagnostica Lighthouse – si dividono per mobile e desktop. E su una scala da 0 a 100. Cosa significa tutto questo?
- Il primo range, in rosso, indica prestazioni scadenti.
- Il secondo, in arancione, segnala che ci sono ancora alcuni problemi.
- Il terzo, in verde, è sinonimo di un ottimo risultato.
Da qui si giunge alla classica generalizzazione per chi si cerca sempre di ottenere 100 su Pagespeed Insights di Google. Ed è veramente importante? No, meglio concentrarsi su altri punti più interessanti.
Come funziona questo strumento
Il funzionamento di questo tool per ottenere dati sulla velocità delle singole pagine web è semplice. Basta andare sul sito web ufficiale pagespeed.web.dev e inserire nel campo l’URL che ti interessa.
Premi invio e inizia a registrare i risultati. Il primo approccio a questa utility è abbastanza intuitivo perché i risultati del test si dividono in sezioni specifiche. Si inizia con la registrazione dei dati reali.
Questo è un aspetto decisivo di Pagespeed. Gli aggiornamenti della piattaforma hanno diviso con precisione i dati raccolti sul campo da quelli ottenuti in laboratorio. Quest’ultima sezione è passata in secondo piano per lasciare il campo a ciò che viene registrato dagli utenti durante la navigazione.
I dati presi in esame sono quelli che riguardano i segnali web essenziali, i web vitals. Questi valori sono dati reali presi attraverso la navigazione degli utenti grazie a Chrome User Experience Report negli ultimi 28 giorni e si applicano all’intero dominio, ma anche alla singola pagina grazie allo switch.
Subito dopo si approfondiscono le metriche più importanti per continuare, poi, con alcune delle sezioni interessanti. Vale a dire quelle delle opportunità e della diagnostica, dove puoi trovare diversi consigli per migliorare immagini, CSS, codice e cache.
Dati sul campo di Pagespeed Insight
La grande realtà che può fare la differenza con questo tool: nel momento in cui analizzi una pagina puoi contare sui dati del Chrome User Experience Report (CrUX). Vale a dire il rapporto sull’esperienza utente di Chrome che suggerisce le metriche relative a come l’utente su Chrome naviga sul sito web.
Come leggere la classifica? Il Pagespeed Insight mostra i dati sul campo (chiamati Real User Monitoring o semplicemente RUM), quando disponibili, raccogliendo in forma anonima le prestazioni degli utenti nella realtà. E li raggruppa in 3 insiemi di esperienze di navigazione: veloci, moderate o lente.
- Largest Contentful Paint (LCP).
- First Contentful Paint (FCP).
- First Input Delay (FID).
- Cumulative Layout Shift (CLS).
In pratica, nella sezione dei dati sul campo puoi registrare il comportamento dei Core Web Vitals su un sito e sulla singola pagina web. Con un semplice comando puoi passare dai dati mobile a quelli desktop e decidere se ampliare o meno la visualizzazione dei dettagli relativi alle performance.
I numeri approfondiscono in che proporzione le pagine rispondono a buoni risultati o hanno dei problemi. Per chiudere questa sezione abbiamo un box che ci suggerisce il periodo in cui sono stati collezionati i dati, la durata delle visite, i dispositivi utilizzati dagli utenti, le connessioni e le versioni di Chrome.
Dati laboratorio di Pagespeed Insight
Pagespeed utilizza una serie di elementi per effettuare un check e determinare le performance della pagina. In particolar modo, oltre ai dati sul campo, utilizza anche i numeri ottenuti in laboratorio. Numeri che vengono accompagnati, a differenza di quelli registrati sul campo, dagli screenshot delle pagine che simulano l’evoluzione del caricamento.
Quali sono le voci prese in esame in questa sezione del tool Pagespeed Insight? Sono metriche necessarie per determinare la velocità di caricamento della pagina. Ma anche la stabilità, i tempi di reazione e l’user experience. Ma cosa significano le varie voci? A cosa si riferiscono esattamente?
First Contentful Paint
Il tempo che il browser investe per mostrare i primi contenuti della pagina. Questa metrica chiave indica quanti secondi deve attendere l’utente prima di vedere un’immagine o una stringa di testo.
First Meaningful Paint
La visualizzazione dei primi contenuti utili a chi naviga. Non valuta solo la presenza fisica, l’apparizione di testo o visual: questo passaggio riguarda la presenza del contenuto principale visibile.
Speed Indeex
Elemento direttamente collegato alla prima e alla seconda metrica. Questa misura definisce l’indice di velocità con il quale si caricano e si mostrano alle persone che visitano la pagina web.
Time to Interactive
Il tempo che bisogna aspettare per interagire definitivamente con la pagina. Un parametro che prende in esame la risorsa in questione e non si limita a registrare semplici apparizioni di testo e immagini.
First CPU Idle
La prima inattività della CPU indica il momento in cui le persone possono interagire e interrogare gli elementi della pagina web. La quale può gestire l’input di chi si trova dall’altra parte dell’interfaccia.
Estimated Input Latency
La latenza stimata dell’input (o ritardo prima interazione potenziale). A cosa serve? Definisce con esattezza la velocità con la quale una pagina risponde allo stimolo esterno eseguito da un utente.
Come leggere i dati del Pagespeed Insight
Questi valori devono essere interpretati in modo differente. LCP, TBT e CLS hanno un peso superiore mentre le altre metriche sono meno rilevanti. Ecco il punteggio ufficiale, preso dal sito internet Github.
Metrica | v6 | v8 | Δ |
---|---|---|---|
First Contentful Paint (FCP) | 15 | 10 | -5 |
Speed Index (SI) | 15 | 10 | -5 |
Largest Contentful Paint (LCP) | 25 | 25 | 0 |
Time To Interactive (TTI) | 15 | 10 | -5 |
Total Blocking Time (TBT) | 25 | 30 | 5 |
Cumulative Layout Shift (CLS) | 5 | 15 | 10 |
Cosa sapere in più su questi numeri? Il Total Blocking Time (TBT) da Lighthouse v8 indica il tempo tra First Contentful Paint e Time to Interactive (TTI) durante il quale c’è stato un blocco del thread principale abbastanza ampio da impedire la risposta.
Ricorda che nell’analisi dei dati di laboratorio puoi filtrare i risultati cliccando sulle voci che mostrano controlli relativi a FCP, TBT, LCP e CLS. Inoltre puoi analizzare in profondità tutto ciò che puoi fare per ottenere dei risultati interessanti in termini di performance. Un esempio concreto?
Elimina le risorse di blocco della visualizzazione
Il concetto è semplice: il browser deve caricare la pagina web ma Javascript e CSS possono impedire questo lavoro perché pretendono di caricarsi prima di far vedere il resto della risorsa.
Questo anche quando sono inutili. Ecco perché è importante definire ogni passaggio. Per una prima ottimizzazione puoi usare diversi plugin WordPress che servono proprio a questo. Ne segnalo due:
Un altro suggerimento di Google: assicurati che il testo rimanga visibile durante il caricamento dei caratteri web. Per questo puoi approfondire le strategie di Font Load che ho approfondito in questo articolo.
Come seguire i dati su WordPress?
Non vuoi analizzare ogni singola pagina, mi sembra chiaro. Per questo esistono alcune soluzioni per aggregare i dati. Ad esempio Google Analytics suggerisce un report delle pagine più lente e lo stesso fa la Search Console. Ma una delle soluzioni più interessanti è il plugin Site Kit per WordPress.
Questo strumento unisce i parametri dei tool per monitorare la salute del sito web. E tra i diversi tool hai Pagespeed Insights di Google. Vuoi dare uno sguardo? Ecco la pagina: sitekit.withgoogle.com. Scarica e installa il plugin, fai il login con i servizi e goditi i dati nella dashboard di WordPress.
I dati di Pagespeed sono veritieri?
I controlli del Pagespeed di Google vengono effettuati attraverso lo strumento di diagnostica Lighthouse, una suite sempre di Mountain View che analizza accessibilità, elementi SEO e UX. Ed è lo stesso Google a specificare le possibilità di questa suite. Anche i suoi tool hanno dei limiti concreti:
PSI provides both lab and field data about a page. Lab data is useful for debugging performance issues, as it is collected in a controlled environment. However, it may not capture real-world bottlenecks. Field data is useful for capturing true, real-world user experience – but has a more limited set of metrics.
Google.com
Come già indicato, Pagespeed suggerisce dati di laboratorio e registrati sul campo. I primi sono utili per risolvere problemi relativi alle prestazioni ma potrebbero ignorare i colli di bottiglia che frenano il caricamento di una risorsa. Al tempo stesso i dati registrati sul campo hanno un set di metriche limitato.
Per questo, come avviene soprattutto dalla versione rilasciata il 15 novembre 2021, si pone importanza sulla sinergia tra i dati sul campo che mantengono il polso della situazione e quelli di laboratorio.
Senza dimenticare la possibilità di ottenere risultati diversi. John Mueller suggerisce che l’output può cambiare senza aver effettuato modifiche. Per questo è utile confrontare i dati di Pagespeed Insights di Google con altri tool (tipo Gtmetrix, Pingdom o Speed) per avere più informazioni.
Vuoi raggiungere 100/100 su PSI?
Questo è uno dei punti di massima ambizione: toccare il 100/100 su Google Page Speed Insights. Quindi ottimizzando i consigli suggeriti da Mountain View attraverso questo tool. Ma è possibile? Ed è utile?
Riprendo John Mueller: usiamo questo strumento non per toccare il 100 su 100 ma per migliorare l’esperienza degli utenti. Spesso si lavora solo per soddisfare la metrica ignorando ciò che si offre.
Questo punteggio spesso si ottiene su pagine semivuote: se è questo il tuo obiettivo va bene, ma puoi togliere ciò che ti caratterizza per toccare questo punto? Mai ragionare solo in termini di metriche.
Da leggere: come e quando fare restyling del sito
A cosa serve veramente Pagespeed
Possiamo forse dire che i dati di PSI sono errati o superflui? No, bisogna leggere i dati per quello che sono: indicazioni utili nelle mani di un esperto che ha il compito di leggere e interpretare. Per poi svolgere le attività necessarie per ottenere il miglior risultato possibile per l’utente (e non per accontentare Google).
Vuoi migliorare il rendimento web del tuo sito?
Tag: Strumenti per il web
Mirko Ciesco
Web Performer
Raccolgo dati dai siti per portarli ad un livello superiore! 🚀
Sono esperto in web performance, ottimizzo la SEO tecnica e miglioro l’usabilità dei siti internet attraverso la web analytics. Creo strategie vincenti partendo dai problemi delle Startup e delle aziende. Infine tengo corsi personalizzati online e in tutta Italia con la mission di rendere il web un posto migliore.