qwanturank

Nous avons abordé les trois Core Web Vitals dans notre article précédent sur l’optimisation de la mise à jour Core Web Vitals de Google. Cependant, nous ne pouvons pas parler de Core Web Vitals sans une analyse approfondie d’un facteur clé : LCP, également connu sous le nom de Largest Contentful Paint. Dans ce guide, nous allons explorer ce qu’est LCP, pourquoi il est important, ses avantages et les améliorations que vous pouvez apporter pour optimiser votre site Web.

LCP est l’abréviation de Largest Contentful Paint. LCP est une mesure de la vitesse de la page; il vous indique combien de temps il faut au contenu principal d’une page Web pour se charger (en gros, lorsque la page devient lisible pour l’utilisateur.) LCP fait partie intégrante de l’expérience utilisateur.

Les utilisateurs ne veulent généralement pas traîner et attendre le chargement d’un site alors qu’ils pourraient immédiatement bénéficier d’une meilleure expérience ailleurs. Si votre LCP est médiocre, vous pourriez connaître un taux de rebond plus élevé et votre classement général pourrait en prendre un coup. Un mauvais LCP peut même conduire à un taux de conversion inférieur – ce qui n’est pas bon pour les entreprises en herbe.

Grâce à la mise à jour Core Web Vitals de Google, LCP devient un facteur plus important pour votre classement sur les SERPs. Pour maintenir un classement organique et maintenir ces visiteurs, il est très important de rester au top de votre LCP. LCP s’applique uniquement au contenu principal au-dessus du pli.

Cela inclut toutes les images, vidéos ou blocs de texte qui s’affichent sans que l’utilisateur ait à faire défiler vers le bas pour les trouver. Gardez cela à l’esprit lorsque vous notez les zones à problèmes. Selon les directives de Google, le contenu principal de votre page doit se charger dans les 2,5 premières secondes de la visite d’un utilisateur pour gagner un bon LCP.

Le graphique ci-dessous montre cela plus en détail : Si vos utilisateurs doivent attendre cinq secondes ou plus pour que le contenu principal se charge (c’est-à-dire si votre LCP est médiocre et a besoin d’être amélioré), ils sont très susceptibles d’abandonner et de regarder ailleurs. Les directives de Google précisent en outre que votre LCP doit être classé comme « bon » au moins 75% du temps. Si vous pouvez gérer cela, vos performances vont monter en flèche.

Nous allons examiner votre LCP spécifique dans un instant. Pour l’instant, concentrons-nous sur les causes générales des mauvais LCP et sur la manière de s’y attaquer. La liste de ce qui pourrait causer un mauvais LCP est techniquement infinie.

Il peut s’agir de tout ce qui prend beaucoup de place : des lecteurs multimédias intégrés qui peuvent ralentir une page, des diapositives d’images non optimisées, des boutons de médias sociaux ou même des widgets comme la connexion, un formulaire d’inscription à la newsletter, etc. Mais soyons un peu plus précis. Comme le montre le graphique ci-dessus, les facteurs à l’origine d’un LCP médiocre appartiennent souvent à quatre groupes principaux : Un temps de réponse lent du serveur a un impact négatif sur toutes les métriques de vitesse de chargement et est, par conséquent, une cause définitive d’un LCP médiocre.

La lenteur des temps de réponse du serveur est souvent le résultat de problèmes avec votre infrastructure back-end, de requêtes de base de données non optimisées ou de réponses API qui prennent beaucoup de temps à résoudre, le tout se produisant en arrière-plan de votre site. La première étape pour améliorer cela consiste simplement à vous assurer que vous hébergez votre site Web sur un bon serveur. Bien que la personnalisation de votre site Web soit un excellent moyen de l’aider à se démarquer, l’ajout de JavaScript et de CSS pour embellir le thème de votre site et son contenu aura malheureusement également un impact sur le temps de chargement de votre site Web.

C’est parfois une meilleure idée de s’en tenir à une conception de site moins « lourde » et de réduire le nombre de plugins dont vous disposez, en particulier au-dessus du pli, pour le bien de votre LCP. Le rendu côté client (c’est-à-dire le rendu des pages Web directement dans le navigateur avec JavaScript) est une méthode de développement Web très populaire. Cependant, cela implique beaucoup de va-et-vient pour le navigateur pour collecter et charger le JavaScript avant de rendre le contenu principal et plus d’attendre votre utilisateur.

Si vous comptez également sur le rendu côté client, c’est peut-être quelque chose que vous voudrez peut-être examiner lorsque vous travaillez sur votre LCP. Les ressources volumineuses ou le contenu visuellement impactant sur une page prennent forcément beaucoup de temps à se charger – c’est juste une réalité. Si vous avez beaucoup d’images, de GIF et de zones de texte de haute qualité non optimisés à rendre au-dessus du pli, votre LCP sera affecté.

Lisez la suite pour en savoir plus sur l’optimisation de ces éléments pour améliorer votre LCP. Il existe quelques correctifs pour un LCP médiocre – dont certains sont plus faciles que d’autres. Nous allons vous présenter quelques-unes des plus simples ici.

Les fichiers CSS sont des ressources qui bloquent le rendu. Les ressources doivent être chargées et traitées avant que le serveur puisse rendre la page entière. Cependant, vous pouvez optimiser les fichiers CSS en supprimant manuellement le code inutilisé, en minimisant les fichiers CSS en cours d’utilisation ou en optimisant vos images d’arrière-plan CSS avec des requêtes multimédias.

Cela semble délicat, mais il existe de nombreuses ressources et tutoriels sur les métriques de vitesse centrées sur l’utilisateur qui peuvent vous aider ! Vous pouvez suivre quelques étapes lors de l’optimisation de vos images. Les principaux sont les suivants :

  • Compressez vos images
  • Pensez à convertir vos images dans des formats plus efficaces
  • Assurez-vous que vos images ont les bonnes dimensions
  • Et cela vaut toujours la peine de réfléchir : ai-je vraiment besoin de cette image ? Ajoute-t-il quelque chose à ma page ? Sinon, il vaudrait peut-être la peine de s’en débarrasser. Les polices sont souvent présentées dans de gros fichiers.

    Par conséquent, le contenu du texte dans une police inhabituelle n’apparaîtra pas sur une page tant que le fichier de police ne sera pas chargé. Il faudra plus de temps aux utilisateurs pour voir les informations essentielles sur une page Web ! Cela ne fonctionnera tout simplement pas. Pour éviter cela, vous souhaiterez optimiser vos polices Web.

    En réduisant la taille de votre WebFont, en utilisant l’affichage des polices ou en mettant à jour le style de votre page pour utiliser votre police personnalisée, le chargement de la page devrait s’accélérer. Vous écrivez votre JavaScript, obtenez toutes les informations dont vous avez besoin et vous êtes prêt à partir, n’est-ce pas ? Pas assez. Si votre JavaScript est resté en place depuis un certain temps, cela peut valoir la peine de le vérifier, car cela pourrait vous coûter la vitesse de chargement de la page.

    Voici quelques mesures à prendre pour optimiser votre JavaScript (compte tenu des dernières métriques LCP) :

  • suppression du code inutilisé
  • vérifier que votre code est à jour et compatible avec les navigateurs modernes
  • installation de JavaScript moderne et réduction des charges utiles grâce à la division de code
  • Alors, comment savoir ce qu’est votre LCP ? Un bon point de départ pour vérifier les performances de votre LCP est d’utiliser les outils fournis par Google : la Google Search Console, Google Page Insights et Lighthouse. Vous trouverez un onglet pour Core Web Vitals dans la barre de navigation de gauche de la Google Search Console. Entrer dans cet onglet vous montrera un aperçu de vos URL.

    À partir de là, il est assez facile de voir où se trouvent les problèmes et quels ajustements vous pouvez apporter pour les résoudre. Si vous n’avez pas configuré de console de recherche Google pour votre site Web, ne vous inquiétez pas. Vous pouvez également accéder à ces informations via les outils Lighthouse et PageSpeed ​​Insights.

    Si vous êtes nouveau sur PageSpeed ​​Insights, vous pouvez trouver une explication complète de l’utilisation de cet outil Google sur notre blog. Voici la présentation de Page Insights pour le site de bureau Amazon. Il nous montre tous les Core Web Vitals en un coup d’œil : comme vous pouvez le voir, le plus grand contenu de peinture se porte plutôt bien, mais il y a toujours place à l’amélioration.

    Rendez-vous dans la section Opportunités, explorez toutes les recommandations et saisissez toutes ces chances d’obtenir des classements encore meilleurs. Il est judicieux de suivre ces recommandations à temps pour appliquer la mise à jour Core Web Vitals de Google. Enregistrez-vous fréquemment pour assurer l’amélioration constante de votre LCP et des autres métriques du site et de la situation générale du référencement.

    Vous vous êtes donc enregistré sur votre LCP et vous avez identifié des problèmes. Vous devez maintenant travailler à les réparer, puis répéter tout le processus dans une semaine ou deux. L’entretien constant de votre référencement pour maintenir le LCP de votre site Web à jour peut rapidement devenir fatigant.

    La bonne nouvelle est que nous savons exactement comment vous pouvez rendre ce processus plus efficace : l’outil Audit de site. Testez la vitesse de votre site Web avec l’outil et générez une liste de toutes les améliorations et problèmes possibles – tout comme PageSpeed ​​Insights mais en mieux. L’outil d’audit de site recherchera également les erreurs techniques de référencement pour vous fournir des graphiques et des tableaux faciles à lire expliquant tous les problèmes et les correctifs.

    L’outil peut vous aider à combler vos lacunes Core Web Vitals en évaluant votre URL et en analysant son contenu tout en vous tenant constamment au courant des performances de votre LCP. Une fois que vous avez configuré l’audit de votre site, il vous suffit de cliquer sur « Afficher les détails  » sous « Core Web Vitals  » : vous pouvez trouver vos résultats LCP dans le graphique de gauche : vous savez maintenant comment conserver vos performances LCP à jour et où aller pour repérer les points d’amélioration. Si vous travaillez régulièrement sur chaque recommandation de l’audit de site, votre LCP et Core Web Vitals sont en passe de s’améliorer.

    et vous êtes obligé d’améliorer vos performances de vitesse Web en un rien de temps. Vous vous sentez encore un peu incertain ? Pour plus d’informations sur l’utilisation de Site Audit pour la vitesse des pages en général.

    La plus grande peinture et les vitaux Web de base avec contenu

    S’abonner
    Notifier de
    guest
    0 Commentaires
    Inline Feedbacks
    View all comments