L’optimisation des images est une pratique essentielle pour améliorer le SEO on page d’un site web. Elle influence directement la vitesse de chargement, le classement sur Google Images et l’expérience utilisateur.
Un site rapide attire plus de visiteurs et réduit le taux de rebond, un critère pris en compte par Google pour le positionnement des pages. De plus, une image bien optimisée peut apparaître dans les résultats de recherche Google Images, augmentant ainsi la visibilité de votre site.
Dans ce guide, nous allons voir pourquoi et comment optimiser vos images pour le SEO, les meilleurs formats à utiliser, les outils indispensables et les erreurs à éviter.
Téléchargez votre check-list SEO On-page pour optimiser votre site !
Sommaire
Pourquoi optimiser ses images pour le SEO ?
- Amélioration de la vitesse du site et des Core Web Vitals : Des images trop lourdes ralentissent le chargement des pages, impactant négativement l’expérience utilisateur et le référencement.
- Meilleur positionnement sur Google Images : Google analyse la pertinence et la qualité des images pour les afficher dans les résultats de recherche.
- Accessibilité améliorée : Les balises ALT permettent aux personnes malvoyantes d’accéder au contenu visuel via des lecteurs d’écran.
- Consommation de bande passante réduite : Sur mobile, des images légères permettent un chargement plus rapide et une expérience plus fluide.
Choisir le bon format d’image
Le choix du format d’image a un impact direct sur la qualité et le poids des fichiers. Voici un comparatif des formats les plus courants :
Si vous en avez la possibilité, je vous recommande d’utiliser le format AVIF. C’est celui que j’utilise quotidiennement sur les sites de mes clients, et il me permet de conserver une qualité optimale tout en réduisant considérablement le poids des images.
Compression et réduction du poids des images
Un des aspects les plus importants de l’optimisation SEO d’une image est la compression. Voici comment réduire le poids des images sans perte de qualité :
Format | Poids | Qualité | Supporté par les navigateurs | Cas d’utilisation idéal |
---|---|---|---|---|
JPEG | Léger | Moyenne | ✔ Tous | Photos, e-commerce |
PNG | Lourd | Élevée | ✔ Tous | Logos, images transparentes |
WebP | Léger | Très élevée | ✔ Chrome, Firefox, Edge | Alternative au JPEG & PNG |
AVIF | Ultra léger | Excellente | ⚠ Pas tous les navigateurs | Sites modernes |
SVG | Variable | Parfait (vectoriel) | ✔ Tous | Icônes, logos |
Outils pour compresser vos images
- TinyPNG : Idéal pour compresser PNG et JPEG.
- Squoosh : Outil de Google avec de nombreuses options d’optimisation.
- Imagify et ShortPixel : Plugins WordPress pour automatiser la compression.
- Kraken.io : Outil en ligne efficace pour les gros volumes d’images.
Automatiser la compression
Si vous utilisez WordPress, des plugins comme Smush ou EWWW Image Optimizer permettent de compresser automatiquement vos images lors de leur téléchargement. Je vous conseille d’aller jeter un œil dans la bibliothèque d’extensions de votre CMS en tapant ‘compression image’. Vous y trouverez une multitude de plugins intéressants.
Optimisation manuelle
Photoshop et d’autres logiciels permettent de modifier les paramètres de qualité pour réduire le poids d’une image tout en conservant une bonne définition.
Optimisation des noms et des balises
Nom de fichier optimisé
Un bon nom de fichier aide au référencement. Exemples :
- ✅
chaussures-running-adidas.jpg
- ❌
IMG1234.jpg
Privilégiez donc un nom de fichier qui décrit la photo, avec, si possible, la présence de mots-clés.
Balise ALT : comment bien la rédiger ?
Une balise ALT efficace décrit le contenu de l’image en intégrant des mots-clés pertinents sans sur-optimisation.
Exemple :
- ✅ “Chaussures de running Adidas noires pour homme.”
- ❌ “Chaussures sport Adidas.”
Balise Title et légende
La balise Title s’affiche au survol de l’image et améliore l’expérience utilisateur. La légende aide à contextualiser l’image pour le lecteur.
Profitez de 30 minutes d’audit offertes !
Techniques avancées pour un chargement rapide
Lazy Loading
loading="lazy"
à vos balises image, comme dans l’exemple suivant : Utilisation de l’attribut srcset
L’attribut srcset permet de proposer plusieurs versions d’une image adaptées à la taille de l’écran, améliorant ainsi le SEO mobile.
En spécifiant différentes sources avec leurs largeurs associées, vous optimisez non seulement l’expérience utilisateur, mais vous contribuez également à une meilleure performance du site en réduisant la charge inutile de données.
Par exemple, considérez le code suivant :
Utilisation d’un CDN
Un CDN appelé aussi Content Delivery Network stocke les images sur des serveurs répartis dans le monde entier, réduisant le temps de chargement en fonction de la localisation des visiteurs.
Profitez de 30 minutes d’audit offertes !
Optimisation pour Google Images & SEO visuel
Indexation efficace des images
- Ajoutez vos images au sitemap XML
- Utilisez des données structurées pour enrichir vos images
- Vérifiez l’indexation via Google Search Console
Importance des balises Open Graph
Dans cet exemple :
- og:image définit l’URL de l’image à afficher.
- og:image:width et og:image:height précisent respectivement la largeur et la hauteur de l’image, ce qui permet aux plateformes de mieux adapter le rendu.
Ces balises aident à garantir que l’image s’affiche correctement et de manière attrayante sur les réseaux sociaux, améliorant ainsi l’engagement et la visibilité de votre contenu.
Structuration du contenu autour des images
Une image bien positionnée dans un contenu pertinent a plus de chances d’être bien référencée.
Les meilleurs outils pour optimiser ses images
Outil | Type | Fonctionnalités principales | Prix |
---|---|---|---|
Imagify | Plugin WordPress | Compression automatique, WebP, AVIF | Freemium |
Smush | Plugin WordPress | Optimisation en masse, Lazy Load | Freemium |
EWWW Image Optimizer | Plugin WordPress | Compression locale et CDN | Freemium |
Photoshop | Logiciel | Compression avancée, édition | Payant |
Affinity Photo | Logiciel | Alternative à Photoshop | Payant |
GIMP | Logiciel | Gratuit et open-source | Gratuit |
TinyPNG | Outil en ligne | Compression sans perte | Gratuit/Payant |
Squoosh | Outil en ligne | Réglages avancés de compression | Gratuit |
Profitez de 30 minutes d’audit offertes !