Google Pagespeed Insights pour les éditeurs - Conseils pour améliorer la vitesse des pages du site Web

La vitesse de chargement des pages est un facteur majeur pris en compte par Google pour le classement des résultats de recherche. Google s'est davantage concentré sur l'expérience globale des visiteurs et a créé Google Core Web Vitals pour suivre la vitesse de chargement des pages, la stabilité de la mise en page et la rapidité avec laquelle un utilisateur peut commencer à interagir avec une page.

Google a récemment commencé à mesurer la vitesse et l'expérience des pages sur une base réussite/échec, en tant que facteur de classement de recherche. L'expérience de la page est de plus en plus une référence pour les éditeurs en ligne, qui ressentent déjà l'impact des utilisateurs de blocs publicitaires sensibles aux temps de chargement des pages et à la bande passante.

Les éditeurs en particulier peuvent être affectés négativement par la nouvelle approche de test et de notation de la vitesse des pages de Google, car les publicités, les enchères d'en-tête, le ciblage et les outils publicitaires peuvent encore affecter l'expérience et la vitesse globales de la page. Vos Google PageSpeed ​​Insights sont intrinsèquement liés à votre portée. Si votre page se charge lentement, les nouvelles continueront et vous laisseront derrière.

Google PageSpeed ​​Insights et score Core Web Vitals

Google a développé l'outil PageSpeed ​​Insights pour analyser le contenu et la vitesse de chargement d'un site, évaluer les performances d'un site et fournir des informations pour aider les éditeurs à améliorer la vitesse du site. Google utilise un outil de vitesse de site appelé Lighthouse pour noter votre site de 1 à 100 séparément pour les versions de bureau et mobiles, 90+ étant un bon score.



À l'origine, PageSpeed ​​Insights était principalement axé sur les facteurs de vitesse de chargement, mais récemment, Google s'est concentré sur l'expérience globale du site. Google déclare : " L'optimisation de la qualité de l'expérience utilisateur est la clé du succès à long terme de tout site sur le Web."

PageSpeed ​​Insights a d'abord été tiré des tests de laboratoire du site Web, mais récemment, Google s'est concentré davantage sur l'expérience globale du site Web et a inclus des données de terrain sur les performances du site Web. Ils ont conçu Google Core Web Vitals (CWV), qui se concentre sur trois mesures de l'expérience utilisateur : la stabilité de la page, la vitesse de chargement du contenu et la vitesse d'engagement de la page.

Les spécialistes du référencement estiment que seules les données de champ Google sont utilisées pour le classement de la recherche et que le contenu de qualité joue toujours un rôle important dans les facteurs de classement.

Quelles sont les métriques Core Web Vitals de Google ?

Les Core Web Vitals de Google sont trois mesures qui évaluent la stabilité de la page, la vitesse de chargement de la page et la rapidité avec laquelle la page répond à l'interaction de l'utilisateur. Les Core Web Vitals sont mesurés et rapportés pour l'expérience de bureau et mobile, et sont accessibles depuis Google Search Console, ainsi que sur leur page développeur PageSpeed ​​Insights. Quiconque souhaite mesurer son propre site, ou n'importe quel site, peut saisir l'URL de la page et afficher le rapport.

• Largest Contentful Paint (LCP) - Cette note fait référence à la rapidité avec laquelle la page peut charger le contenu principal de la page. LCP de 2,5 secondes ou moins est un bon score.
  
  
• First Input Delay (FID) - Cette note mesure le temps qu'il faut à une page Web pour réagir à une action d'un utilisateur. Le minuteur de cette mesure démarre lorsqu'il y a quelque chose de visuel sur la page auquel un utilisateur peut réagir et se termine lorsque la page est en mesure de répondre à l'action de ce visiteur. Si la page ne peut pas répondre à l'utilisateur parce qu'elle répond à de nombreux autres scripts qu'elle charge en premier, le score FID en souffrira. Pour un score de réussite, un FID de 100 millisecondes ou moins est un bon score.
  
  
• Cumulative Layout Shift (CLS) - CLS mesure la stabilité visuelle de la page et de la mise en page. Si vous tabulez vers le bas, est-ce que les choses bougent ? Avez-vous des publicités, des images ou des éléments de page qui se chargent plus tard et modifient la mise en page ? Cela se traduit par un mauvais score CLS. Une note CLS de 0,1 ou moins est un bon score.

Cet exemple vidéo du groupe de développement de Google illustre le problème CLS. Un utilisateur essaie de refuser l'achat, mais la mise en page se déplace sur lui en cliquant et il clique accidentellement sur l'achat, ce qui entraîne une expérience très malheureuse.

Conseils de Google aux éditeurs effectuant leur propre audit de la vitesse des pages : "considérez qu'une page est réussie si elle atteint les objectifs recommandés au 75e centile pour les trois mesures ci-dessus".

La vitesse de chargement des pages et les principales métriques Web Vitals ont été intégrées à l'outil de développement de Chrome, disponible à partir du navigateur Chrome. Le mode développeur de Chrome prendra même un instantané de la page tout au long du processus de chargement, pour aider à identifier précisément où les problèmes se produisent.


Mise à jour : les données de recherche récentes de Tom Capper chez Moz suggèrent que les classements des sites Web sont principalement affectés s'ils échouent aux 3 seuils Core Web Vitals (LCP, FID, CLS), mais l'échec de 1 ou 2 n'a pas été corrélé avec un impact significatif sur classements.

Comment les éditeurs peuvent-ils améliorer la vitesse de chargement des pages et les principaux éléments vitaux Web ?

Les éditeurs doivent régulièrement suivre au moins les trois étapes suivantes pour améliorer les performances du site : premièrement, exécutez régulièrement des tests de vitesse de page et d'interaction et examinez les rapports ; deuxièmement, identifiez les éléments chargés qui sont inutilisés ou inutiles, tels que les anciennes polices ou les scripts css. Troisièmement, notez les images, CSS, vidéo et JavaScript qui peuvent tous être optimisés pour la taille et la vitesse de chargement via la compression, la minification ou la concaténation.

Vous trouverez ci-dessous des étapes et des ressources supplémentaires pour les éditeurs afin d'améliorer les temps de chargement du site, les principaux éléments vitaux du Web et l'expérience des visiteurs.

Implémenter le chargement différé pour améliorer FID Web Vital

Le chargement différé diffère le chargement des images ou d'autres éléments jusqu'à ce que le contenu et la mise en page de la page principale soient chargés et utilisables. Cela peut améliorer la bande passante et la métrique FID. Pensez aux images et aux éléments qui n'apparaîtront jamais au-dessus du pli, ces éléments pourraient être différés pour s'assurer que l'expérience initiale est rapide et interactive.

Wordstream propose un bon article sur quand et comment implémenter le chargement paresseux, mais vous voudrez peut-être vérifier auprès de communautés spécifiques construites autour de votre système CMS. Hubspot a intégré le chargement paresseux à certaines de leurs fonctions, et il existe une multitude de plugins Wordpress pour l'automatisation du chargement paresseux.

Tirer parti d'un CDN de réseau de diffusion de contenu

Tirez parti d'un CDN et assurez-vous qu'il est correctement configuré pour les performances. Un réseau de diffusion de contenu (CDN) peut réduire la bande passante et les temps de chargement des pages en hébergeant des copies de vos médias géographiquement plus proches des utilisateurs. Par exemple, un visiteur au Canada pourrait voir votre contenu livré par un serveur CDN à Toronto, tandis qu'un visiteur simultané en Inde pourrait avoir du contenu livré depuis Chennai, le tout géré de manière optimale par le CDN.

Compressez les images et les vidéos pour un chargement de page plus rapide

Les fichiers multimédias volumineux sont l'un des principaux coupables de commentaires dans les temps de chargement lents des pages et l'un des plus faciles à traiter. Vous devez classer toutes les images de votre site par taille et faire immédiatement attention à celles de 100 000 ou plus. Vous pouvez spider votre site avec un outil comme Screaming Frog pour identifier toutes les grandes images en quelques minutes. Wordpress et les systèmes CMS modernes ont souvent des outils de compression d'image intégrés, mais vérifiez vous-même. Parfois, vous pouvez faire beaucoup mieux avec des outils tiers spécialement conçus pour la compression d'images, tels que tinypng ou jpeg-optimizer.

Supprimer les fichiers JavaScript inutilisés pour améliorer la vitesse de rendu des pages

Votre page Web a-t-elle un gonflement JavaScript? Si le JavaScript bloque le rendu, il doit être appelé, téléchargé, analysé, évalué et exécuté avant que la page puisse terminer le rendu. Avez-vous des fichiers JavaScript inutilisés ? Les fichiers JavaScript peuvent s'accumuler pour le ciblage, les systèmes CMS, la définition des pixels de suivi, les balises sociales, le chargement des polices, etc. Vous pouvez identifier en détail la quantité de votre JavaScript inutilisé en utilisant la fonctionnalité de couverture dans Chrome DevTools.

Lors de l'exécution de l'outil Google Page Speed, il identifiera tout code JavaScript contenant plus de 20 kilo-octets de code inutilisé.

Combinez ou minimisez le CSS et les scripts pour améliorer la vitesse de la page

La minimisation de ces scripts conserve leur lisibilité machine mais les rend beaucoup plus rapides à charger. Il existe plusieurs outils disponibles pour minifier les scripts ; RankRed a rassemblé un bon assortiment d'outils et de descriptions de minification de script. Vous pouvez également économiser des déplacements vers le serveur si vous concaténez des fichiers JavaScript ou CSS.

Optimisation du cache pour Core Web Vitals

La stratégie de cache doit être revue pour le type de site que vous avez, à travers les fonctions PI de cache telles que Cache-control et Last-Modified. Les développeurs de Google fournissent des conseils et une liste de contrôle pour les options de cache, ainsi que des options de configuration pour les serveurs populaires. Vous pouvez précharger le cache afin que la page soit déjà optimisée avant que Googlebot n'arrive pour évaluer les performances.

Le fabricant d'outils WP, WP Rocket, suggère que le cache de préchargement peut être une aide essentielle pour améliorer la vitesse de la page, et a créé cette vidéo pour l'expliquer.

Aider les navigateurs à allouer de l'espace pour éviter le décalage de mise en page

• Spécifiez les attributs de hauteur et de largeur de l'image afin que le navigateur puisse planifier leur immobilier, même s'ils se chargent paresseux plus tard.
• Réservez de l'espace pour les publicités, les iframes et le contenu dynamique. Utilisez des conteneurs pour éviter les changements de mise en page au moment du rendu.
• Envisagez d'optimiser l'affichage des polices avec le lien rel="preload"   et font-display : facultatif.
  
  

Exécuter des analyses

L'exécution d'un test PageSpeed ​​fréquent peut vous donner plus d'informations sur vos principaux éléments vitaux Web. Non seulement vous pouvez voir un score de vitesse de page, mais vous pouvez voir combien d'éléments sont chargés et à quelle vitesse ils se chargent. Plongez dans vos rapports pour identifier les éléments qui pourraient freiner la vitesse de votre page. Voici quelques outils populaires permettant d'afficher différents niveaux de détail et de générer des rapports sur le chargement des pages, la vitesse des pages et l'optimisation pour les moteurs de recherche :

• Google PageSpeed Insights
• GTmetrix
• Surveillance de la vitesse des pages Pingdom
• WebPageTest

Voici quelques recommandations pour des discussions plus techniques et détaillées sur l'optimisation de la vitesse des pages :

• Comment améliorer la vitesse du site WordPress
• Nitropack : comment mesurer et améliorer les éléments vitaux Web de base
• SearchEngineWatch - 28 façons de booster votre site
• Toptal - Acing à l'évaluation PageSpeed ​​Insights de Google
• Smashing Magazine - Guide pour mesurer les principaux éléments vitaux du Web
• Web.dev - Améliorez les performances du site avec des temps de chargement rapides
  
  

Les abonnements payants sont-ils dans vos plans futurs ?

Comment Admiral aide à améliorer les performances des éditeurs

Admiral a été l'un des premiers défenseurs de l'importance de l'expérience de la page pour les éditeurs, en particulier en écrivant et en parlant de la vitesse de la page, de l'expérience publicitaire, des meilleures publicités par rapport aux mauvaises publicités, et plus encore. L'amélioration de l'expérience du site peut aider à réduire l'utilisation des logiciels de blocage des publicités par les consommateurs.

De plus, alors que de nombreux fournisseurs de technologies publicitaires se concentraient sur des solutions ponctuelles, Admiral a construit une plate-forme d'automatisation de l'engagement horizontal qui fournit des solutions tout au long du parcours de la relation avec les visiteurs, conçues pour réduire la charge technologique des éditeurs.

Les solutions ponctuelles multiplient la dette technologique pour les éditeurs

En utilisant des solutions ponctuelles, les éditeurs peuvent se retrouver avec de nombreuses balises, intégrations, moteurs de décision de ciblage, discussions avec leur équipe de développement, etc. Ils créent essentiellement un monstre de Frankenstein avec une vitesse de page et des impacts UX s'ils utilisent des systèmes distincts pour la croissance de la newsletter, adblock récupération, gestion du consentement, abonnements payants, murs d'inscription, croissance des abonnés sociaux, etc.

Admiral vérifié par un test de vitesse tiers sur plus de 100 scénarios clients

Admiral a été proactif pour aider les éditeurs à optimiser Core Web Vitals et a engagé une agence numérique reconnue à l'échelle nationale (Anvil Media) pour tester rigoureusement la solution à balise unique d'Admiral pour la vitesse et l'impact sur Core Web Vitals.

Les experts en vitesse de page d'Anvil ont testé la balise Admiral sur 15 sites clients, tous les modules de la solution Admiral, ordinateur de bureau et mobile, sur cinq jours, avant et après la mesure, et les 3 métriques CWV ; Plus de 300 points de données en tout.