Core Web Vitals : les métriques qui comptent pour Google
Depuis 2021, Google utilise les Core Web Vitals comme facteur de classement. Ces 3 métriques mesurent l’expérience utilisateur réelle de votre site.
Les 3 métriques essentielles
| Métrique | Mesure | Bon | Mauvais |
|---|---|---|---|
| LCP Largest Contentful Paint |
Temps d’affichage du plus grand élément visible | ≤ 2.5s | > 4s |
| INP Interaction to Next Paint |
Réactivité aux interactions utilisateur | ≤ 200ms | > 500ms |
| CLS Cumulative Layout Shift |
Stabilité visuelle (éléments qui bougent) | ≤ 0.1 | > 0.25 |
Comment mesurer vos Core Web Vitals
Données de terrain (utilisateurs réels)
- Google Search Console → Expérience → Signaux Web essentiels
- PageSpeed Insights → section « Données de terrain »
- Chrome UX Report (CrUX) via BigQuery
Données de laboratoire (tests simulés)
- PageSpeed Insights → section « Données de labo »
- Chrome DevTools → onglet Performance
- Lighthouse (intégré à Chrome)
💡 Important
Google utilise les données de terrain (utilisateurs réels) pour le classement, pas les données de laboratoire. Les deux peuvent différer significativement, surtout en Afrique où les connexions sont plus variables.
Améliorer le LCP (Largest Contentful Paint)
Le LCP mesure le temps d’affichage de votre plus grand élément visible (souvent une image hero ou un titre).
Solutions par ordre de priorité
- Optimiser l’image principale
<img src= »hero.webp » width= »1200″ height= »600″
fetchpriority= »high » decoding= »async »
alt= »Description » />
- Utiliser un CDN — Cloudflare gratuit avec serveurs en Afrique
- Précharger les ressources critiques
<link rel= »preload » href= »hero.webp » as= »image » />
<link rel= »preconnect » href= »https://fonts.googleapis.com » />
- Réduire le TTFB — cache serveur, mise à niveau hébergement
Améliorer le INP (Interaction to Next Paint)
Le INP remplace le FID depuis mars 2024. Il mesure la réactivité de votre site aux clics, taps et saisies clavier.
- Réduire le JavaScript bloquant — différez les scripts non essentiels avec
deferouasync - Diviser les longues tâches — aucune tâche JS ne devrait bloquer le thread principal plus de 50ms
- Supprimer le JS inutile — désactivez les plugins WordPress non essentiels
- Utilisez le lazy loading pour les widgets et éléments interactifs hors écran
Améliorer le CLS (Cumulative Layout Shift)
Le CLS mesure la stabilité visuelle. Avez-vous déjà cliqué sur un bouton et, au moment du clic, la page a bougé et vous avez cliqué ailleurs ? C’est un mauvais CLS.
Causes courantes et solutions
| Cause | Solution |
|---|---|
| Images sans dimensions | Toujours spécifier width et height |
| Publicités/embeds dynamiques | Réserver l’espace avec un conteneur de taille fixe |
| Polices web (FOUT/FOIT) | font-display: swap + preload des polices |
| Contenu injecté dynamiquement | Réserver l’espace avant le chargement |
Checklist WordPress pour les Core Web Vitals
🎯 Exercice : Améliorez vos scores
- Testez votre page d’accueil sur PageSpeed Insights
- Notez vos scores LCP, INP et CLS actuels
- Installez WP Rocket ou LiteSpeed Cache
- Convertissez vos images en WebP avec ShortPixel
- Ajoutez width/height à toutes les images
- Désactivez les plugins inutilisés
- Retestez et comparez les scores
