Core Web Vitals : LCP, INP, CLS

Qu'est-ce que les Core Web Vitals ?

Les Core Web Vitals sont trois métriques qui mesurent l'expérience utilisateur :

• LCP (Largest Contentful Paint) : Vitesse de chargement
• INP (Interaction to Next Paint) : Réactivité
• CLS (Cumulative Layout Shift) : Stabilité visuelle

LCP - Largest Contentful Paint

Le LCP mesure le temps de chargement du plus grand élément visible (image, bloc de texte, vidéo).

Seuils de performance

• Bon : ≤ 2,5 secondes
• À améliorer : 2,5 - 4 secondes
• Mauvais : > 4 secondes

Comment améliorer le LCP

• Optimiser les images (format WebP, compression, lazy loading)
• Utiliser un CDN pour les ressources statiques
• Précharger les ressources critiques (preload)
• Améliorer le temps de réponse serveur (TTFB)
• Éliminer le JavaScript bloquant le rendu

Voir aussi : Résoudre un LCP élevé sur WordPress

INP - Interaction to Next Paint

L'INP remplace le FID depuis mars 2024. Il mesure la latence de TOUTES les interactions utilisateur, pas seulement la première.

Seuils de performance

• Bon : ≤ 200 ms
• À améliorer : 200 - 500 ms
• Mauvais : > 500 ms

Comment améliorer l'INP

• Optimiser et réduire le JavaScript exécuté
• Décomposer les tâches longues (Long Tasks)
• Utiliser des Web Workers pour le code lourd
• Éviter les animations JavaScript coûteuses
• Optimiser les gestionnaires d'événements

Voir aussi : Résoudre un INP élevé en e-commerce

CLS - Cumulative Layout Shift

Le CLS mesure les décalages visuels inattendus pendant le chargement et l'utilisation de la page.

Seuils de performance

• Bon : ≤ 0,1
• À améliorer : 0,1 - 0,25
• Mauvais : > 0,25

Causes courantes de CLS

• Images sans dimensions spécifiées
• Publicités ou embeds sans espace réservé
• Polices web causant un FOIT/FOUT
• Contenu injecté dynamiquement (bandeaux, popups)

Comment améliorer le CLS

• Toujours spécifier width et height pour images et vidéos
• Réserver l'espace pour les publicités
• Utiliser font-display: swap avec fallback
• Éviter d'insérer du contenu au-dessus du contenu existant

Voir aussi : Résoudre un CLS élevé sur WordPress

Mesurer les Core Web Vitals

Données de terrain (Field Data)

• Search Console : Rapport Core Web Vitals
• PageSpeed Insights : Données CrUX (Chrome User Experience Report)
• web.dev/measure : Test en ligne

Données de laboratoire (Lab Data)

• Lighthouse : Intégré à Chrome DevTools
• WebPageTest : Tests avancés
• GTmetrix : Rapports détaillés

Impact SEO des Core Web Vitals

Les Core Web Vitals sont un facteur de classement depuis 2021 :

• Facteur parmi des centaines d'autres
• Plus important sur mobile que desktop
• Peut départager des pages à contenu équivalent
• Impact direct sur l'expérience utilisateur et les conversions

Voir aussi : Quel est l'impact d'un site lent sur le SEO ?