Core Web Vitals : pourquoi la vitesse de votre site impacte directement vos ventes

Google l'a rendu officiel en 2021 : la vitesse de votre site est un critère de classement. Mais au-delà du SEO, c'est surtout vos ventes qui en souffrent quand votre site est lent.

Chez QNT, quand on a réduit le temps de chargement de 4,2 à 1,8 secondes, le taux de conversion a augmenté de 18%. Ce n'est pas un cas isolé.

Les 3 métriques qui comptent

LCP : Largest Contentful Paint

C'est le temps que met l'élément principal de votre page à s'afficher. Pour une fiche produit, c'est souvent l'image du produit. Pour une page d'accueil, c'est la bannière hero.

• Bon : moins de 2,5 secondes
• A améliorer : entre 2,5 et 4 secondes
• Mauvais : plus de 4 secondes

Sur les sites que j'audite, le LCP moyen est de 3,8 secondes. La cause numéro 1 ? Des images non optimisées.

Comment l'améliorer :

• Convertir les images en WebP ou AVIF (gain de 25 à 50% sur le poids)
• Utiliser le lazy loading pour les images sous le fold
• Précharger l'image hero avec <link rel="preload">
• Réduire les CSS et JS qui bloquent le rendu
• Utiliser un CDN (Cloudflare, Vercel Edge)

INP : Interaction to Next Paint

Depuis mars 2024, l'INP remplace le FID. Il mesure la réactivité de votre site : quand un visiteur clique sur un bouton, combien de temps avant que quelque chose se passe ?

• Bon : moins de 200 ms
• A améliorer : entre 200 et 500 ms
• Mauvais : plus de 500 ms

Les sites lourds en JavaScript (React mal optimisé, trop de plugins, widgets tiers) souffrent le plus. J'ai vu des sites PrestaShop avec un INP de 800 ms à cause de modules mal codés.

Comment l'améliorer :

• Réduire le JavaScript tiers (chaque script de tracking ajoute du poids)
• Différer le chargement des scripts non critiques
• Éviter les longues tâches JavaScript (code splitting)
• Mettre à jour vos plugins et thèmes

CLS : Cumulative Layout Shift

Vous connaissez cette sensation quand vous êtes sur le point de cliquer et que la page "saute" ? C'est le CLS. Rien de pire pour l'expérience utilisateur.

• Bon : moins de 0,1
• A améliorer : entre 0,1 et 0,25
• Mauvais : plus de 0,25

Les causes fréquentes :

• Images sans dimensions (width/height) définies
• Polices web qui provoquent un flash (FOUT)
• Publicités ou bannières qui s'insèrent en retard
• Contenu dynamique qui pousse le reste de la page

Comment l'améliorer :

• Toujours spécifier width et height sur les images
• Utiliser font-display: swap ou le préchargement des polices
• Réserver l'espace pour les éléments chargés dynamiquement

L'impact concret sur vos ventes

Les chiffres sont parlants :

• Amazon a mesuré qu'une augmentation de 100 ms du temps de chargement fait baisser les ventes de 1%
• Walmart a constaté une hausse de 2% du taux de conversion pour chaque seconde gagnée
• Un site qui passe de 5 à 2 secondes de chargement peut voir ses conversions augmenter de 25 à 40%

Et ce n'est pas juste le e-commerce. Un site vitrine lent, c'est un prospect qui part chez le concurrent.

Le piège du score Lighthouse

Attention : un score Lighthouse de 100/100 ne garantit pas un site rapide en conditions réelles.

Lighthouse teste dans un environnement contrôlé. En conditions réelles, vos visiteurs sont sur un smartphone en 4G dans le métro, avec 15 onglets ouverts. Les Core Web Vitals "terrain" (mesurés par le Chrome User Experience Report) sont souvent 30 à 50% moins bons que les scores de lab.

C'est pour ça que mon audit mesure les deux : les scores Lighthouse ET les données terrain quand elles sont disponibles.

Les quick wins qui font la différence

Si vous deviez ne faire que 3 choses demain :

1. Compressez vos images : un outil comme Squoosh ou TinyPNG peut diviser leur poids par 3 en 2 minutes
2. Activez le lazy loading : un attribut loading="lazy" sur les images suffit
3. Supprimez les scripts inutiles : chaque script tiers que vous retirez améliore les 3 métriques

Comment mesurer vos Core Web Vitals

Les outils gratuits :

• Google PageSpeed Insights : scores de lab + données terrain
• Google Search Console : rapport Core Web Vitals avec l'état de toutes vos pages
• Chrome DevTools : onglet Performance pour un diagnostic précis

Pour un diagnostic complet qui va au-delà des Core Web Vitals (SEO, sécurité, UX, contenu), mon audit digital analyse plus de 50 critères et vous donne un plan d'action priorisé.