Qu’est-ce que l’optimisation d’images pour un site web ?
Optimiser une image, c’est réduire son poids (sa taille en kilo-octets) sans dégrader ce que l’œil perçoit à l’écran. Une photo de 5 Mo peut descendre à 150 Ko sans qu’un visiteur lambda voie la différence, mais votre site chargera 30 fois plus vite.
Cette optimisation repose sur trois actions principales : choisir le bon format de fichier (JPEG, PNG, WebP, AVIF), compresser l’image pour supprimer les données inutiles, et la redimensionner aux dimensions réelles d’affichage sur votre site.
Pourquoi optimiser les images améliore votre référencement Google
La vitesse impacte directement vos ventes
40% des visiteurs quittent un site qui met plus de 3 secondes à charger. Chaque seconde supplémentaire de chargement augmente votre taux de rebond de 32% et fait chuter vos conversions de 7% en moyenne. Des images lourdes ralentissent votre site et font perdre des clients qui partent avant même d’avoir vu vos offres.
Google pénalise les sites lents
Depuis 2021, la vitesse de chargement est un critère officiel de classement dans les résultats de recherche. Google mesure notamment le LCP (Largest Contentful Paint), qui calcule le temps nécessaire pour afficher le plus gros élément de la page, souvent une image. Un LCP supérieur à 2,5 secondes dégrade votre positionnement, même avec un excellent contenu.
Les gains sont mesurables immédiatement
Un site qui passe ses images au format WebP gagne 25 à 35% de réduction de poids, et jusqu’à 30 à 50% supplémentaires avec AVIF. Des tests réels montrent qu’une page e-commerce passant de 7,2 secondes à 1,8 secondes de LCP voit son taux de rebond chuter de 68% à 32%, avec une hausse de conversions de +24% sur mobile.
Les meilleures techniques pour optimiser vos images WordPress
Les formats d’images : WebP et AVIF surpassent JPEG et PNG
Le JPEG et le PNG datent des années 1990. Deux formats modernes les remplacent efficacement :
- WebP : développé par Google, compatible avec 95% des navigateurs, réduit le poids de 25 à 35% par rapport au JPEG sans perte de qualité visible
- AVIF : encore plus performant (30 à 50% plus léger que WebP), mais plus lent à générer et légèrement moins compatible
WordPress gère nativement ces formats depuis la version 5.8 (2021), mais beaucoup de sites continuent à uploader des JPEG par habitude.
La compression : réduire le poids sans dégrader la qualité
Compresser une image supprime les données que l’œil humain ne capte pas. Des outils gratuits comme TinyPNG ou Squoosh (Google) traitent vos fichiers en quelques secondes. Sur WordPress, des plugins comme ShortPixel, Imagify ou WP-Optimize compressent automatiquement chaque image uploadée.
Tests comparatifs sur des images JPEG : ShortPixel réduit le poids de 54%, TinyPNG de 45%, EWWW Image Optimizer de 44%, sans dégradation visible. Une image qui pesait 2,5 Mo descend ainsi à 300-400 Ko.
Le redimensionnement : adapter la taille au besoin réel
Si votre image s’affiche en 800 pixels de large sur la page, uploader un fichier de 4000 pixels fait perdre de la bande passante inutilement. Chaque pixel superflu ralentit le chargement.
Comment trouver la bonne taille pour vos images :
- Sur Firefox : tapez
about:configdans la barre d’adresse -> cliquez sur “Accepter le risque et poursuivre” -> dans la barre de recherche, tapezbrowser.menu.showViewImageInfo-> cliquez sur l’icône bascule pour passer la valeur àtrue. Ensuite, clic droit sur l’image -> “Informations sur l’image”. Vous verrez deux dimensions : utilisez la seconde valeur (après “redimensionné à”). Exemple : si Firefox affiche “113px × 98px (redimensionné à 412px × 356px)”, votre image doit faire 412 × 356 pixels maximum. C’est la taille réellement affichée à l’écran - Sur Chrome (plus simple) : installez l’extension gratuite Image Size Info depuis le Chrome Web Store. Faites un clic droit sur n’importe quelle image -> View info : l’extension affiche directement les dimensions d’affichage (Displayed) et la taille du fichier source. Prenez la valeur “Displayed”
- Méthode universelle (tous navigateurs) : clic droit sur l’image -> “Inspecter” ou “Inspecter l’élément”. Le code HTML s’ouvre en bas de l’écran. Survolez la balise
<img>surlignée : un pop-up apparaît au-dessus de l’image avec les dimensions affichées (ex: “800 × 600”). C’est cette valeur qu’il faut retenir
Tailles recommandées par type d’usage :
- Image pleine largeur : 1920-2048 pixels de large maximum
- Photo dans un article de blog : 800-1200 pixels de large
- Logo ou petite icône : 200-400 pixels de large
WordPress crée automatiquement plusieurs versions de chaque image (miniature, moyenne, grande), mais si vous partez d’un fichier de 5000 pixels alors que votre site affiche 900 pixels, vous gaspillez de la bande passante.
Le lazy loading : charger les images uniquement quand nécessaire
Cette technique charge les images seulement quand le visiteur scrolle jusqu’à elles. Au lieu de télécharger toutes les images de la page d’un coup, le navigateur charge d’abord celles visibles à l’écran, puis le reste au fur et à mesure.
Sur WordPress, ajoutez l’attribut loading="lazy" à vos balises images, ou utilisez un plugin. Votre page d’accueil chargera 3 à 5 fois moins de données au premier affichage. Attention : ne mettez jamais de lazy loading sur l’image principale (LCP), cela ralentirait son chargement.
Optimiser vos images en 5 étapes
Auditez vos images actuelles : utilisez Google PageSpeed Insights (gratuit) pour identifier les images qui ralentissent votre site. Le rapport liste précisément quelles images sont trop lourdes et quel gain vous obtiendriez en les optimisant.
Installez un plugin d’optimisation : ShortPixel, Imagify ou WP-Optimize proposent des versions gratuites qui optimisent automatiquement vos futures images et peuvent retraiter votre bibliothèque existante. ShortPixel obtient les meilleurs taux de compression dans les tests indépendants (54% de réduction sur JPEG).
Activez le lazy loading : si vous êtes sous WordPress 5.5 ou supérieur, c’est déjà actif par défaut sur les images. Vérifiez dans le code source de votre page que vos images contiennent bien loading="lazy".
Passez au WebP : activez la conversion automatique dans votre plugin d’optimisation. WordPress accepte nativement ce format depuis 2021, mais il faut activer la conversion dans les réglages du plugin.
Si vous avez un e-commerce avec des milliers d’images : contactez un développeur WordPress pour implémenter AVIF avec fallback WebP (affichage automatique du bon format selon le navigateur). L’investissement se rentabilise en quelques mois grâce à l’économie de bande passante et l’amélioration du taux de conversion.
