Optimisation des images pour le SEO : la checklist complète
Sur la plupart des sites, les images représentent environ 50 % du poids total d’une page. Les images non optimisées sont la première raison d’un échec aux Core Web Vitals — ce qui impacte directement votre classement. Cette checklist couvre chaque technique d’optimisation d’images qui compte pour le SEO en 2026.
Pourquoi l’optimisation des images compte pour le SEO
Google utilise la vitesse de page comme facteur de classement, et les images sont généralement les assets les plus lourds. Voici l’impact direct :
- Core Web Vitals : le LCP (Largest Contentful Paint) est souvent une image. Si votre image héros met plus de 4 secondes à charger, votre LCP échoue — et Google vous pénalise.
- Taux de rebond : 53 % des visiteurs mobiles partent si une page met plus de 3 secondes à charger (données Google).
- Trafic de recherche d’images : Google Images représente 20 à 30 % de toutes les recherches Google. Des images bien optimisées se classent en recherche d’images et génèrent du trafic organique.
- Budget de crawl : les pages lourdes consomment plus de budget de crawl. Des pages plus rapides = plus de pages crawlées par session.
Gain rapide : compresser les images peut à lui seul améliorer le LCP de 1 à 3 secondes. C’est souvent la différence entre réussir et échouer les Core Web Vitals.
La checklist complète du SEO des images
1. Compressez chaque image
C’est l’optimisation au plus fort impact et au moindre effort. Compressez toutes les images avant de les téléverser :
| Format | Qualité cible | Gain attendu |
|---|---|---|
| JPG/JPEG | 75-85% | 60-75% |
| PNG | Optimisation sans perte | 20-40% |
| WebP | 75-85% | 70-85 % vs original |
Utilisez des outils qui traitent les images côté client (comme ImgMin — sans téléversement) pour éviter d’envoyer des images sensibles à des serveurs tiers. Guides par format : compresser JPG, compresser PNG, compresser WebP.
2. Utilisez le bon format
- WebP pour tout sur le web moderne (97 %+ de support navigateur)
- JPG en repli pour les photos et images complexes
- PNG uniquement pour des graphiques au pixel près ou la transparence sans support WebP
- SVG pour logos, icônes et illustrations simples (infiniment scalable, taille minuscule)
Servez plusieurs formats avec l’élément <picture> :
<picture>
<source srcset="hero.webp" type="image/webp">
<img src="hero.jpg" alt="Product hero image" width="1200" height="630">
</picture>
3. Redimensionnez aux dimensions d’affichage
Ne servez jamais une image 4000×3000 dans un emplacement 800×600. Cela gaspille de la bande passante et nuit au LCP.
- Utilisez
srcsetpour servir différentes tailles selon les viewports - Générez 2-3 tailles par image : mobile (640px), tablette (1024px), bureau (1920px)
- Définissez l’attribut
sizespour indiquer au navigateur quelle taille choisir
<img
srcset="photo-640.webp 640w, photo-1024.webp 1024w, photo-1920.webp 1920w"
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 80vw, 1200px"
src="photo-1024.webp"
alt="Descriptive alt text"
width="1200" height="800">
4. Définissez toujours la largeur et la hauteur
Sans dimensions explicites, le navigateur ne peut pas réserver l’espace des images avant leur chargement. Cela provoque des décalages de mise en page — un problème de CLS (Cumulative Layout Shift) qui nuit aux Core Web Vitals.
<!-- Bad: causes layout shift -->
<img src="photo.jpg" alt="Photo">
<!-- Good: browser reserves space -->
<img src="photo.jpg" alt="Photo" width="800" height="600">
Combinez avec le CSS aspect-ratio ou height: auto pour un comportement responsive tout en évitant les décalages.
5. Rédigez un texte alternatif descriptif
L’alt est le principal moyen pour Google de comprendre le contenu d’une image. Un bon alt vous aide à vous classer en recherche web et en recherche d’images.
| Mauvais alt | Bon alt |
|---|---|
alt="" (empty) | alt="Golden retriever playing fetch in a park" |
alt="image1.jpg" | alt="Bar chart showing Q3 2026 revenue growth" |
alt="photo photo photo SEO keywords" | alt="Red Nike running shoes on a trail" |
Règles pour l’alt :
- Décrivez ce qu’il y a DANS l’image, pas ce qu’elle EST
- Restez sous 125 caractères
- Incluez des mots-clés pertinents naturellement — ne bourrez pas
- Pour les images décoratives, utilisez
alt=""(vide) pour ignorer les lecteurs d’écran
6. Utilisez des noms de fichiers descriptifs
Google lit les noms de fichiers comme un signal du contenu de l’image.
- Mauvais :
IMG_20260315_001.jpg,screenshot.png - Bon :
golden-retriever-park.jpg,quarterly-revenue-chart.png
Utilisez des tirets pour séparer les mots. Gardez des noms en minuscules, concis et descriptifs.
7. Mettez en place le lazy loading
Le lazy loading diffère les images hors écran jusqu’à ce que l’utilisateur s’en approche. Cela améliore nettement le temps de chargement initial.
<!-- Native lazy loading (all modern browsers) -->
<img src="photo.jpg" alt="Description" loading="lazy" width="800" height="600">
<!-- Don't lazy-load above-the-fold images -->
<img src="hero.jpg" alt="Hero" loading="eager" fetchpriority="high">
Important : ne lazy-loadez jamais votre image LCP (généralement le héros/bannière). Utilisez loading="eager" et fetchpriority="high" pour les images au-dessus de la ligne de flottaison. Lazy-loadez tout le reste.
8. Préchargez les images critiques
Pour votre image LCP, dites au navigateur de la récupérer tôt :
<link rel="preload" as="image" href="hero.webp" type="image/webp">
Cela peut gagner 200-500 ms sur le LCP car le navigateur commence à télécharger avant d’analyser le HTML qui référence l’image.
9. Utilisez un CDN pour la diffusion des images
Les réseaux de diffusion de contenu servent les images depuis les serveurs les plus proches de l’utilisateur. Avantages :
- 50-80 % de réduction de la latence pour les utilisateurs mondiaux
- Conversion de format automatique (certains CDN servent WebP/AVIF automatiquement)
- Redimensionnement à la volée via les paramètres d’URL
- Mise en cache intégrée avec des en-têtes de cache appropriés
10. Ajoutez des données structurées pour les images
Aidez Google à comprendre vos images en contexte avec des données structurées :
- Images produits : utilisez le schéma
Productavec la propriétéimage - Images d’articles : utilisez le schéma
Articleavec la propriétéimage - Images de recettes : utilisez le schéma
Recipe(images requises pour les résultats enrichis)
Les images référencées dans les données structurées ont plus de chances d’apparaître dans les résultats enrichis et carrousels d’images de Google.
11. Créez un sitemap d’images
Si vos images sont importantes pour le SEO (photos produits, infographies), ajoutez-les à votre sitemap :
<url>
<loc>https://example.com/page</loc>
<image:image>
<image:loc>https://example.com/photo.jpg</image:loc>
<image:title>Product photo</image:title>
</image:image>
</url>
12. Supprimez les métadonnées inutiles
Les données EXIF (modèle d’appareil, coordonnées GPS, horodatages) ajoutent 20-100 Ko par image. Supprimez-les avant le téléversement pour :
- Des fichiers plus légers
- La protection de la vie privée (supprime les données de localisation GPS)
- Aucun impact sur la qualité visuelle ou le SEO
Résumé de l’impact sur les Core Web Vitals
| Optimisation | Métrique CWV | Impact typique |
|---|---|---|
| Compresser les images | LCP | -1 à -3 secondes |
| Redimensionner à la taille d’affichage | LCP | -0,5 à -2 secondes |
| Définir largeur/hauteur | CLS | Élimine les décalages d’images |
| Lazy loading | LCP, FID | Chargement initial plus rapide |
| Précharger l’image LCP | LCP | -200 à -500 ms |
| Utiliser WebP | LCP | -25 à -35 % de taille transférée |
| Diffusion par CDN | LCP | -50 à -80 % de latence |
Commencez par l’étape 1 : compressez vos images
ImgMin compresse JPG, PNG et WebP directement dans votre navigateur. Sans téléversement, sans serveur, sans risque pour la vie privée.
Compresser des images gratuitementChecklist de référence rapide
- Compressez toutes les images (cible 75-85 % pour les formats avec perte)
- Utilisez WebP avec des replis JPG/PNG via
<picture> - Redimensionnez les images aux dimensions d’affichage réelles
- Définissez explicitement
widthetheightsur chaque<img> - Rédigez un alt descriptif et pertinent en mots-clés
- Utilisez des noms de fichiers descriptifs avec tirets
- Lazy-loadez les images sous la ligne de flottaison
- Préchargez l’image LCP avec
fetchpriority="high" - Servez les images via un CDN pour des performances mondiales
- Ajoutez des données structurées pour les images produits/articles
- Incluez les images importantes dans votre sitemap
- Supprimez les métadonnées EXIF avant le téléversement
En résumé
L’optimisation des images est le travail SEO au meilleur ROI possible. La compression seule corrige souvent les échecs aux Core Web Vitals. Associez-la à un bon dimensionnement, des alt, le lazy loading et des formats modernes — et vous verrez des améliorations mesurables en vitesse et en classement.
Outils associés
- Compresser un JPG en ligne
- Compresser un PNG en ligne
- Compresser un WebP en ligne
- Compresser des images à 200 Ko — idéal pour les images d’articles de blog
- Compresser des images à 100 Ko — pour des limites de soumission strictes
- Compression d’images axée confidentialité — sans téléversement, sans serveur