Core Web Vitals : quoi corriger en premier

1. Les trois indicateurs

• LCP (Largest Contentful Paint) — le temps avant l’affichage du plus grand élément visible. Bon sous 2,5 s.
• INP (Interaction to Next Paint) — le délai entre une action de l’utilisateur et la réponse visible. Bon sous 200 ms.
• CLS (Cumulative Layout Shift) — l’ampleur des déplacements d’éléments pendant le chargement. Bon sous 0,1.

Ces mesures sont un facteur de classement secondaire. Leur intérêt principal est ailleurs : sur mobile, chaque seconde d’attente coûte des visiteurs, et le taux d’abandon augmente fortement au-delà de trois secondes.

2. LCP : les causes réelles

Les images

Cause la plus fréquente. Une image de bannière servie en 3000 px de large et 1,8 Mo là où 1200 px et 120 Ko suffisent. Correctifs : formats modernes (WebP, AVIF), dimensions adaptées, attributs width et height renseignés, chargement différé pour tout ce qui est sous la ligne de flottaison — mais jamais pour l’image principale.

Le temps de réponse du serveur

Un hébergement mutualisé saturé ou une base de données non mise en cache ajoute une seconde avant même le premier octet. Mise en cache de pages, réseau de diffusion pour les fichiers statiques, et hébergement dimensionné au trafic réel.

Les ressources bloquantes

Feuilles de style volumineuses, scripts chargés en tête de page, polices web sans stratégie d’affichage. Chargez le style critique en priorité, différez le reste, et utilisez font-display pour éviter le texte invisible.

3. INP : la réactivité

L’INP mesure ce que ressent l’utilisateur quand il clique. Une mauvaise note vient presque toujours d’un excès de JavaScript exécuté sur le fil principal : gestionnaires de consentement, scripts de suivi, widgets de chat, carrousels et animations lourdes.

• Réduire le nombre de scripts tiers — chaque outil ajouté a un coût mesurable ; auditez ce qui est réellement utilisé.
• Découper les tâches longues — au-delà de 50 ms, une tâche bloque la réponse.
• Charger à la demande — le chat, la carte et le lecteur vidéo ne sont pas nécessaires au chargement initial.

4. CLS : la stabilité

Le contenu qui saute pendant la lecture est presque toujours dû à des éléments sans dimensions réservées.

• Images et vidéos — toujours renseigner width et height, ou une proportion en CSS.
• Bandeaux et bannières — réserver l’espace plutôt que pousser le contenu vers le bas.
• Polices — choisir une police de repli de métriques proches pour éviter le décalage au chargement.
• Injections tardives — toute insertion par script après le premier rendu est un risque.

5. Mesurer sur le terrain, pas en laboratoire

Un test synthétique donne un score sur une machine simulée. Les données de terrain, elles, proviennent de vos vrais visiteurs, sur leurs appareils et leurs réseaux. Ce sont celles que Google utilise.

Utilisez le rapport d’expérience utilisateur de la Search Console pour l’état réel, et un test synthétique uniquement pour diagnostiquer une page précise. Un écart important entre les deux signale un problème sur mobile ou sur connexion lente.

6. Ce qui rapporte vraiment

Sur la majorité des sites d’entreprise, trois interventions produisent l’essentiel du gain : compresser et redimensionner les images, retirer les scripts tiers non utilisés, activer une mise en cache correcte. Le reste relève de l’optimisation fine.

Et un rappel de proportion : passer de 8 s à 2,5 s change le comportement des visiteurs. Passer de 2,3 s à 1,9 s change un score. Arbitrez en fonction du chiffre d’affaires, pas de la couleur du témoin.

7. Questions fréquentes