Core Web Vitals en 2026 : la checklist concrète pour passer au vert

Depuis mars 2024, l'INP a remplacé le FID dans les Core Web Vitals. Ça change concrètement ce sur quoi vous devez travailler. Voici la check 2026, avec ce qui marche vraiment et ce qui ne sert à rien.

Un rappel pour ceux qui découvrent le sujet : les Core Web Vitals sont trois notes que Google attribue à votre site pour mesurer l'expérience réelle de vos visiteurs (vitesse d'affichage, réactivité au clic, stabilité visuelle). Elles comptent dans le classement de Google et, surtout, elles décident si un visiteur reste ou repart. Point important : Google ne juge pas un test isolé, mais les données réelles de vos visiteurs, au 75e centile. Autrement dit, votre site doit être bon pour au moins trois utilisateurs sur quatre.

Les 3 métriques qui comptent en 2026

• LCP (Largest Contentful Paint) : le plus gros élément visible doit s'afficher en moins de 2,5 secondes.
• INP (Interaction to Next Paint) : votre site doit répondre en moins de 200 ms à une interaction.
• CLS (Cumulative Layout Shift) : la mise en page ne doit pas sauter pendant le chargement (score sous 0,1).

Ces trois seuils (2,5 s, 200 ms, 0,1) ne sont pas arbitraires. Ils correspondent aux valeurs que Google considère comme « bonnes » et qu'il faut tenir sur au moins 75 % des visites réelles pour valider une page. Le détail de la méthode est documenté par web.dev, l'équipe de Google dédiée à la performance web.

Améliorer le LCP

1. 01Identifiez l'élément LCP avec PageSpeed Insights : c'est presque toujours une image hero ou un titre H1.
2. 02Si c'est une image : preload, format AVIF ou WebP, taille adaptée au viewport, attribute fetchpriority="high".
3. 03Si c'est un titre : assurez-vous que la police est preloaded, sinon le texte attend la police avant de s'afficher.
4. 04Supprimez les CSS bloquants au-dessus de la ligne de flottaison. Inlinez le critical CSS.
5. 05Hébergez vos polices en local plutôt que de les charger depuis Google Fonts.

Améliorer l'INP

L'INP mesure la réactivité de votre site. Si vous avez beaucoup de JavaScript qui s'exécute au chargement, votre site n'est pas réactif. Voici les leviers principaux :

• Code-splittez votre JavaScript. Avec Next.js, c'est natif par route.
• Différez les scripts tiers (analytics, chat, pixel) avec defer ou async.
• Utilisez des Web Workers pour les calculs lourds.
• Évitez les listeners trop coûteux sur scroll ou resize : debouncez et throttlez.
• Limitez les re-renders React inutiles (memo, useCallback bien placés).

Améliorer le CLS

1. 01Réservez l'espace de toutes les images avec width et height (ou aspect-ratio).
2. 02Évitez d'injecter du contenu dynamique au-dessus du contenu existant (bannières, popups, cookies).
3. 03Pour les fonts : utilisez font-display: swap avec un fallback similaire en métrique.
4. 04Pour les iframes (vidéo, carte) : fixez une hauteur explicite.
5. 05Pour les ads : réservez la slot avec sa taille définitive.

L'outil unique à utiliser

PageSpeed Insights donne les Core Web Vitals à un instant T. Mais ce qui compte pour Google, ce sont les données « réelles » collectées par Chrome User Experience Report (CrUX). Connectez-vous à Search Console > Core Web Vitals pour voir ce que Google mesure vraiment sur vos pages.

Le mythe à enterrer

« 100/100 sur PageSpeed » n'est pas le but. Ce qui compte, c'est de passer au vert sur les 3 métriques en données réelles. Un site à 85/100 mais avec un LCP réel à 1,8s rankera mieux qu'un site à 95/100 avec un LCP réel à 3,2s.

Pour aller plus loin

Pour creuser le sujet à la source, sans passer par des articles de seconde main :

• Google Search Central : Core Web Vitals : la documentation officielle sur ce que Google mesure et pourquoi.
• web.dev : Comment les seuils ont été définis : la méthode derrière les 2,5 s, 200 ms et 0,1.
• Google : Introducing INP to Core Web Vitals : l'annonce officielle du remplacement du FID par l'INP.