
Dato che Google darà una spinta al ranking dei siti web veloci, probabilmente vorresti saperne di più sugli approfondimenti di Google PageSpeed?
… E non sono sorpreso perché confonde!
Questo articolo ti aiuterà.
Perché la velocità della pagina del sito web è importante?
Google vuole fornire la migliore esperienza utente possibile agli utenti.
Se il tuo sito web è lento, frustrerà gli utenti e creerà un’esperienza utente negativa. È semplicissimo. Le prestazioni influiscono sull’esperienza.
Google ha recentemente annunciato che i principali parametri vitali web verranno utilizzati come parte del loro algoritmo di ranking nel 2021. Questi elementi vitali web fondamentali sono indicatori della velocità e della velocità con cui le persone possono interagire con la tua pagina.
Fondamentalmente per questa tabella qui sotto non puoi essere ‘rosso’

Che cos’è Google PageSpeed Insights?
È uno strumento gratuito fornito da Google che consente di inserire l’URL di una pagina web ed eseguire rapidamente un test per verificare le varie metriche relative alle prestazioni.
Lo strumento quindi assegna alla tua pagina un punteggio compreso tra 0 e 100 punti. Il punteggio non riguarda la velocità. Puoi migliorare il punteggio se hai utilizzato i consigli tipici di Google sul miglioramento della velocità.
Ti mostra anche i parametri esatti che stanno rallentando la tua pagina e suggerimenti su come migliorarla.
È qui che le cose diventano tecniche ei risultati un po ‘difficili da capire.
Come interpreti i risultati?
La prima cosa che vedi dopo aver eseguito un test è il punteggio delle prestazioni (desktop e mobile) per la pagina analizzata.

Questo sarà un numero compreso tra 0 e 100.
- Da 0 a 49 – Questo è un male, non vuoi che il tuo punteggio sia 49 o inferiore
- Da 50 a 89: va bene, ma c’è spazio per miglioramenti
- Da 90 a 100 – Se sei in questa scala sei nei buoni libri.
Mentre scorri verso il basso vedrai cosa sta causando un punteggio alto o basso:

Nota: vedere gli indicatori di colore prima di ogni sezione:
- Il verde significa veloce
- Arancione significa moderato
- Il rosso significa lento
Questo è il significato di ciascuna di queste sezioni:
First ContentFul Paint
Questo è il tempo necessario dalla navigazione a una pagina dal browser al momento in cui il contenuto inizia a essere visualizzato.
Fondamentalmente, è un indicatore che la pagina sta iniziando a caricarsi.
Ad esempio, potrebbe essere solo un cambio di colore che è il colore di sfondo della pagina, un’immagine visualizzata o una parte di testo.
Questo è importante perché quando un utente vede un’azione è più probabile che attenda fino a quando la pagina non è completamente caricata.
Orientamento:

È tempo di interattivo
Questo parametro mostra la velocità con cui una pagina diventa interattiva.
Ciò significa che la pagina mostra elementi sufficienti sullo schermo in modo che gli utenti possano effettivamente interagire con essa, ad esempio fare clic su un pulsante del menu.
A volte, i siti Web possono concentrarsi sulla visibilità, ovvero visualizzare tutto prima di poter interagire con il contenuto, il che potrebbe essere frustrante per l’utente.
Orientamento:

Tempo di blocco totale
C’è un divario tra il momento in cui il visitatore del tuo sito web vede il contenuto sullo schermo e il tempo in cui può interagire con esso.
Questo è il tempo di blocco totale!
È bene sapere se le persone non possono fare cose come il clic del mouse, i tocchi dello schermo o la pressione delle parole chiave prima che il sito web sia interattivo.
Le attività lunghe sono attività che ti bloccano per più di 50 ms.
Qualsiasi valore superiore a 50 ms è considerato tempo di blocco.
Se non ci sono attività lunghe, vedrai 0 tempo di blocco che è quello che vedi nelle statistiche sopra.
Spostamento cumulativo del layout
Un cambio di layout si verifica quando un elemento visivo viene visualizzato sullo schermo ma poi si sposta.
Quindi, ad esempio, stai leggendo le notizie e c’è un cambiamento di layout, quindi la posizione in cui si trova l’articolo di notizie è cambiata.
Questo è un comportamento inaspettato dal punto di vista di un utente.
Più alto è il punteggio, peggiore è.
Indice di velocità
Questo è difficile da capire ma prezioso.
Quindi immagina 2 siti Web caricati entrambi in 1,5 secondi.

Se esplorassi i 2 siti web mostrati nell’immagine sopra, quale verrebbe caricato più velocemente?
Entrambi sono stati caricati completamente in 1,5 secondi, ma poiché il primo sito ha iniziato a mostrare alcuni elementi in precedenza, è apparso più veloce per l’utente.
Se misuri solo il tempo di caricamento, sono gli stessi.
L’indice di velocità è un punteggio calcolato in base alla velocità di caricamento completo di un sito web.
Una registrazione video del carico viene utilizzata per mostrare visivamente quando vengono caricati i bit.
A vari intervalli la quantità di contenuto visibile sullo schermo (above the fold) viene confrontata con il contenuto visualizzato su un sito Web completamente caricato per calcolare la percentuale di contenuto visualizzato per quel particolare momento.
Questo processo viene ripetuto alcune volte.
Il tempo si basa solo su ciò che l’utente può vedere sullo schermo (il riquadro di visualizzazione). Non importa cosa c’è below the fold.
Quindi … è bene provare con diversi viewport.
Se hai 2 siti web e uno mostra gli elementi visivi prima dell’altro, il punteggio dell’indice di velocità sarà inferiore.
Più basso è, meglio è.
La più grande vernice Contentful
Questo è il tempo necessario per il rendering completo dell’elemento più grande della pagina.
Quando la pagina viene caricata, il primo elemento diventa l’elemento più grande, ma questo viene sostituito man mano che vengono aggiunti elementi più grandi.
L’ultimo elemento di una pagina potrebbe essere l’elemento più grande della pagina (ad esempio un’immagine grande) o potrebbe non esserlo.
Nota: non stiamo parlando di quanto spazio occupa sullo schermo.
Ecco 2 esempi.
Il tempo da quando il sito Web ha iniziato a essere visualizzato fino a quando è stata visualizzata l’ultima immagine sulla pagina sarebbe considerato la più grande immagine di contenuto. Questo perché l’immagine occupa più spazio sulla pagina!

Ma…
Nel caso sotto, l’immagine “Instagram” era l’immagine più grande visualizzata, quindi la pittura più grande e piena di contenuti è quando è stata caricata la penultima schermata.
L’ultima schermata è scontata. Tutto ciò che è stato aggiunto a quella schermata è stato il “pulsante di riproduzione di Google” che era un’immagine più piccola di quella “Instagram”.

Secondo Google, se si desidera fornire una buona esperienza utente, l’LCP dovrebbe avvenire entro 2,5 secondi dall’inizio del caricamento della pagina.
Orientamento:

Opportunità
La sezione Opportunità mostra i suggerimenti che potrebbero aiutare a migliorare il tempo di caricamento della pagina.
Ogni suggerimento mostra anche la riduzione stimata del tempo di caricamento della pagina se hai implementato il consiglio.

Diagnostica
La diagnostica evidenzia le migliori pratiche nello sviluppo web che dovresti considerare di implementare.
Tuttavia, anche se apporti questi miglioramenti, non influiranno direttamente sul punteggio delle prestazioni della tua pagina.

Sommario
Migliorare la velocità del tuo sito web significa offrire ai visitatori un’esperienza migliore. Avere un sito che si carica rapidamente rende più felici sia gli utenti che i motori di ricerca, ma influisce anche sulla tua capacità di convertire i visitatori in clienti.
Uno strumento come Google PageSpeed Insights è incredibilmente utile perché ti mostra da dove iniziare e su quali problemi concentrarti per migliorare le prestazioni del tuo sito web.
Spero che questo articolo ti abbia aiutato a capire come funziona questo strumento e cosa significano effettivamente i risultati del test, in modo che tu possa iniziare a ottimizzare le tue pagine web per creare un’esperienza straordinaria per i tuoi visitatori.