Cum a îmbunătățit Renault ratele de respingere și conversiile prin măsurarea și optimizarea metodei Largest Contentful Paint.

Echipa a analizat datele referitoare la 10 milioane de vizite pe paginile sale de destinație și a descoperit o corelație puternică între conținutul cel mai bine redat și rata de conversie.

Groupe Renault este un producător auto multinațional francez cu o prezență în peste 130 de țări. Pentru un grup auto precum Renault, site-urile web de marcă eficiente, care asigură o mai mare implicare a utilizatorilor și conversii, înseamnă mai multe afaceri. Toate site-urile sale de marcă urmăresc să ofere cea mai bună experiență de utilizare, menținând în același timp flexibilitatea conținutului și a funcțiilor pentru site-urile localizate. În acest context, monitorizarea performanțelor este esențială pentru echipa de conturi, care este responsabilă pentru dezvoltarea și menținerea platformei globale.

Măsurarea impactului Core Web Vitals asupra afacerii

Măsurarea în Google Analytics

În colaborare cu partenerul său global de date fifty-five, Renault a creat o bibliotecă web-vitals care permite ca toți parametrii Web Vitals de la utilizatori reali să fie trimiși la Google Analytics într-un mod care corespunde exact modului în care sunt măsurați de Chrome și introduși în rapoarte. alte instrumente Google.

Următoarea analiză prezintă setul de date colectate cu ajutorul acestor instrumente pe parcursul celor patru luni, din decembrie 2020 până în martie 2021.

Optimizarea LCP se corelează puternic cu implicarea utilizatorilor și cu indicatorii de afaceri.
Echipele au descoperit o corelație deosebit de puternică între Largest Contentful Paint (LCP), ratele de respingere și ratele de conversie, așa cum se arată în graficul de mai jos.

Setul de date cuprinde mai mult de 10 milioane de vizite în 33 de țări pe parcursul a patru luni și arată cum se corelează ratele mai mici ale LCP cu:

• Rate de respingere mai mici
• Rate de conversie mai mari (completarea formularului de lead)

Interesant este faptul că, deoarece site-ul web funcționează ca o aplicație cu o singură pagină (SPA), toate aceste măsuri sunt captate doar pe paginile de destinație. Datele arată că merită să optimizăm un site web până când LCP este sub 1 secundă. Site-urile web ale mărcilor de grup nu pot fi supra-optimizate!

"Acest set de date nu numai că arată o corelație negativă între LCP și indicatorii de business, dar evidențiază și discrepanțele de performanță dintre cele mai performante pagini de destinație. În contextul acestui site web, obținerea unui LCP mai mic de 1 secundă duce la o creștere semnificativă a conversiilor și la scăderea ratei de respingere."

Îmbunătățirea LCP cu 1 secundă poate duce la o scădere de 14 puncte procentuale (ppt) a ratei de respingere și la o creștere de 13% a conversiei.

Cifrele de mai sus sunt derivate din regresii liniare calculate pe un set de date pentru a înțelege relația dintre LCP și alți parametri tehnici și de afaceri. Cifrele care leagă LCP și eșecurile arată că avantajul marginal al ratelor de eșec crește atunci când LCP devine scăzut (sub 1,6 secunde).

Abordarea Renault pentru optimizarea la scară largă a Core Web Vitals
De la începutul anului 2020, numărul de vizitatori cu un LCP rapid (mai puțin de 2,5s) a crescut în medie cu 22pc pentru domeniile Renault (de la 51% la 73%) pe primele cinci piețe europene ale mărcii.

Din punctul de vedere al platformei, performanța a fost o prioritate de mulți ani, iar includerea Core Web Vitals (CWV) ca măsurători cheie a fost un proces ușor. Echipele centrale au instalat o soluție de monitorizare cuprinzătoare (cu Google Lighthouse și Chrome UX Report API) și au stabilit o cultură a performanței în întreaga organizație. Au existat mai multe strategii de optimizare a aplicației lor cu o singură pagină, printre care:

• Redare pe server (SSR) pentru a oferi o primă redare rapidă a conținutului (FCP).
• Divizarea codului pentru a furniza doar fragmentele JS și CSS necesare pentru pagina țintă (pentru a îmbunătăți LCP și FID).
• CDN cu un nivel ridicat de memorare în cache a resurselor (inclusiv Lambda@Edge pentru a sorta și elimina parametrii de cerere inutili). Acest lucru a ajutat la evitarea dezavantajelor SSR (timp TTFB mai lent din cauza calculului de pe server) și la livrarea conținutului mai aproape de utilizatorul final (pentru un TTFB și LCP mai bune).
• Optimizați compresia cu brotli pentru a reduce dimensiunea codului.
• HTTP2 pentru multiplexarea cererilor și răspunsurilor.
• Utilizați imagini adaptive cu suport WebP și atributele srcset și size pentru a oferi utilizatorilor dimensiunea și formatul de imagine cel mai potrivit.
• Încărcarea întârziată a imaginilor, videoclipurilor și cadrelor utilizând IntersectionObserver și FPO (miniaturi mici de 1KB).
• Îndepărtarea scripturilor de blocare și ajustarea transpilării în scopul browserului, pentru a reduce dimensiunea fișierului JS (evitând polyfill-urile inutile).
• Reducerea dimensiunii containerului Google Tag Manager pentru a încărca scripturi de la terți numai atunci când este necesar.
• Reducerea numărului de fonturi personalizate, utilizând formatele woff/woff2 cu unicode-range și font-display:swap pentru a reduce dimensiunea fișierelor de fonturi și pentru a afișa textul cât mai repede posibil, chiar dacă fonturile personalizate nu sunt încă disponibile.
• Preîncărcarea imaginilor de bază, care sunt adesea elemente LCP.
• Echipa lucrează în continuare la îmbunătățiri viitoare, cum ar fi:
• Server Push pentru a îmbunătăți FCP prin livrarea mai rapidă a CSS. (În așteptare din cauza lipsei de suport AWS și a sugestiilor de obsolescență.
• Hidratarea progresivă pentru a îmbunătăți FID.
• Suport pentru modulele ES6 pentru o performanță mai rapidă prin utilizarea de compilări ES6 pentru browsere moderne.

Abordarea SPA poate fi benefică pentru performanță, deoarece nu este necesară o reîncărcare completă a paginii atunci când utilizatorii navighează prin pagini. Cu toate acestea, metodologia actuală a SPA pentru măsurarea CWV poate fi percepută ca un dezavantaj, deoarece nu se măsoară tranzițiile de traseu; prin urmare, nu se ia în considerare încărcarea relativ mai rapidă a paginilor în timpul unei sesiuni datorită memorării în memoria cache a interfeței cu utilizatorul. De asemenea, acest lucru face dificilă compararea performanței CWV cu cea a unui site web concurent care utilizează o aplicație cu mai multe pagini, unde memoria cache caldă reduce performanța pe fiecare pagină pe care utilizatorul o vizualizează în timpul sesiunii.

Acestea sunt limitări cunoscute, care sunt în curs de investigare de către echipele de dezvoltare Chrome. A fost deja lansată o actualizare a metricii CLS pentru a îmbunătăți măsurarea SPA.

Performanța necesită o monitorizare constantă, deoarece poate fi afectată de diverse situații tehnice. În ciuda limitărilor privind modul în care sunt măsurate în SPA, indicatorii CWV ne permit să urmărim impactul acțiunilor întreprinse de echipele noastre.

Reguli locale care promovează optimizarea performanței ca responsabilitate comună
Echipele au elaborat o serie de recomandări pe care proprietarii de conținut local trebuie să le urmeze. Iată câteva exemple de recomandări

• Optimizați containerul local Google Tag Manager pentru a îmbunătăți performanța site-ului. de exemplu, rulați condiționat anumite etichete.
• Limitați dimensiunea conținutului video prin comprimarea acestuia cu ajutorul unor instrumente interne sau prin plasarea pe o platformă externă (de exemplu, YouTube).
• Nu încărcați imagini prin Google Tag Manager.

O înțelegere profundă a performanței noastre digitale este esențială pentru a ne asigura că site-urile mărcilor noastre sunt optimizate în mod continuu. Abordarea echipei noastre de cont este de a oferi o platformă globală care va avea un impact pozitiv asupra rezultatelor de afaceri ale echipelor locale și de a oferi acestor echipe îndrumare și cele mai bune practici pentru a menține această performanță la un nivel ridicat.

În concluzie, performanța site-ului web a fost întotdeauna o prioritate pentru Renault, iar platforma site-ului web este în mod constant optimizată. Măsurarea indicatorilor web cheie alături de indicatorii de afaceri le-a permis să promoveze această temă ca o responsabilitate comună la nivel global, iar recomandările locale oferă echipelor posibilitatea de a participa la acest efort valoros.