Il team ha analizzato i dati di 10 milioni di visite sulle sue pagine di destinazione e ha trovato una forte correlazione tra Largest Contentful Paint e il tasso di conversione.
Il Groupe Renault è una casa automobilistica multinazionale francese presente in oltre 130 paesi. Per un gruppo automobilistico come Renault, i siti di brand ad alte prestazioni che generano un maggior coinvolgimento degli utenti e le conversioni significano più business. Tutti i siti dei suoi brand mirano a offrire la migliore esperienza utente su larga scala mantenendo la flessibilità di contenuti e funzionalità per i siti localizzati. In questo contesto, il monitoraggio delle prestazioni è un ruolo fondamentale per il team di customer experience, incaricato di sviluppare e mantenere la piattaforma globale.
Misurazione dell'impatto dei Segnali web essenziali sull'attività
Misurazione in Google Analytics
Collaborando con cinquantacinque, il suo partner di dati globale, Renault ha configurato la libreria degli elementi vitali web, che consente di inviare a Google Analytics tutte le metriche di Web Vitals di utenti reali in modo che corrispondano con precisione al modo in cui vengono misurate da Chrome e segnalate ad altri strumenti Google.
La seguente analisi mostra un set di dati acquisito utilizzando questi strumenti nell'arco di quattro mesi tra dicembre 2020 e marzo 2021.
LCP ottimizzato è strettamente correlato al coinvolgimento degli utenti e alle metriche aziendali
I team hanno identificato una correlazione particolarmente forte tra una percentuale bassa di Largest Contentful Paint (LCP) e frequenze di rimbalzo e tassi di conversione favorevoli, come mostrato nella visualizzazione di seguito.
Il set di dati registra oltre 10 milioni di visite in 33 paesi in quattro mesi e mostra la correlazione tra le misure di LCP più basse e:
- Frequenze di rimbalzo ridotte
- Più conversioni (moduli per i lead completati)
È interessante notare che poiché il sito web viene eseguito come un'applicazione a pagina singola (APS), tutte queste misure vengono acquisite solo sulle pagine di destinazione. I dati mostrano che vale la pena ottimizzare il sito web finché il valore LCP non scende al di sotto di 1 secondo. I siti dei brand del gruppo non possono mai essere troppo ottimizzati.
Questo set di dati non solo mostra la correlazione negativa tra LCP e le metriche aziendali, ma evidenzia anche le discrepanze in termini di rendimento tra le pagine di destinazione con il rendimento migliore. Nel contesto di questo sito web, una percentuale di LCP inferiore a 1 secondo porta a grandi incrementi delle conversioni e riduzione del rimbalzo.
Eja Rakotoarimanana, Consulente, cinquantacinque
Un miglioramento dell'LCP di 1 secondo può portare a una diminuzione di 14 punti percentuali (ppt) della frequenza di rimbalzo e a un aumento del 13% delle conversioni.
Miglioramento dell'LCP di 1 secondo | Il risultato |
---|---|
LCP: circa 1 s | +13% del CVR |
LCP inferiore a 1,6 s | Frequenza di rimbalzo -14 ppt |
LCP superiore a 1,6 s | Frequenza di rimbalzo -5 ppt |
L'approccio di Renault all'ottimizzazione dei Segnali web essenziali su larga scala
Dall'inizio del 2020, nei cinque principali mercati europei del brand, il numero di visitatori che riscontrano un LCP veloce (inferiore a 2,5 secondi) è migliorato in media di 22 punti percentuali per i domini Renault (dal 51% al 73%).
Ecco come lo hanno affrontato.
Un'ottimizzazione centrale dell'SPA
Dal punto di vista della piattaforma, le prestazioni sono state una priorità per anni e includere i Segnali web essenziali come metriche chiave è stato un processo semplice. I team centrali hanno configurato una soluzione di monitoraggio completa (con Google Lighthouse e API Chrome UX Report) e stabilito una cultura del rendimento in tutta l'organizzazione. Erano presenti diverse strategie per ottimizzare l'applicazione a pagina singola, tra cui:
- Rendering lato server (SSR) per garantire la velocità di First Contentful Paint (FCP).
- Suddivisione del codice in modo da pubblicare solo i blocchi JS e CSS necessari per la pagina di destinazione (per valori LCP e FID migliori).
- CDN con un livello elevato di memorizzazione nella cache delle risorse (incluso Lambda@Edge per ordinare e rimuovere i parametri di query non necessari). Ciò ha consentito di evitare gli svantaggi di SSR (TTFB più lento dovuto al calcolo del server) e di fornire contenuti più vicini all'utente finale (per migliorare TTFB e LCP).
- Ottimizzazione della compressione con brotli per ridurre le dimensioni del codice.
- HTTP2 per attivare il multiplexing di richieste e risposte.
- Utilizzare immagini adattabili con supporto WebP e attributi
srcset
esizes
per mostrare agli utenti le dimensioni e il formato più appropriati delle immagini. - Caricamento lento di immagini, video e iframe utilizzando
IntersectionObserver
e FPO (piccole miniature da 1 kB). - Rimuovi gli script di blocco e modifica la traspilazione in base ai target del browser per ridurre le dimensioni dei file JS (evitando polyfill non necessari).
- Ridurre le dimensioni del contenitore di Google Tag Manager in modo da caricare gli script di terze parti solo dove e quando necessario.
- Ridurre il numero di caratteri personalizzati, usando i formati woff/woff2 con intervallo Unicode e
font-display:swap
per ridurre le dimensioni dei file dei caratteri e mostrare il testo il prima possibile anche se non sono ancora disponibili caratteri personalizzati. - Precaricamento di immagini hero, che spesso sono elementi LCP.
Il team sta ancora lavorando a miglioramenti futuri come:
- Push del server per migliorare FCP pubblicando più rapidamente il codice CSS. In standby per mancanza dell'assistenza AWS e della proposta di ritiro.
- Idratazione progressiva per migliorare il FID.
- Supporto dei moduli ES6 per offrire un'esperienza più rapida utilizzando build ES6 per i browser moderni.
L'approccio SPA può essere vantaggioso per le prestazioni poiché non è necessario ricaricare completamente la pagina quando gli utenti passano da una pagina all'altra. Detto questo, le attuali metodologie di misurazione di Core Web Vitals su SPA possono essere percepite come uno svantaggio, poiché le transizioni di percorso non vengono misurate. Di conseguenza, i caricamenti di pagine all'interno di una sessione sono relativamente più rapidi, a causa della memorizzazione nella cache dell'interfaccia utente. Inoltre, rende difficile confrontare Core Web Vitals con un sito web concorrente di un'applicazione multipagina, in cui una cache persistente ridurrebbe le misure di ogni pagina visitata da un utente durante una sessione. Per ulteriori dettagli, leggi le Domande frequenti su Web Vitals SPA.
Si tratta di limitazioni note che i team di prodotto di Chrome stanno esaminando. È già stato inviato un aggiornamento alla metrica CLS per migliorare la misurazione nelle APS.
Il rendimento richiede un monitoraggio costante poiché vari team tecnici possono intervenire. Nonostante le limitazioni nelle modalità di misurazione delle APS, i Segnali web essenziali ci consentono di monitorare l'impatto delle azioni intraprese dai nostri team. Ci auguriamo che le transizioni di percorso verranno prese in considerazione a breve.
Cedric Bazureau, Tech Lead, Renault
Linee guida locali che promuovono l'ottimizzazione del rendimento come responsabilità condivisa
Il rendimento viene comunicato come responsabilità sia globale (centrale) sia locale. I team hanno messo a punto una serie di best practice che i proprietari di contenuti locali sono tenuti a seguire. Ecco alcuni esempi tratti da queste linee guida:
- Ottimizza il contenitore locale di Google Tag Manager per migliorare le prestazioni del sito, ad esempio per attivare determinati tag in modo condizionale.
- Limita le dimensioni dei contenuti video comprimendoli con strumenti interni o ospitandoli su una piattaforma esterna (come YouTube).
- Evita di caricare immagini tramite Google Tag Manager.
Una profonda comprensione del nostro rendimento digitale è fondamentale per garantire una continua ottimizzazione dei siti dei nostri brand. L'approccio del nostro team dedicato alla customer experience consiste nel fornire una piattaforma globale che abbia un impatto positivo sui risultati aziendali dei team locali, fornendo loro al contempo linee guida e best practice per mantenere queste prestazioni ad alto livello.
Alexandre Perruche, Responsabile prestazioni, Renault
Per concludere, le prestazioni del sito web sono da sempre una priorità per Renault, e la piattaforma del sito web di Renault è continuamente ottimizzata. La valutazione dei Segnali web essenziali insieme alle metriche aziendali ha permesso di promuovere questo argomento come una responsabilità condivisa a livello globale e le linee guida locali offrono ai team la possibilità di partecipare a questo impegno vantaggioso.