Che cos'è LCP? Spiegazione del Largest Contenful Paint
Abbiamo affrontato i tre Segnali Web essenziali nel nostro precedente articolo sull'ottimizzazione per l'aggiornamento Core Web Vitals di Google. Tuttavia, non possiamo parlare di Core Web Vitals senza approfondire un fattore chiave: LCP, noto anche come Largest Contentful Paint.
In questa guida, vedremo cos'è LCP, perché è importante, i suoi vantaggi e quali miglioramenti puoi apportare per ottimizzare il tuo sito web.
- Che cos'è LCP e perché è importante?
- Definizione di LCP buono o scadente
- Quali sono le cause di un LCP scadente?
- Come risolvere un LCP scadente
- Alla scoperta del tuo LCP
- Cosa può fare Semrush per aiutarti?
Che cos'è LCP e perché è importante?
LCP è l'abbreviazione di Largest Contentful Paint. LCP è una misura della velocità della pagina; ti dice quanto tempo impiega il contenuto principale di una pagina web a caricarsi (in pratica quando la pagina diventa leggibile per l'utente).
LCP è parte integrante dell'esperienza dell'utente. Agli utenti non piace rimanere in attesa e attendere il caricamento di un sito quando altrove potrebbero ottenere immediatamente un'esperienza migliore.
Se il tuo LCP è scarso, potresti riscontrare una frequenza di rimbalzo più elevata e le tue classifiche complessive potrebbero subire un duro colpo. Un cattivo LCP può anche portare a un tasso di conversione inferiore — pessimo per le aziende in erba.
Grazie all'aggiornamento Core Web Vitals di Google, LCP è diventato un fattore davvero significativo per il tuo posizionamento nelle SERP. Per continuare a classificarti in modo organico e mantenere quei visitatori sul tuo sito, è molto importante che il tuo valore di LCP sia buono.
LCP si applica solo al contenuto principale above the fold. Ciò include immagini, video o blocchi di testo che vengono visualizzati senza che l'utente debba scorrere verso il basso per trovarli. Tienilo a mente quando annoti eventuali aree problematiche.
Definizione di LCP buono o scadente
Secondo le linee guida di Google, il contenuto principale della tua pagina dovrebbe essere caricato entro i primi 2,5 secondi dalla visita di un utente per avere un buon LCP. Il seguente grafico lo mostra in modo più dettagliato:
Se i tuoi utenti devono attendere cinque secondi o più per il caricamento del contenuto principale (ad esempio, se il tuo LCP è scarso e necessita di miglioramenti), è molto probabile che queste persone rinuncino a vedere i tuoi contenuti e guardino altrove.
Le linee guida di Google specificano inoltre che il tuo LCP deve essere classificato come "buono" almeno il 75% delle volte. Se riesci a gestirlo, le tue prestazioni saliranno alle stelle.
Daremo un'occhiata al tuo LCP specifico tra un momento. Per ora, concentriamoci sulle cause generali di un LCP scadente e su come affrontarle.
Quali sono le cause di un LCP scadente?
L'elenco di ciò che potrebbe causare un LCP scarso è tecnicamente infinito.
Potrebbe essere qualsiasi cosa che occupi molto spazio: lettori multimediali integrati che possono rallentare una pagina, diapositive di immagini non ottimizzate, pulsanti dei social media o persino widget come il login, un modulo di iscrizione alla newsletter e altro ancora.
Ma andiamo un po' più nello specifico.
Come mostra il grafico qui sopra, i fattori che causano uno scarso LCP spesso appartengono a quattro gruppi principali:
1. Tempo di risposta del server lento
Avere un tempo di risposta del server lento ha un impatto negativo su tutte le metriche della velocità di caricamento ed è, quindi, una causa definitiva di un LCP scadente.
Tempi lenti di risposta del server sono spesso il risultato di problemi con la tua infrastruttura di back-end, query di database non ottimizzate o risposte API che richiedono molto tempo per essere risolte, il tutto nel background del tuo sito.
Il primo passo per migliorare questo valore è assicurarti di ospitare il tuo sito web su un buon server.
2. JavaScript e CSS che bloccano il rendering
Sebbene personalizzare il tuo sito web sia un ottimo modo per farlo risaltare, l'aggiunta di JavaScript e CSS per abbellire il tema del sito e il suo contenuto, purtroppo, ne influenzerà anche il tempo di caricamento.
A volte è meglio attenersi a un design meno "pesante" e ridurre il numero di plug-in sul sito, in particolare above the fold, per il bene del tuo LCP.
3. Rendering lato cliente
Il rendering lato client (ovvero il rendering di pagine Web direttamente nel browser con JavaScript) è un metodo di sviluppo Web piuttosto popolare.
Tuttavia, implica molti avanti e indietro per il browser per raccogliere e caricare il JavaScript prima di visualizzare il contenuto principale e altro, con conseguente attesa dell'utente.
Se ti affidi al rendering lato client, dovrai tenerlo in considerazioni quando lavori sul tuo LCP.
4. Tempo di caricamento delle risorse lento
Grandi risorse o contenuti di grande impatto visivo su una pagina richiedono molto tempo per essere caricati: è un dato di fatto.
Se hai molte immagini, GIF e caselle di testo di alta qualità non ottimizzate above the fold, il tuo LCP ne risentirà.
Continua a leggere per saperne di più sull'ottimizzazione di questi elementi per migliorare il tuo LCP.
Come risolvere un LCP scadente
Ci sono cose che si possono correggere in caso di LCP scadente, alcune delle quali sono più facili di altre. Ti guideremo attraverso alcune di quelle più semplici.
1. Ottimizza il tuo CSS
I file CSS sono risorse che bloccano il rendering. Le risorse devono essere caricate ed elaborate prima che il server possa visualizzare l'intera pagina.
Tuttavia, puoi ottimizzare i file CSS rimuovendo manualmente il codice inutilizzato, riducendo al minimo i file CSS in uso o ottimizzando le immagini di sfondo CSS con le query multimediali.
Sembra complicato, ma ci sono un sacco di risorse e tutorial sulle metriche di velocità incentrate sull'utente che possono aiutarti!
2. Ottimizza le tue immagini
Ci sono alcuni passaggi che puoi eseguire quando ottimizzi le tue immagini. I principali sono i seguenti:
- Comprimi le tue immagini
- Converti le tue immagini in formati più efficienti
- Usa i video al posto delle GIF (richiedono meno tempo per caricarsi)
- Assicurati che le tue immagini siano delle dimensioni corrette
E vale sempre la pena pensare: ho davvero bisogno di questa immagine? Aggiunge qualcosa alla mia pagina? Se la risposta è no, potrebbe essere meglio sbarazzarsene.
3. Ottimizza i tuoi WebFont
I font spesso si trovano in file di grandi dimensioni. Di conseguenza, il contenuto del testo in un font non comune non verrà visualizzato su una pagina fino al caricamento del file del carattere.
Gli utenti impiegheranno più tempo per visualizzare le informazioni essenziali su una pagina web! Questo non va bene.
Per evitare ciò, ti consigliamo di ottimizzare i tuoi WebFont. Riducendo le dimensioni del WebFont, utilizzando un font-display o aggiornando lo stile della pagina per utilizzare il carattere personalizzato, il caricamento della pagina dovrebbe essere più rapido.
4. Ottimizza il tuo JavaScript
Scrivi il tuo JavaScript, ottieni tutte le informazioni di cui hai bisogno e sei a posto, giusto?
Non proprio. Se il tuo JavaScript è fermo da un po', potrebbe valere la pena controllarlo perché potrebbe costarti la velocità di caricamento della pagina.
Alcune cose che puoi fare per ottimizzare il tuo JavaScript (data la più recente metrica LCP) includono:
- rimuovere il codice inutilizzato
- controllare che il tuo codice sia aggiornato e compatibile con i browser moderni
- installare JavaScript moderno e ridurre i payload con la suddivisione del codice
Alla scoperta del tuo LCP
Quindi, come fai a scoprire qual è il tuo LCP?
Un buon punto di partenza per controllare le tue prestazioni LCP è utilizzare gli strumenti forniti da Google: Google Search Console, Google Page Insights e Lighthouse.
Troverai una scheda per i Segnali Web essenziali nella barra di navigazione a sinistra nella Google Search Console. Entrando in questa scheda ti verrà mostrata una panoramica dei tuoi URL. Da lì, è abbastanza facile vedere dove potrebbero essere eventuali problemi e anche quali modifiche potresti apportare per risolverli.
Se non hai una Search Console impostata per il tuo sito, non preoccuparti. Puoi anche accedere a queste informazioni tramite gli strumenti Lighthouse e PageSpeed Insights. Se non conosci PageSpeed Insights, puoi trovare una spiegazione completa sull'utilizzo di questo strumento di Google sul nostro blog.
Ecco la panoramica di Page Insights per il sito desktop di Amazon. Ci mostra tutti i Segnali Web essenziali a colpo d'occhio:
Come puoi vedere, il Largest Contentful Paint va abbastanza bene, ma c'è sempre spazio per miglioramenti. Vai alla sezione Opportunità, esplora tutti i consigli e cogli tutte le possibilità per ottenere classifiche ancora migliori.
È una buona idea elaborare questi consigli in tempo per superare l'aggiornamento Core Web Vitals di Google. Controlla frequentemente il tuo sito per assicurare il miglioramento costante del tuo LCP e di altre metriche del sito e della situazione SEO generale.
Cosa può fare Semrush per aiutarti?
Quindi, hai controllato il tuo LCP e hai identificato alcuni problemi. Ora devi lavorare per risolverli e poi ripetere l'intero processo tra una settimana o due.
La costante manutenzione della tua SEO per mantenere aggiornato l'LCP del tuo sito Web può stancarti rapidamente. La buona notizia è che sappiamo esattamente come rendere più efficiente questo processo: usando lo strumento Site Audit.
Testa la velocità del tuo sito web con lo strumento e genera un elenco di tutti i possibili miglioramenti e problemi, proprio come PageSpeed Insights ma molto meglio. Site Audit cercherà anche errori tecnici SEO e te li mostrerà in grafici e tabelle di facile lettura, con le spiegazioni di tutti i problemi e le correzioni.
Lo strumento può aiutarti a colmare le lacune per i Core Web Vitals, valutando il tuo URL e analizzandone il contenuto, e tenendoti costantemente aggiornato sulle prestazioni del tuo LCP.
Una volta impostato l'audit del tuo sito, tutto ciò che devi fare è cliccare su "Visualizza dettagli" in "Segnali web essenziali":
Troverai i risultati del tuo LCP nel grafico a sinistra:
Ora sai come mantenere aggiornate le tue prestazioni LCP e dove andare per individuare i punti di miglioramento. Se segui con regolarità le raccomandazione di Site Audit, il tuo LCP e i Core Web Vitals miglioreranno rapidamente.
Monitora il tuo LCP nel tempo attraverso i dati che ti fornisce lo strumento e noterai presto dei miglioramenti per i tuoi ranking.
Ti senti ancora un po' insicuro? Per ulteriori informazioni su come usare Site Audit per migliorare la velocità della pagina in generale, consulta il nostro post sul blog: Misurare i Core Web Vitals con Site Audit di Semrush.