Avant tout, parlons de quoi Google Core Web Vitals sont. Ce sont un certain nombre de mesures différentes que Google utilise pour évaluer votre site. Ils incluent des paramètres comme la vitesse de la page, à quel point la page est interactive, UX / UI, des images distrayantes ou d'autres éléments, et combien la conception change tout en faisant défiler la page.
Ces mesures sont conçues pour faciliter les créateurs de sites Web pour améliorer leurs sites et les rendre plus conviviaux. Alors, quelles sont les mesures?
Tableau de contenu
- Métriques que Google utilise pour mesurer les vitaux du Web de base
- Pourquoi Google Core Web Vitals compte
- Comment tester vos principaux articles de base actuels
- Comment améliorer votre score vital Web
- Améliorez votre plus grand score de peinture contenu (LCP)
- Comment améliorer votre premier score de retard d'entrée (FID)
- Comment améliorer votre score de décalage de disposition cumulatif (CLS)
- Bonus: accélérez votre site Elementor WordPress avec Elementor Speed Optimizer pour suivre les vitaux du Web Core
- Conclusion
Métriques que Google utilise pour mesurer les vitaux du Web de base
Google utilise trois mesures pour déterminer votre score vital Web: LCP, FID et CLS. Chacun mesure un aspect différent de votre site. Bien que ces termes puissent sembler un peu techniques, en réalité, ils sont assez simples. Eh bien, pour comprendre comment Google mesure les vitaux du Web de base, regardons chacun:
LCP
LCP représente le plus grand point content. Cela mesure essentiellement le temps de chargement initial d'une page Web. Plus précisément, il mesure le vitesse de charge perçue du «contenu principal». Le contenu principal fait référence à la plus grande image ou bloc de texte visible sur la page lorsqu'il commence à se charger - et pas la page entière.
C'est important à comprendre, car il ne mesure pas le contenu qui est pas En vue lorsque la page se charge - par exemple, le texte d'un article qui n'est visible qu'après faire défiler vers le bas. Il mesure uniquement la partie immédiatement visible de la page.
Fid
Fid représente le premier retard d'entrée. Cette métrique est un peu plus nuancée, mais se réfère simplement à l'interactivité et à la réactivité de l'UX. Un score FID inférieur (meilleur) signifie que votre page est réactive et réagit rapidement à toute interaction utilisateur. Par exemple, lorsqu'ils appuyent sur un bouton ou cliquez sur un lien, FID mesure l'heure à partir du action utilisateur au Processus débutant.
Votre site Web devrait faciliter le traitement du navigateur de l'utilisateur de commencer à traiter l'action. Si un utilisateur clique sur un bouton mais qu'il faut quelques secondes pour que l'action commence, votre score FID sera pire, car cela a un effet négatif sur l'expérience utilisateur.
CLS
Enfin, CLS représente le décalage de disposition cumulatif. Cela suit combien la disposition change après La page est entièrement chargée. Ceci est généralement dû à l'une des deux choses:
- Des éléments comme les images sont chargés beaucoup de temps après le chargement de la page elle-même (généralement asynchrone)
- L'utilisateur clique sur un bouton ou effectue une autre action, ce qui fait ensuite changer la disposition d'origine de manière déroutante.
Pourquoi Google Core Web Vitals compte
Maintenant, nous savons ce que sont les vitaux de Google Web ou les Vitals du Web de base. Mais pourquoi sont-ils importants? Et comment affectent-ils votre site Web et les résultats de recherche de Google?
Effet majeur sur le référencement
Le plus grand impact de votre score Web vital est sur l'optimisation des moteurs de recherche ou le référencement. Pour évaluer votre site Web, Google utilise les vitaux Web - ainsi que d'autres mesures telles que la convivialité, la SSL, les pop-ups (ou leur absence) et la qualité du contenu.
En tant que tel, vous assurer que vos scores Web Vitals sont bons sont très importants si vous souhaitez améliorer votre référencement et apparaître plus haut dans les résultats de recherche.
Ventes perdues
Si vous exécutez un site Web de commerce électronique, vous voudrez également améliorer vos vitaux Web. Les sites Web qui se chargent lentement, ont des boutons lents et des éléments UX, et ont de fréquents changements de mise en page effrayeront les clients potentiels. Un site lent semble moins fiable et rend les clients hésitants à saisir les informations de paiement.
Comment tester vos principaux articles de base actuels
Passons maintenant à votre site Web et parlons de la façon de tester vos propres scores vitaux. Selon vos compétences techniques, il existe différentes façons de le faire. La façon la plus simple de les vérifier, cependant, est via Google Page Insights, nous nous concentrerons donc principalement sur cela.
Notez qu'il est normal qu'il y ait de légères différences entre chaque outil, alors ne vous inquiétez pas si les nombres sont différents. De même, les résultats des tests de bureau et mobile varieront.
Google Pagespeed Insights
Google propose un outil pour analyser les signes vitaux pour vous. Ça s'appelle PageSpeed Insights Et cela vous donnera une tonne de données sur votre site.
Pour exécuter un test, tapez simplement l'URL de votre site Web dans la barre et appuyez sur Analyser. Une fois le test terminé, vous verrez les résultats. Le premier élément couvre les vitaux du Web de base.
Si les scores ne sont pas satisfaisants, la barre sera rouge. Vous pouvez également cliquer Développer la vue Pour voir plus de détails. Vous devez également basculer le paramètre sur Desktop pour vous assurer que vos scores y sont également assez bons.
Couvrons maintenant brièvement quelques autres options pour tester vos scores vitaux ou voyons où vous en êtes selon les principaux vitaux du Web de Google.
Console de recherche Google
Le Console de recherche Google est un outil que vous pouvez configurer avec votre site Web pour obtenir des commentaires et des conseils pour améliorer les performances de vos résultats de recherche Google. Contrairement à PageSpeed Insights, il vous oblige à vérifier que vous possédez le domaine en ajoutant un enregistrement TXT à votre confirmation DNS.
Une fois que vous avez fait cela, vous pouvez vous connecter au panneau d'administration de la console de recherche Google, puis trouver l'onglet Core Web Vitals sur la barre latérale gauche.
L'extension Web Vitals
Si vous utilisez le navigateur Google Chrome, il y a maintenant une extension que vous pouvez installer pour vérifier vos scores vitaux dans le navigateur. Ça s'appelle Web vitals Et vous pouvez le télécharger à partir de la boutique en ligne Chrome.
Une fois que vous avez installé l'extension, accédez simplement à l'URL de votre site Web, cliquez sur le bouton Extensions dans la barre de navigation supérieure, puis sur l'extension Web Vitals. Après un moment, vous verrez les résultats du Web Vitals:
Chrome Devtools et Lighthouse
Une autre option pour les utilisateurs de Chrome est le Devtools Suite d'outils de développement Web, qui est intégré au navigateur lui-même. L'un de ces outils est appelé Lighthouse et vous permet de vérifier les scores Web Vitals.
Pour ouvrir un phare, accédez à votre site Web, puis cliquez avec le bouton droit sur la page. Sélectionner Inspecter puis choisissez le Phare Onglet en haut:
Une fois sur place, cliquez Générer un rapport et attendez un moment pour la création du rapport. Ce rapport comprend des scores pour l'accessibilité, le référencement, les performances et autres mesures.
Comment améliorer votre score vital Web
Ainsi, vous avez effectué les tests ci-dessus et voyez un besoin d'amélioration. Parlons de réparer vos scores!
Quelle que soit la méthode que vous avez utilisée ci-dessus, vous devriez s'il y a des problèmes. Certaines des méthodes de test (Pagespeed Insights, par exemple) vous donnent une liste d'améliorations directement dans les résultats des tests. Mais il existe également d'autres actions que vous pouvez prendre pour améliorer vos scores.
Étant donné que chacune des trois mesures concerne différents aspects de votre site, il est logique d'organiser les solutions séparément. Pour la plupart des sites Web, il est peu probable que vous ayez un problème avec LCP, FID et CLS en même temps.
Améliorez votre plus grand score de peinture contenu (LCP)
Commençons par le score LCP. Comme mentionné ci-dessus, ce score mesure le temps de chargement initial du contenu principal sur une page.
Quel score idéal
Qu'est-ce qu'un score LCP idéal? Selon le Guide Google officiel, Vous devriez avoir un LCP de 2,5 secondes ou moins. En général, plus votre site se charge rapidement, mieux c'est, alors visez à rendre ce nombre aussi bas que possible.
Si votre score LCP est de 2,5 secondes ou plus, que devez-vous faire? Discutons de quelques solutions.
Utilisez un meilleur hôte
La solution la plus simple est peut-être de mettre à niveau votre hôte. Les hôtes de meilleure qualité (comme ConVveio) amélioreront votre score LCP sans que vous ayez besoin de faire beaucoup vous-même. L'amélioration sera particulièrement visible si vous utilisez actuellement un plan d'hébergement partagé ou un hébergement cloud à un seul niveau.
Conveio est construit avec la vitesse, l'évolutivité et la sécurité à l'esprit. Sur la base des serveurs Google Calcul de haute performance exécutant des environnements contenerisés et exécutant CloudFlare Enterprise pour la vitesse et la sécurité, vous pouvez être sûr que votre site Web à haute trafic aura des temps de chargement de page stables.
Cache de page
La plupart des hôtes implémenteront leurs propres solutions de mise en cache, mais vous pouvez également utiliser un plugin de mise en cache de page comme WP Rocket ou WP Super Cache. Ces plugins diminueront le temps qu'il faut pour que votre site se charge.
Retirer JS et CSS inutilisés & Supprimer ou redimensionner les grandes images
Les fichiers JavaScript et CSS sont souvent parmi les fichiers les plus importants, donc il est certainement payant pour les minimiser. Il existe de nombreuses façons de le faire, allant d'un plugin comme WP Super Minify à une solution plus manuelle comme UGlifyJS.
De même, vous voudrez peut-être envisager simplement de supprimer complètement le code JavaScript et CSS inutile. La plupart des sites Web ont un peu de code ancien et inutilisé, il est donc avantageux de jeter un œil et de voir si vous pouvez supprimer quoi que ce soit.
Les images sont généralement les plus gros fichiers sur un site Web, surtout s'ils ne sont pas optimisés et compressés autant que possible. Il est également courant de télécharger des images inutilement larges.
Si vous êtes en mesure de supprimer des images sans affecter la qualité de votre contenu, nous le recommandons. Sinon, essayez de rendre vos images suffisamment larges si nécessaire. Pour la plupart des appareils, cela signifie 2500px de large au maximum. Tout ce qui est plus grand que cela est généralement inutile et le plus susceptible d'avoir un impact négatif sur les vitaux du Web de base.
Utilisez un réseau de livraison de contenu (CDN)
Un CDN, ou réseau de livraison de contenu, est un réseau de serveurs distribué qui aide à charger votre site Web plus rapidement en fonction de l'emplacement du visiteur. Par exemple, si un visiteur est en Europe, un CDN chargera votre site à partir d'un serveur à proximité et pas d'Amérique du Nord, d'Asie ou partout où votre maison peut être.
Désinstaller des plugins et des thèmes inutilisés
Enfin, c'est toujours une bonne idée de supprimer les plugins et les thèmes inutilisés. Nous vous recommandons de parcourir périodiquement vos thèmes et plugins installés et en supprimant tout ce que vous n'avez pas utilisé depuis un certain temps.
Comment améliorer votre premier score de retard d'entrée (FID)
Regardons maintenant FID. Si vous vous souvenez de la section précédente, FID est préoccupé par l'interactivité et le retard entre quand Une action est prise et Le processus commence. Par exemple, en cliquant sur un bouton, puis en effectuant une action.
Quel score idéal
Un bon score FID devrait être de 100 millisecondes ou moins, selon Site Web Web.dev de Google.
Donc, si votre score est supérieur à 100 millisecondes, que pouvez-vous faire pour l'abaisser? Pour la plupart, FID est lié au code JavaScript, car JS est utilisé dans la plupart des éléments interactifs.
En tant que tel, la meilleure façon d'améliorer votre score FID est d'optimiser votre code JavaScript et de supprimer tout ce que vous n'utilisez pas. Vous devriez également avoir un thème frontal plus léger et moins lourd:
- Utilisez Async pour charger JavaScript ou reportez-le.
- Vérifiez le personnalisateur WordPress pour voir si vous avez inséré un code JavaScript inutile.
- Votre thème peut également avoir une section distincte pour ajouter JS. Vérifiez-le pour vous assurer que le code est toujours utilisé.
- Réduire les dépendances, si possible. Plus votre code a de dépendances, plus vous devrez charger.
- MINIFIEZ VOTRE JavaScript à l'aide d'un plugin comme WP Super Minify ou directement à l'aide d'UGlifyJS.
Comment améliorer votre score de décalage de disposition cumulatif (CLS)
Enfin, regardons CLS, qui mesure combien la disposition se déplace.
Quel score idéal
Si nous regardons le site Web.dev officiel par Google, un bon score est défini comme étant 0,1 ou moins. Ce nombre est calculé de manière assez complexe, mais se résume essentiellement pour calculer le mouvement des éléments instables.
Si votre score CLS est supérieur à 0,1, que pouvez-vous faire pour l'améliorer? Vous avez surtout besoin de spécifier certaines dimensions pour tous les éléments «flexibles». Autrement dit, si la taille ou la forme de l'élément est basée sur la taille de l'écran de l'utilisateur ou une action, comme cliquer sur un bouton.
- Images. Tout d'abord, vous devez faire des dimensions spécifiques pour toutes les images de votre site. Cela signifie que vous ne devriez pas avoir une image énorme (5000px ou plus) qui modifie considérablement la disposition du site en fonction de l'appareil.
- Annonces dynamiques. Si vous avez des espaces publicitaires dynamiques sur votre site, assurez-vous de définir une largeur et une hauteur spécifiques pour la fenêtre de visualisation. Ceci est particulièrement important car, sinon vous n'avez généralement pas de contrôle sur la taille et la forme des annonces affichées.
- Intégres et iframes. Enfin, assurez-vous que tous les éléments intégrés (par exemple, les vidéos YouTube) ont un ensemble de dimensions spécifiques.
Autres conseils et astuces
Enfin, voici également quelques autres conseils qui amélioreront probablement vos scores. Bien que vous n'ayez pas susceptible d'améliorer considérablement vos vitaux Web en les faisant, ils sont néanmoins une bonne idée. Ceux-ci pourraient pousser un peu pour mieux respecter Google Core Web Vitals Metrics.
Utilisez des plugins et des thèmes optimisés légers
Malheureusement, de nombreux thèmes et plugins WordPress peuvent être gonflés avec du code inutile ou mal écrit, des fonctionnalités étrangères et d'autres éléments. Ceux-ci rendent votre site plus lent et peuvent parfois interférer avec le navigateur. Il en résulte des scores vitaux Web plus bas.
Gardez les plugins et les thèmes à jour
C'est toujours une bonne idée de tenir les thèmes et les plugins mis à jour vers la dernière version. Ceci est généralement recommandé pour des raisons de sécurité, mais il convient également de noter que les mises à jour rendent également (normalement) le plugin plus efficace. À mesure que les développeurs s'améliorent, cela améliorera également vos scores Web vitaux!
Bonus: accélérez votre site Elementor WordPress avec Elementor Speed Optimizer pour suivre les vitaux du Web Core
Elementor est l'un des pionniers des constructeurs de pages dans l'industrie WordPress . Il propose certains des widgets et fonctionnalités les plus incroyables pour créer un site Web professionnel en peu de temps. Avec ses fonctionnalités incroyables, les gens deviennent fous et utilisent un grand nombre de widgets et de fonctionnalités pour créer leurs sites Web.
Et enfin, ils se retrouvent avec un site Web qui est lent et ne se charge pas dans le temps. C'est pourquoi ils ont besoin d'un plugin qui accélérera leurs sites WordPress .
Le plugin Speed Optimizer possède de nombreuses fonctionnalités intéressantes qui en font l'un des meilleurs plugins Speed Booster. La fonctionnalité comprend,
Mode liste noire
Vous pouvez bloquer des pages ou des messages spécifiques à partir des actifs de chargement Elementor. Activez le plugin et vous trouverez des options pour afficher chaque page et publier sur votre site pour empêcher leurs actifs supplémentaires de charger. Vous pouvez également limiter jusqu'à 20 éléments sur la version gratuite (10 pour les pages et les messages chacun).
Booster WooCommerce
Chaque seconde sur votre magasin WooCommerce peut décider entre gagner ou perdre une vente potentielle. Vous devez donc vous assurer que vous êtes prêt avec les outils d'optimisation de la vitesse WooCommerce appropriés. Contrairement à d'autres plugins de cache WordPress , un seul clic dans le plugin bloquera tout inutile Assets Elementor du chargement sur votre boutique WooCommerce.
Support des modules complémentaires Premium Elementor
En plus du générateur de page Elementor, ce plugin prend en charge les modules complémentaires Elementor les plus populaires. Cette liste comprend
- Elementskit pour Elementor
- Addons essentiels pour Elementor:
- Addons premium pour Elementor
- Happy Addons pour Elementor.
- Addons d'alimentation pour Elementor
Restriction en un clic
Vous pouvez bloquer toutes les pages / articles en chargeant des actifs inutiles (caches, fichiers ou requêtes) en un seul clic dans le mode Blacklist. Bienvenue dans l'avenir de l'optimisation WordPress !
Score SEO amélioré
Avec une optimisation appropriée de la vitesse de la page Google via le plugin, votre classement organique s'améliorera considérablement car votre site Web se chargera plus rapidement. De plus, votre site sera plus adapté aux mobiles. En conséquence, les métriques Google Core Web Vitals comme la plus grande peinture de contenu (LCP), le temps de blocage total (TBT) et le décalage de disposition cumulatif (CLS) seront améliorés.
Amélioration des scores de performance
Vous pouvez facilement voir la différence dans le temps de chargement de votre page en testant votre URL en ligne. Il existe de nombreuses ressources en ligne de confiance où vous pouvez le faire, y compris GTMetrix, et l'outil de vitesse de la page Google.
Conclusion
Dans cet article, nous avons couvert tout ce que vous devez savoir sur Google Core Web Vitals. Tout d'abord, nous avons parlé des trois mesures que Google utilise (LCP, FID et CLS) et comment découvrir vos propres scores. Ensuite, nous avons parcouru une variété de solutions différentes pour les améliorer, dont la plupart sont heureusement assez simples.