Étude de cas mesurant l'impact et les avantages complets des scores de performances élevés sur les métriques Core Web Vitals.
RebelMouse est un CMS cloud qui propose aux éditeurs les outils et la stratégie créative basés sur les données dont ils ont besoin pour offrir la meilleure expérience possible à leurs audiences, nouvelles et anciennes. Nous fournissons des solutions aux propriétés Web à fort trafic de sociétés de médias telles que Upworthy, Narcity, Raw Story, Brit + Co et The Independent, ainsi qu'à des sites à fort potentiel comme Penske Trucks, Vault12, Gaingels et bien d'autres.
Notre plate-forme touche plus de 100 millions de personnes par mois rien qu'aux États-Unis. L'entreprise a été fondée sur la conviction que le Web ouvert doit répondre aux attentes les plus élevées des consommateurs pour prospérer. Les normes définies par les métriques Web Vitales de Google s'inscrivent dans cette vision axée sur l'utilisateur.
Depuis plus de dix ans, notre équipe internationale développe un CMS qui crée des expériences utilisateur positives et intuitives qui se traduisent par des résultats commerciaux significatifs. Les métriques Core Web Vitals sont un benchmark qui garantit que cette boucle symbiotique se poursuit sur chaque nouveau site que nous propulsons.
Pourquoi donner la priorité aux performances améliore les résultats commerciaux
De nombreux éditeurs doutent que d'excellents scores Core Web Vitals soient vraiment utiles. Ils craignent également qu'une expérience utilisateur de qualité ne suffise pas à augmenter le nombre de lecteurs dont ils ont besoin. Heureusement, notre priorité étant les performances chez RebelMouse, nous disposons des données qui prouvent que les Core Web Vitals sont un excellent moyen de générer du trafic et de fidéliser les utilisateurs, ce qui est essentiel pour réussir.
Pour illustrer ce point, nous avons analysé le comportement de l'audience de plusieurs sites que nous hébergeons, avant et après avoir optimisé les performances des métriques Core Web Vitals. En particulier, nous avons défini des types d'utilisateurs pour séparer les audiences en catégories principales:
- Nouveaux visiteurs:utilisateurs ayant visité un site pour la première fois.
- Visiteurs connus:utilisateurs ayant enregistré au moins deux sessions.
- Visiteurs fidèles:utilisateurs ayant enregistré au moins trois sessions.
- Fans:utilisateurs ayant eu au moins quatre sessions.
- Superfans:utilisateurs ayant enregistré au moins cinq sessions.
Références : - https://www.hotjar.com/google-analytics/glossary/users - https://databox.com/new-vs-returning-visitors
Les données de terrain, collectées par Google Analytics, étaient extrêmement claires. En nous concentrant sur les catégories de visiteurs fidèles, de fans et de superfans, nous avons constaté que les utilisateurs sont beaucoup plus susceptibles de rester plus longtemps, de consommer plus de contenus et de revenir plus souvent sur les sites qui obtiennent d'excellentes notes pour leurs Core Web Vitals. Voici quelques exemples notables:
Mais la consommation de contenu et le temps passé par utilisateur ne sont pas les seules métriques à avoir enregistré une forte hausse. Le nombre d'utilisateurs et de pages consultées a également augmenté dans les mêmes catégories:
De la performance moyenne à la performance élevée: comment RebelMouse transforme les sites Web
La bonne nouvelle est que vous pouvez améliorer vos performances Core Web Vitals en apportant des modifications stratégiques et réfléchies au code de votre site. Voici quelques-unes des façons dont RebelMouse améliore les performances des sites Web:
Progressive web app
RebelMouse optimise tous les appels tiers dans une application Web progressive qui diffuse d'abord le contenu le plus important, puis séquence le reste des appels selon les besoins du lecteur.
Nous avons une méthode qui charge JavaScript immédiatement après la fin de l'événement Largest Contentful Paint (LCP). Nous proposons à nos utilisateurs de charger JavaScript via trois niveaux de priorité différents:
- Optimisé est la meilleure option pour les utilisateurs qui souhaitent bénéficier des dernières approches de pointe. Nous l'utilisons dans notre propre travail de développement. Ce niveau de priorité suspend le déclenchement du code JavaScript jusqu'à ce que la page soit entièrement chargée, ce qui vous offre les meilleures performances.
- Le blocage du chargement permet d'exécuter JavaScript immédiatement et a généralement un impact négatif sur vos scores de performances. Ce niveau de priorité déclenche le code JavaScript immédiatement après le chargement de la page. Cela peut entraîner une baisse de 10 à 40 points de votre score lié aux performances, en fonction de l'appel supplémentaire.
- Post-LCP est la meilleure option pour combiner d'excellents scores de performances et une vitesse de chargement très rapide. Ce niveau de priorité entraîne le chargement de JavaScript immédiatement après la fin de l'événement "Largest Contentful Paint". (Nous vous recommandons de ne l'utiliser que pour les annonces, lorsque vous avez augmenté vos revenus en diffusant des annonces auprès d'utilisateurs qui ne restent que cinq secondes environ sur la page.)
Optimiser l'intégration des réseaux sociaux
Pour protéger les scores CLS (Cumulative Layout Shift) et LCP (Largest Contentful Paint), tous les éléments intégrés de réseaux sociaux doivent être configurés pour le chargement différé.
Pour préserver le CLS, vous devez déterminer dynamiquement la taille de l'intégration à l'aide d'une technologie côté serveur, puis l'insérer dans votre propre stockage des propriétés de cette intégration. Ensuite, l'intégration doit être envoyée à votre front-end pour éviter que la mise en page ne change lors du chargement. Pour en savoir plus sur ce sujet, consultez nos articles spécifiques sur les exemples Twitter et TikTok.
HTML et CSS ultra-légers et intelligents
Le code HTML et CSS du site doit être conçu de manière à permettre le préchargement des images et du texte au-dessus de la ligne de flottaison avant le reste de la page.
- Les constructions HTML incorrectes obligent le navigateur à traiter de nombreux éléments de site inutiles situés en dessous de la ligne de flottaison afin d'afficher ce qui se trouve au-dessus de la ligne de flottaison dans la première fenêtre d'affichage.
- Pour en savoir plus sur la façon dont nous y parvenons sur RebelMouse, consultez les articles suivants :
- Découvrez comment améliorer les métriques Core Web Vitals.
- Guide complet sur l'implémentation de vitesses de chargement rapides des pages, y compris avec des scripts tiers.
- Guide détaillé sur l'optimisation du LCP.
Publier en privilégiant les performances
Depuis le déploiement de Core Web Vitals, les développeurs ont constaté l'impact de leurs plates-formes d'édition sur les seuils recommandés par Google.
HTTP Archive, un projet open source qui identifie les tendances et enregistre les tendances historiques sur des millions d'URL, a révélé dans son rapport sur la technologie Core Web Vitals comment les principaux systèmes de gestion de contenu se comparent aux normes d'expérience sur la page de Google. RebelMouse a systématiquement surpassé les principales plates-formes de CMS sur les métriques les plus critiques de Google depuis son déploiement et jusqu'en 2022:
Performances sans compromis
Créer des contenus de qualité n'est plus que la moitié de la bataille pour les éditeurs et les marques. Les contenus de qualité doivent être compatibles avec une technologie moderne qui peut suivre le rythme et les normes du Web d'aujourd'hui. Nous sommes en mesure de fournir des Core Web Vitals qui répondent aux critères, car les performances du site ne sont pas seulement un objectif, mais un pilier de l'entreprise qui fait partie intégrante de notre culture. Nous nous concentrons sur les performances pour aider nos clients à exploiter pleinement le Web ouvert en augmentant leur trafic et leurs revenus, sans nuire à l'expérience utilisateur.
Pour en savoir plus sur la façon dont nous pouvons aider votre site à dépasser les normes du secteur en matière de Core Web Vitals, cliquez ici pour en savoir plus sur RebelMouse.