Comment optimiser les images de son site web pour les moteurs de recherche (SEO) ?

Comme le disait notre cher Confusius, “une image vaut mille mots”. Que vous soyez d’accord ou non avec cette citation, les images ont un effet indéniable sur votre acquisition : bien optimisées elles peuvent améliorer votre référencement dans les moteurs de recherche. De plus, Google a bien souligné l’importance de la recherche visuelle lors de sa conférence “Google at 20”.

Alors comment ça fonctionne et comment s’y prendre ? C’est le sujet du WeeklyTopRead de la semaine.

Choisir le bon titre pour vos images

Cela semble évident mais donner un titre explicite à votre image est la base d’une bonne optimisation. Choisissez donc un titre qui décrive votre image en plaçant son mot clé principal au début. Par exemple, si votre image montre un robot qui fait du parachute, “robot-saut-parachute.jpg” semble être un titre idéal.

Choisir le bon format

Un rappel qui ne fait jamais de mal :

  • Le format JPEG est à privilégier pour les photos en grand format. Vous garderez ainsi une bonne qualité tout en ayant un fichier d’une taille relativement modeste ;
  • Le format PNG est utilisé dès lors que votre image a besoin d’un fond transparent. Vous pourrez ainsi facilement l’intégrer à votre site web et ce quelque soit la couleur d’arrière plan (assurez-vous quand même de garder un contraste suffisant avec la couleur d’arrière-plan) ;
  • Le format WebP peut être utilisé en complément d’un format JPEG ou PNG (il n’est pas encore supporté par tous les navigateurs). Il vous permettra de préserver une excellente qualité tout en ayant un fichier de très petite taille ;
  • Le format SVG est utilisé pour les logos et les icônes de votre site web. C’est un format qui est dessiné par le navigateur, son affichage est donc très rapide. De plus il est possible de l’animer à l’aide de certains langages de programmation (CSS et Javascript). Vous pouvez donc avoir un fond transparent et conserver la meilleure qualité possible quelque soit la densité de pixels de l’écran ;
  • Le format EPS est un format réservé à l’impression, ne l’utilisez pas pour le web.

Utiliser les bonnes dimensions

Le temps de chargement de la page est un critère utilisé non seulement en SEO mais également en UX. Délivrer une image à la bonne dimension en fonction de la taille de l’écran est donc bénéfique à la fois pour votre référencement et pour l’expérience de vos utilisateurs.

Si vous utilisez WordPress, vous avez déjà accès à différentes dimensions d’images qui sont générées lors de l’importation sur votre site. De manière générale, utiliser des images qui font deux fois la dimension de la fenêtre du navigateur est une bonne moyenne pour conserver une bonne expérience utilisateur tout en améliorant le temps de chargement de la page.

Si vous n’utilisez pas WordPress, vous pouvez utiliser le paramètre srcset dans la balise HTML de votre image afin de servir différentes images en fonction de la dimension de la fenêtre du navigateur.

Réduire la taille du fichier

Vous pouvez réduire la taille du fichier avec des outils comme ImageOptim, JPEGmini, Jpeg.io ou Kraken.io. Avec l’augmentation de la qualité des écrans il est préférable de conserver une qualité de 100% afin de conserver au maximum les détails de vos images. En revanche, n’hésitez pas à supprimer les données EXIF de vos fichiers.

Ajouter une légende

En moyenne le taux de lecture des légendes par rapport au corps du texte est de 300%. Cela signifie-t-il qu’il faut ajouter une légende à chaque image ? Pas forcément. La véritable question à se poser est plutôt : “est-ce qu’une légende est nécessaire à la compréhension de l’image ?”. Si la réponse est oui alors n’hésitez pas.

Gardez donc toujours en tête votre visiteur et faites attention à ne pas sur-optimiser votre page.

Les balises alt et title

La balise alt d’une image permet de fournir une description de l’image lorsque cette dernière ne s’affiche pas pour une raison ou une autre. Remplissez toujours cette balise avec une description de l’image et en utilisant un champ lexical lié à votre mot clé principal.

La balise title d’une image s’affiche dans certaines conditions (souvent lors du passage de la souris sur l’image). Compte tenu de l’inconsistance de son affichage et des problèmes d’accessibilité qu’elle engendre, vous pouvez la laisser vide.

Les données structurées

Les données structurées sont des informations qui permettent aux moteurs de recherche de faire apparaitre des éléments de votre site dans les résultats enrichis. Par exemple, si votre image accompagne une recette, Google affichera un badge dans la recherche d’image pour indiquer que cette image est liée à une recette.

Actuellement, Google Image utilise les données enrichies pour :

  • Un produit ;
  • Une vidéo ;
  • Une recette.

Si vous utilisez WordPress, des plugins comme Yoast ou The SEO Framework pourront vous aider à définir ces données. Vous pouvez également consulter le guide mis à disposition par Google.

OpenGraph et Cartes Twitter

Pour afficher une image lorsque votre article est partagé sur les réseaux sociaux il vous faudra utiliser des balises meta. Sur WordPress, le plus simple est d’utiliser les plugins mentionnés ci-dessus.

Vous voilà donc bien équipé pour optimiser au mieux le référencement de vos images dans les moteurs de recherche ! Retrouvez encore plus d’informations dans le WeeklyTopRead de la semaine.