Mecredi 8 novembre 2023

Le rôle positif des images sur un site est indiscutable, particulièrement sur un site e-commerce. Cependant il ne suffit pas d'ajouter « bêtement » des images sur son site. Il existe de bonnes pratiques à respecter pour que vos images soient non seulement attractives mais également utiles pour votre référencement.

Les images sur un site internet

Il y a plusieurs avantages à utiliser des images sur un site internet :

• Elles illustrent le site et le rendent dès lors plus agréable à visiter, plus attractif
• Elles rendent les textes plus digestes, plus simples à lire.
• Si le contenu est plus attractif et plus digeste, les internautes passeront plus de temps sur une page ce qui envoie un signal positif à Google
• De plus les images jouent un rôle dans votre référencement naturel via le nom des fichiers et le texte alternatif

Sur un site e-commerce, elles sont évidemment essentielles pour présenter joliment et efficacement les produits.

Optimiser ses images pour le référencement (SEO = Search Engine Optimization)

Nommer ses images

Vous l'avez certainement déjà remarqué : lorsque vous faites une recherche sur Google, vous obtenez souvent des résultats en images !

Et oui les images aussi sont référencées et offrent une porte vers votre site !

Pour que vos images aient une chance d'apparaître dans ces recherches, il faudra qu'elles soient bien nommées. On oublie donc définitivement les images qui s'appellent :

• IMG6785.webp
• Capture d'écran 2023-09-29 à 09.56.51.png

Les bonnes pratiques pour nommer vos images

• Nommer vos images AVANT de les charger sur votre site
• Écrivez les noms en minuscules
• Vous pouvez utiliser des lettres et des chiffres
• N'utilisez pas d'accent, ni d'espace, ni de ponctuation et autres caractères spéciaux
• Séparez les mots des « tirets-du-milieu » (et non par des « tiret_du_bas »)
• Choisissez un nom descriptif en utilisant le moins de mots possibles
• Si c'est possible et pertinent, pensez à vos mots clés
• Si c'est pertinent, ajoutez le nom de votre marque / boutique dans le nom de l'image

Que faire si on a des images qui portent le même nom ?

La réponse est : faites un petit effort ! Il y a forcément une différence entre 2 images que vous voulez télécharger sur votre site, sinon vous devrez nous expliquer pourquoi vous voulez mettre 2 images identiques.

Jouez sur la différence de couleur, de point de vue (vu du haut, de profil, de face), de confort, de matière, ou toute autre point de différenciation qui vous permettra de trouver 2 noms différents.

Exemple pour une paire de baskets :

• marque-modele-couleur
• marque-modele-couleur-vue-profil

Ajouter du texte alternatif

Le texte alternatif permet de décrire fidèlement une image au moyen d'un texte plus riche que le simple nom de l'image. Ce texte n'apparaît pas sur le site (mais il est bien présent dans son code dans l'attribut alt).

Pourquoi c'est important ?

• Les assistants vocaux peuvent lire ce texte ce qui est très important pour les personnes qui utilisent ce type d'assistant, en particulier les personnes non- ou mal-voyantes.
• Et si les assistants vocaux peuvent les lire … Google aussi ! Votre texte alternatif permet à Google de comprendre votre image dans son contexte.
• Mais attention, ne lui racontez pas n'importe quoi. Google est parfaitement capable de comprendre que vous lui mentez si votre description ne correspond pas à l'image. Et dans ce cas il vous pénalisera.

Comment écrire le texte alternatif :

Décrivez fidèlement votre image dans son contexte. Et si vous le pouvez, utilisez un mot ou une expression clé.

Contrairement au nom de votre image, pour le texte alternatif vous allez écrire normalement avec majuscule, espaces, etc.

Optimiser le poids de ses images

Il s'agit ici de ne pas être pénalisé par Google. Si vous aviez 2 sites identiques dont un avec des images plus légères, c'est ce dernier qui serait favorisé par Google.

En effet, comme les internautes ont tendance à quitter rapidement une page qui se charge trop lentement, Google a tendance à pénaliser les sites trop lents. La vitesse de chargement est un facteur important pour le référencement.

Or les images actuelles sont de plus en plus grandes en taille (pixels) et de plus en plus lourdes en poids (Mo). Et une image lourde utilise beaucoup de bande passante et ceci a un impact sur la vitesse de chargement de vos pages et de votre site.

Les images, de par leur poids, sont donc un véritable frein à un chargement rapide. Mais on est bien d'accord : on ne peut pas s'en passer, surtout sur un site e-commerce. Il va donc falloir les optimiser !

Optimiser le poids ou les dimensions ?

C'est essentiellement le poids de nos images que nous allons chercher à optimiser en les compressant et en supprimant de leur fichier les informations qui ne sont pas nécessaires.

Mais rassurez-vous, il existe des outils pour cela. Ils permettent d'alléger au maximum le poids de vos images tout en conservant une excellente qualité d'image.
Exemple : Photoshop, Tinypng ou Compress Image

Note : Si votre site le permet, favorisez l'optimisation de vos images directement sur votre site en installant une extension pour cela. Sur WordPress par exemple, vous pouvez utiliser des extensions comme imagify ou tinypng qui vous permettront d'optimiser les images que vous chargez mais également celles qui sont déjà sur votre site.

Et les dimensions ?

C'est moins important mais évidemment il est inutile de télécharger une image de 4000 pixels de côté si elle ne sera affichée que sur un téléphone mobile ou en tant que mini photo sur votre site.

Réfléchissez donc à la dimension de vos images en fonction de l'utilisation qui en sera faite sur votre site. Une image de bannière en pleine largeur devra être plus grande qu'une petite photo pour mobile.

Aller plus loin avec le format WebP

Nous l'avons vu, plus une image est « légère », moins elle consomme de ressources pour être chargée sur votre site, plus elle sera chargée rapidement, mieux ce sera pour votre référencement !

Si vous avez le choix, préférez le format jpg au png (sauf si vous avez besoin de transparence).

Outre le format jpg et png, il existe un format plus récent : le format WebP qui permet d'encore améliorer l'optimisation de ses images. On parle de 30% encore grignoté sur les fichiers jpg et png.

Une même image au format WebP sera donc plus légère que son équivalent au format jpg ou png. Et cela, même si vous les avez déjà optimisées en les compressant ! Cependant certaines personnes trouvent qu'il y a plus de perte de qualité avec ce dernier format. À vous d'essayer et de juger.

Quelques conseils complémentaires :

• Choisissez un bon hébergement pour ne pas pénaliser votre vitesse de chargement. Il vaut mieux payer un petit peu plus cher chaque année pour éviter de voir ses clients potentiels fuir vers la concurrence parce que notre site est trop lent.
• Pour rendre votre site unique, privilégiez vos propres images plutôt que celles de banques de données. Si vous pouvez vous le permettre engagez un photographe ou faites-les vous-même.
• Et si ce ne sont pas vos images, veillez toujours à avoir le droit de les publier sur votre site (soit en les achetant, soit en demandant la permission au propriétaire, soit en utilisant des images libres de droit).

Bon travail !

Retour