Les Core Web Vitals 2026 : les métriques qui comptent pour Google
Depuis la mise à jour de l'expérience de page de Google (Page Experience Update), les Core Web Vitals sont un facteur de classement officiel. En 2026, Google mesure trois signaux principaux :
| Métrique | Bon | À améliorer | Mauvais |
|---|---|---|---|
| LCP (chargement) | < 2,5 s | 2,5 – 4 s | > 4 s |
| INP (interactivité) | < 200 ms | 200 – 500 ms | > 500 ms |
| CLS (stabilité visuelle) | < 0,1 | 0,1 – 0,25 | > 0,25 |
L'impact financier de la lenteur : les vrais chiffres
La corrélation entre vitesse et conversion est documentée depuis plus de 10 ans, mais les chiffres de 2026 sont plus brutaux que jamais, portés par l'impatience croissante des utilisateurs mobiles :
- +1 seconde de LCP = −7 % de taux de conversion en e-commerce (Google/Deloitte, 2026)
- LCP > 3 s = 53 % des utilisateurs mobiles abandonnent la page (Google, données Chrome)
- CLS > 0,25 = −15 % de clics sur les CTA (les boutons bougent avant que l'utilisateur clique)
- INP > 500 ms = −23 % de taux de complétion des formulaires
Traduit en euros : pour un site e-commerce générant 80 000 € de CA mensuel avec un LCP à 4,2 secondes, passer à 1,8 seconde représente une augmentation potentielle de 22 à 30 % du CA, soit 17 600 à 24 000 € supplémentaires par mois.
Les 8 optimisations de vitesse à impact immédiat
1. Passer les images en WebP/AVIF avec dimensionnement correct
Les images représentent en moyenne 55 % du poids d'une page. Une image JPEG de 800 Ko peut peser 120 Ko en WebP et 80 Ko en AVIF avec la même qualité visuelle. De plus, servir une image 2 400 px de large sur un écran mobile de 390 px de large transfère 6 fois plus de données que nécessaire.
Action : Convertissez toutes les images en WebP/AVIF et implémentez des images responsives avec l'attribut srcset. Sur WordPress, les plugins Imagify ou ShortPixel le font automatiquement. Sur un site custom (Next.js, Nuxt), le composant Image natif gère cela nativement.
2. Éliminer les scripts tiers bloquants
Chaque script tiers (analytics, chat, réseaux sociaux, publicité) est une requête externe qui peut bloquer le rendu. Un site moyen charge 8 à 12 scripts tiers. Google Tag Manager mal configuré peut ajouter 1 à 2 secondes de LCP à lui seul.
Action : Chargez tous les scripts non-critiques en defer ou async. Remplacez Google Analytics UA/GA4 par un outil léger comme Plausible ou Matomo (< 1 Ko vs 45 Ko pour GA4). Supprimez les scripts que vous n'utilisez plus.
3. Implémenter un cache full-page efficace
Pour un site CMS (WordPress, Drupal, Joomla), chaque visite peut déclencher des dizaines de requêtes SQL et du traitement PHP côté serveur. Un cache full-page stocke la page HTML générée et la sert directement sans aucun traitement.
Pour WordPress : WP Rocket (payant, simple) ou LiteSpeed Cache (gratuit, puissant sur hébergement LiteSpeed). Pour Next.js : le rendu statique (SSG) ou le Incremental Static Regeneration (ISR) sont intégrés nativement. Pour les sites custom, Nginx peut servir de cache de niveau proxy.
4. Précharger le LCP element
Le LCP (Largest Contentful Paint) est généralement la première image visible au-dessus de la ligne de flottaison. Ajouter un <link rel="preload"> pour cet élément dans le <head> permet au navigateur de le télécharger en priorité avant même d'avoir parsé le CSS.
5. Optimiser la livraison du CSS critique
Le navigateur ne peut pas afficher quoi que ce soit avant d'avoir chargé et parsé tout le CSS. L'astuce est d'extraire le CSS nécessaire pour le rendu initial (above the fold) et de l'injecter directement dans le <head> en inline — le reste du CSS est chargé de manière asynchrone.
6. Activer HTTP/3 et la compression Brotli
HTTP/3 réduit la latence de connexion de 30 à 40 % par rapport à HTTP/2, particulièrement sur mobile avec des réseaux instables. Brotli compresse les fichiers texte (HTML, CSS, JS) 20 à 30 % mieux que gzip. Ces deux optimisations sont souvent activables en un clic dans votre hébergeur.
7. Utiliser un CDN avec PoP en France
Un CDN (Content Delivery Network) sert vos fichiers statiques depuis le serveur le plus proche de l'utilisateur. Pour une audience française, privilégiez un CDN avec des PoP (Points of Presence) à Paris, Lyon et Marseille. Cloudflare (gratuit), Bunny.net (excellent rapport qualité-prix) et Fastly sont les références.
8. Supprimer les plugins et extensions inutiles
Sur un WordPress moyen, 30 à 40 % des plugins actifs ne sont plus utilisés mais continuent à charger des scripts CSS et JS sur chaque page. Un audit simple avec Query Monitor révèle l'impact de chaque plugin sur le temps de chargement.
Par où commencer : la checklist de diagnostic
Avant de commencer toute optimisation, établissez un baseline avec ces trois outils gratuits :
- Google PageSpeed Insights : score officiel Google, données réelles Chrome UX Report
- WebPageTest.org : waterfall complet, diagnostic par requête
- Chrome DevTools Coverage : pourcentage de CSS et JS inutilisé sur chaque page
Notez votre LCP, INP et CLS de départ. C'est votre baseline. Après chaque optimisation, mesurez à nouveau. Ne combinez pas plusieurs optimisations simultanément si vous voulez comprendre ce qui a eu le plus d'impact.