expert
Depuis mars 2024, l'INP a remplacé le FID dans les Core Web Vitals. En 2026, ces trois métriques restent un signal de classement direct, et surtout un multiplicateur de conversion. Voici comment nous auditons et corrigeons la performance chez nos clients Growth.
1. Les seuils officiels 2026
Google publie trois paliers : Good, Needs improvement, Poor. Le 75e percentile de vos utilisateurs mobiles doit se situer dans "Good" pour que l'URL soit considérée comme performante.
| Métrique | Nom complet | Bon (≤) | Mauvais (>) | Impact SEO |
|---|---|---|---|---|
| LCP | Largest Contentful Paint | 2.5s | 4s | Élevé |
| INP | Interaction to Next Paint | 0.2s | 0.5s | Élevé |
| CLS | Cumulative Layout Shift | 0.1 | 0.25 | Moyen |
| TTFB | Time to First Byte | 0.8s | 1.8s | Support |
| FCP | First Contentful Paint | 1.8s | 3s | Support |
2. Impact réel sur les positions
Les Core Web Vitals ne créent pas de position magique, mais ils déterminent qui gagne un duel entre deux pages sémantiquement équivalentes. Sur des SERPs KDI 40+, un LCP à 1,8s bat systématiquement un concurrent à 3,5s à contenu comparable.
3. Auditer en 15 minutes
Trois outils, dans l'ordre : PageSpeed Insights (données terrain CrUX), Search Console → Signaux Web essentiels (vision globale du site), Chrome DevTools → Performance (répliquer et disséquer). Voyez la référence officielle sur web.dev/vitals.
4. Optimiser le LCP
90 % des LCP dégradés viennent de la même chose : l'image hero. Servez-la en AVIF ou WebP, ajoutez fetchpriority="high", préchargez via <link rel="preload">, retirez toute la JS non critique du <head>. Pour un site WordPress, désactivez les plugins qui injectent 400 ko de CSS en head.
5. Corriger l'INP
L'INP mesure la réactivité aux interactions. Coupables typiques : trackers tiers, scripts de chat, hydratation React massive. Solutions : différer les tags via Partytown, découper le JS en chunks route-scopés, utiliser useTransition sur les setState coûteux.
6. Éliminer le CLS
Toujours déclarer width et height sur images et iframes. Réserver de l'espace pour les bannières cookies, ads et embeds sociaux. Un CLS à 0 se fait en une après-midi sur la majorité des sites.
7. Stack technique recommandé 2026
Next.js/TanStack sur Vercel ou Cloudflare Workers. TTFB < 100 ms en France.
AVIF prioritaire, fallback WebP, `srcset` responsive, `fetchpriority='high'` sur le hero.
GTM, Meta Pixel, HubSpot déportés dans un worker : INP divisé par 3.
WOFF2 en /public, `font-display: swap`, preload uniquement des poids critiques.
Interactions coûteuses (filtres, tri) passent en tâches concurrentes, INP au vert.
Dashboard temps réel des CWV terrain, alertes Slack sur régression > 5%.
8. La chirurgie LCP — étape par étape
- Étape 1Identifier l'élément LCP
Chrome DevTools → Performance → Largest Contentful Paint. Dans 87% des cas c'est l'image hero, dans 10% un H1 mal chargé (police custom), dans 3% une vidéo.
- Étape 2Éliminer le blocage réseau
Preload l'image LCP, retirer les `@import` CSS synchrones, différer toute JS non critique. Cible : LCP < 1.5s sur 4G rapide.
- Étape 3Optimiser le poids réel
Convertir en AVIF (gain 40% vs WebP), servir à la taille exacte via CDN d'images (Cloudflare Images, Bunny Optimizer).
- Étape 4Mesurer sur terrain, pas en labo
PageSpeed CrUX 28 jours. Un LCP labo à 3.2s peut cacher un LCP terrain à 1.8s (bonne surprise) ou 4.5s (drame).
9. Bonnes vs mauvaises pratiques CWV
- ✓Preload l'image LCP + les fonts critiques uniquement.
- ✓Découpage JS route-scopé (dynamic imports).
- ✓Lazy-load tout ce qui est sous la ligne de flottaison.
- ✓Réserver l'espace des embeds, bannières et ads.
- ✓Monitorer terrain chaque semaine, pas trimestriellement.
- ✕Charger 8 polices Google Fonts en synchrone.
- ✕Installer un plugin de « cache magique » et considérer que c'est fait.
- ✕Compresser à l'aveugle sans regarder le CrUX.
- ✕Empiler des sliders, popups et vidéos autoplay au-dessus du fold.
- ✕Optimiser Lighthouse à 100 sans vérifier l'INP terrain.
10. FAQ Core Web Vitals
Les CWV sont-ils un facteur de ranking direct ?+
Oui, depuis juin 2021 (Page Experience Update) et renforcé en 2024. L'impact est modéré (~5-8% du poids) mais devient discriminant en zone concurrentielle : à contenu égal, le site le plus rapide gagne.
Différence entre données labo (Lighthouse) et terrain (CrUX) ?+
Lighthouse simule un CPU 4× ralenti, une seule fois. CrUX agrège les vraies visites de vos utilisateurs Chrome sur 28 jours. Google ne classe QUE sur CrUX. Un Lighthouse à 40 avec un CrUX vert n'est pas un problème.
Comment savoir si mon site est en zone verte ?+
PageSpeed Insights affiche « Assessment: Passed » quand LCP < 2.5s, INP < 200ms, CLS < 0.1 sur le 75e percentile. Vous pouvez aussi interroger l'API CrUX directement.
Faut-il migrer vers Next.js pour être rapide ?+
Non — Astro, TanStack Start, SvelteKit, Nuxt sont excellents. Le vrai levier n'est pas le framework mais le SSR au edge et la discipline de bundle. WordPress bien optimisé (Kinsta + WP Rocket + Cloudflare) passe en zone verte.
L'INP remplace-t-il vraiment le FID ?+
Oui, depuis mars 2024. L'INP est bien plus strict : il mesure toutes les interactions, pas seulement la première. Beaucoup de sites verts en FID sont passés rouges en INP.
Prêt à passer au vert sur les CWV ? Réservez un audit ou explorez notre expertise SEO technique.