Core Web Vitals : réussir LCP, INP et CLS
Les Core Web Vitals sont trois mesures qui montrent ce que vivent réellement vos visiteurs : la vitesse d'affichage du contenu principal, la réactivité aux interactions et la stabilité de la mise en page. Elles ne remplacent pas un bon contenu, mais indiquent si un site est agréable à utiliser.
À retenir
- LCP mesure le chargement, INP la réactivité et CLS la stabilité visuelle.
- Seuils « bons », au 75e centile des visites : LCP ≤ 2,5 s, INP ≤ 200 ms et CLS ≤ 0,1.
- Décidez avec les données terrain (Search Console, PageSpeed Insights) et diagnostiquez avec les données de laboratoire.
- Corrigez par modèle de page et surveillez chaque mois : refontes et extensions provoquent des régressions.
Ce que sont les Core Web Vitals
- LCP (Largest Contentful Paint) : délai d'affichage du plus grand élément visible, souvent l'image principale ou un bloc de texte.
- INP (Interaction to Next Paint) : rapidité avec laquelle la page réagit visuellement aux touches, clics et frappes, mesurée sur toute la visite. L'INP a remplacé le FID comme Core Web Vital en 2024.
- CLS (Cumulative Layout Shift) : ampleur des déplacements inattendus du contenu visible.
Ils comptent parce que l'internaute les ressent : une image principale lente, un bouton qui ne réagit pas ou une page qui bouge font fuir les visiteurs.
Les seuils
| Mesure | Bon | À améliorer | Mauvais |
|---|---|---|---|
| LCP | jusqu'à 2,5 secondes | 2,5 à 4 s | plus de 4 s |
| INP | jusqu'à 200 ms | 200 à 500 ms | plus de 500 ms |
| CLS | jusqu'à 0,1 | 0,1 à 0,25 | plus de 0,25 |
Faites glisser le tableau latéralement pour voir toutes les colonnes.
L'évaluation se fait au 75e centile des chargements : au moins trois visites sur quatre doivent atteindre le seuil. Les seuils sont identiques sur mobile et ordinateur, mais les résultats sont généralement moins bons sur mobile.
Données terrain et données de laboratoire
- Terrain : issues de vrais visiteurs dans la durée (rapport Core Web Vitals de la Search Console, section terrain de PageSpeed Insights). Elles montrent s'il y a un problème et sur quelles pages.
- Laboratoire : test simulé sur un appareil et un réseau (par exemple Lighthouse). Il aide à comprendre pourquoi, car on peut le reproduire.
Un excellent score de laboratoire ne garantit pas de bonnes données terrain. Décidez avec le terrain, diagnostiquez avec le laboratoire.
Comment mesurer, étape par étape
- Ouvrez le rapport Core Web Vitals de la Search Console et repérez les groupes d'URL à problème sur mobile.
- Choisissez une URL représentative par groupe et testez-la dans PageSpeed Insights.
- Utilisez les outils de développement du navigateur (onglet Performances) pour trouver éléments lents, tâches longues et décalages de mise en page.
- Corrigez la cause dans le modèle de page : la même erreur touche en général tout le groupe.
- Patientez : les données terrain se collectent sur une fenêtre glissante, la confirmation prend des semaines.
Améliorer le LCP
- Identifiez l'élément LCP (souvent l'image du haut) et optimisez-le en premier.
- Accélérez le serveur : cache, CDN, hébergement adapté. Les pages statiques aident beaucoup.
- Allégez l'image principale : compression, taille réellement affichée, formats modernes comme WebP ou AVIF.
- Pas de chargement différé pour l'image principale : il est destiné aux images sous la ligne de flottaison ; donnez-lui une priorité haute.
- Réduisez les ressources bloquantes : CSS critique, scripts différés, polices légères.
Améliorer l'INP
- Découpez les tâches longues pour que le navigateur puisse réagir entre deux étapes.
- Réduisez et différez le JavaScript : supprimez les bibliothèques inutiles, chargez le non critique plus tard.
- Auditez les scripts tiers : chat, balises, cartes de chaleur et publicités coûtent souvent le plus. Chargez-les seulement où nécessaire et après consentement.
- Gardez une structure légère : des milliers d'éléments ralentissent chaque interaction.
- Donnez un retour immédiat (état du bouton) puis faites le travail lourd ensuite.
Améliorer le CLS
- Définissez largeur et hauteur (ou aspect-ratio) pour images, vidéos et intégrations.
- Réservez l'espace des publicités, bannières et avis de cookies au lieu de les insérer au-dessus d'un contenu déjà visible.
- Soignez les polices : stratégie font-display et police de secours de métriques proches.
- N'insérez pas de contenu au-dessus de ce que la personne lit, sauf après une action de sa part.
- Animez avec transform et opacity, pas avec des propriétés qui modifient la mise en page.
Corrections selon le symptôme
| Symptôme | Cause probable | Correction |
|---|---|---|
| LCP lent sur mobile | Image lourde, serveur lent | Compresser, cache, CDN |
| Menu ou filtre qui répond mal | Beaucoup de JavaScript, scripts tiers | Différer les scripts, découper les tâches |
| La page saute au chargement des images | Dimensions manquantes | Définir largeur et hauteur |
| La mise en page bouge en haut | Bannière ou avis de cookies tardifs | Réserver l'espace |
| Bon score labo, mauvais terrain | Vrais utilisateurs avec appareils plus lents | Tester avec réseau bridé, alléger |
Faites glisser le tableau latéralement pour voir toutes les colonnes.
Prendre du recul et surveiller
Les Core Web Vitals font partie de l'expérience de page, mais un contenu pertinent et utile pèse bien davantage. Intégrez-les à un audit SEO régulier et vérifiez-les chaque mois et après toute refonte, extension ou nouvelle balise.
Besoin d'aide pour appliquer ces conseils ? Parlez avec l'équipe MetaEX.
Questions fréquentes
Les Core Web Vitals sont-ils un facteur de classement ?
Ils font partie de l'expérience de page, que Google prend en compte, mais la pertinence et l'utilité du contenu comptent bien davantage. Une expérience très mauvaise nuit toutefois aux utilisateurs et aux conversions.
Pourquoi mon score labo diffère-t-il de la Search Console ?
Le laboratoire simule un appareil et un réseau à un instant donné ; la Search Console montre de vrais visiteurs dans la durée. Décidez avec le terrain, diagnostiquez avec le laboratoire.
Quand les améliorations apparaissent-elles dans les rapports ?
Les données terrain sont collectées sur une fenêtre glissante : comptez plusieurs semaines après une correction.
Les seuils diffèrent-ils entre mobile et ordinateur ?
Non, ils sont identiques, mais le mobile est souvent moins bon. Priorisez le mobile.
Que corriger en premier ?
Ce qui échoue dans les données terrain sur les modèles les plus visités, en général le LCP d'abord, puis INP et CLS.
Sources
Souhaitez-vous une évaluation de votre activité digitale ?
Parlez-nous : nous comprenons d'abord votre situation, puis nous vous disons ce qui a du sens.
Prendre rendez-vous