Impact commercial des Signaux Web essentiels

Cet article vous aidera à comprendre comment les Core Web Vitals sont corrélés aux métriques commerciales clés en vous présentant des exemples d'entreprises qui ont déjà constaté un impact positif sur leurs utilisateurs et leur activité.

Saurabh Rajpal
Saurabh Rajpal
Swetha Gopalakrishnan
Swetha Gopalakrishnan

LCP, FID, CLS

Vous avez du mal à convaincre vos partenaires d'adopter les Core Web Vitals ? Ou vous vous demandez si cela aide réellement votre entreprise ? Cet article vous aidera à comprendre comment les métriques Core Web Vitals sont corrélées aux métriques commerciales clés en examinant des exemples d'entreprises qui ont déjà constaté un impact positif sur leurs utilisateurs et leur activité.

Si vous préférez le format vidéo, regardez cette présentation de la conférence Google I/O:

Pourquoi les Core Web Vitals sont-ils importants pour vos utilisateurs et votre entreprise ?

Les priorités des différents acteurs d'une organisation peuvent être différentes. Les Core Web Vitals peuvent les amener à se mettre d'accord en se concentrant sur l'optimisation des métriques centrées sur l'utilisateur et la croissance commerciale qui en résulte.

Penser aux Core Web Vitals

Le chemin vers de bonnes métriques Core Web Vitals peut varier d'un site à l'autre, en fonction de l'avancement du parcours de performances et de la complexité de la conception du site. Il peut s'agir de saisir les opportunités à portée de main et d'obtenir des résultats significatifs, ou d'implémenter des solutions complexes qui résolvent des problèmes difficiles. Quel que soit le temps passé, les décideurs doivent considérer cela comme un investissement à long terme pour la croissance de leur entreprise. Offrir une expérience de navigation rapide et fluide ravit les utilisateurs et les aide à devenir des clients fidèles et réguliers. Pour les responsables produit, les performances doivent être un critère important qui définit la qualité et le succès des nouvelles fonctionnalités de produit. L'excellence des produits et le travail sur des défis intéressants contribuent également à la satisfaction des développeurs.

Bien que les Core Web Vitals soient un signal de classement, ils constituent une motivation supplémentaire pour investir du temps dans les performances. En outre, leur adoption présente de nombreux autres avantages à court et long terme, au-delà du classement. Examinons plusieurs études de cas de marques internationales et locales qui ont adopté les Core Web Vitals (avant qu'elles n'aient un impact sur le classement) en raison de leur focus sur l'expérience utilisateur.

Études de cas

Vodafone

Vodafone (Italie) a amélioré son LCP de 31% pour enregistrer une hausse de 8% de ses ventes.

8% de ventes supplémentaires

Techniques

  • Affichage côté serveur du code HTML essentiel.
  • Réduisez le code JavaScript bloquant le rendu.
  • Techniques d'optimisation des images
  • Redimensionnez l'image du héros et différez les ressources non critiques.

principaux enseignements

  • Les tests A/B sont le meilleur moyen de mesurer l'impact significatif.
  • Le test A/B doit être côté serveur.

iCook

iCook a amélioré son CLS de 15% pour augmenter ses revenus publicitaires de 10 %.

Graphique montrant une augmentation des revenus publicitaires

Techniques

  • Moins de variabilité dans la taille des blocs d'annonces et des espaces publicitaires de taille fixe préalloués dans l'interface utilisateur.
  • Optimisation de la logique de chargement du script publicitaire pour prioriser les enchères d'en-tête et différer le code JavaScript non essentiel.

principaux enseignements

Le taux de remplissage peut être affecté, mais les revenus augmenteront à terme avec l'amélioration de la visibilité des annonces.

Tokopedia

Tokopedia a amélioré son LCP de 55% et a vu la durée moyenne de session augmenter de 23 %.

Avant : 3,78 s, après : 1,72 s.

Techniques

  • Élément LCP du rendu côté serveur (SSR).
  • Préchargez l'élément LCP.
  • Optimisation des images (compression, WebP, chargement différé des images non critiques)

principaux enseignements

  • Il a créé un tableau de bord de surveillance des performances pour suivre l'avancement et l'impact sur les différentes équipes.
  • Testé différentes techniques de rendu (par exemple, élément LCP SSR par rapport au contenu SSR au-dessus de la ligne de flottaison par rapport au rendu côté client complet).

redBus

Les corrections apportées aux Core Web Vitals ont contribué à une augmentation de 80 à 100% du taux de conversion sur mobile (mCVR) et à une amélioration significative du classement du domaine sur les propriétés de marché mondial de Redbus.

Augmentation de 192% du classement du domaine en Colombie

Techniques

  • La correction des emplacements pour les composants de page et la suppression des scripts d'insertion de balises non optimisés ont amélioré le CLS.
  • L'optimisation des scripts tiers et la création de microservices basés sur le principe de responsabilité unique ont considérablement réduit le TTI et le TBT.

principaux enseignements

  • En réduisant le CLS de 1,65 à 0, il a pu améliorer considérablement le classement de ses domaines dans le monde.
  • En réduisant le TTI de 8 s à 4 s et le TBT de 1 200 ms à 700 ms, nous avons augmenté le taux de conversion sur mobile de 80 à 100% sur les propriétés mondiales.
  • L'utilisation d'outils RUM a permis de capturer les métriques de performances réelles sur les marchés de niveau inférieur.
  • Il est très important d'adopter une culture de la performance pour éviter la régression. Cela améliore également la productivité de l'équipe grâce à un code optimisé, à des versions plus rapides et à moins de problèmes de production.

Les études de cas ci-dessus montrent que vous pouvez accomplir beaucoup en adoptant les bonnes pratiques et en implémentant des solutions rapides. Voici quelques autres exemples concrets.

Netzwelt a vu ses revenus publicitaires augmenter de 18 %, Lazada a multiplié par trois son LCP et a vu son taux de conversion sur mobile augmenter de 16,9 %, et GAYO a multiplié par 3,1 son LCP et a vu son taux de clics augmenter de 108 %.

Les résultats ci-dessus ont été obtenus en profitant des opportunités faciles à saisir, par exemple:

Optimisation des images Optimisation JavaScript Annonces et contenu dynamique
Utiliser le format d'image WebP Différer le code JavaScript tiers Réserver de l'espace pour les annonces au-dessus de la ligne de flottaison
Utiliser des CDN d'images Supprimer le code JavaScript qui bloque l'affichage et les codes JavaScript inutilisés Définir la hauteur du contenu dynamique
Compression Chargement différé du code JavaScript non essentiel
Différer le chargement des images non critiques Précharger le code JavaScript critique
Précharger des images héros
Spécifier le format

Pour connaître d'autres bonnes pratiques, consultez les conseils sur les Web Vitals. Utilisez PageSpeed Insights pour auditer votre site Web et obtenir immédiatement des recommandations pratiques.

Plusieurs autres marques internationales ont également bénéficié d'investir dans les métriques Core Web Vitals.

Comment pouvez-vous commencer dès maintenant ?

Étape 1: Commencer à mesurer

Commencez par mesurer les données de champ de votre site à l'aide d'outils de surveillance des utilisateurs réels (RUM). Plusieurs outils RUM Google et tiers sont déjà disponibles.

Outils RUM

Outils Google RUM

  • Search Console
  • PageSpeed Insights
  • Bibliothèque JavaScript web-vitals
  • Rapport d'expérience utilisateur Chrome (CrUX)

Outils RUM tiers

  • Cloudflare
  • New Relic
  • Akamai
  • Calibre
  • Blue Triangle
  • Sentry
  • SpeedCurve
  • Raygun

Choisissez l'outil qui vous convient le mieux. Vous pouvez aller plus loin et intégrer Google Analytics 4 pour mettre en corrélation les métriques Web Vitals de base avec vos métriques commerciales.

Étape 2: Convainquez les personnes concernées

  • Expliquez à vos partenaires l'importance d'adopter les Core Web Vitals pour améliorer l'expérience utilisateur et leur corrélation avec les métriques métier de l'entreprise.
  • Trouvez un sponsor en interne pour lancer un petit test.
  • Définissez un objectif commun entre les personnes concernées pour améliorer les Core Web Vitals au sein des équipes.

Étape 3: Implémentez votre stratégie avec succès en suivant ces conseils

  • Priorisez: choisissez une page avec un trafic élevé et/ou une importance de conversion pour obtenir des résultats significatifs (par exemple, la page de destination des annonces, la page de conversion ou les pages populaires).
  • Test A/B: utilisez des tests côté serveur pour éviter tout coût de rendu. Comparez les résultats entre les versions optimisées et non optimisées.
  • Surveillez: utilisez la surveillance continue pour éviter les régressions.

Enfin, nous pensons que les performances sont un processus, et non une destination. À ce titre, nous prévoyons de mettre à jour cet article avec les derniers points forts des études de cas. Si vous avez également obtenu un résultat commercial intéressant et que vous souhaitez être présenté dans cet article, envoyez une proposition de contenu.