Donnez des noms explicites à vos fichiers image


On parle très souvent de l’attribut alt (texte alternatif) et du bon usage qu’il faut en faire tant pour des questions d’accessibilité que de référencement.

Je rappelle au passage ce très bon article de Webaim.org : Appropriate Use of Alternative Text

Et sa traduction par Goulven Champenois sur pompage.net : Bien utiliser le texte alternatif.

On ne parle pas très souvent, par contre, de l’intérêt du nom même du fichier image qui peut avoir un impact important sur le trafic de votre site internet, via les outils de recherche d’images en ligne du type Google image.

Un exemple tout simple, dans un de mes précédents articles, Quelques notions de mise en page : images et couleurs, j’avais parlé de l’utilisation des couleurs d’un visuel pour construire un design.

En exemple, j’avais donné l’image du Dragon utilisé comme support visuel principal du site Oyoyo.fr, et nommé ce fichier : bebe-dragon-oyoyo.jpg

Il se trouve que cette simple image à elle seule apporte à peu de choses près 30 visites par jour au blog car elle apparaît en première page de recherche d’images sur Google.fr à la requête dragon.

Certes, nous ne sommes pas dans la recherche ciblée, mais certains des visiteurs venus par cette requête lisent l’article où se trouve l’image et visitent le site plus en profondeur.

Qu’en serait-il si j’avais appelé mon image article-oyoyo-img5.png à la place ?

Un autre exemple, plus en rapport avec les sujets traités sur ce blog, les images roue-chromatique.png et roue-des-couleurs-desaturee.png apportent en moyenne 20 à 30 visites par jour sur l’article Quelques notions de mise en page : Les couleurs et les contrastes, sur diverses requêtes sur les thèmes des couleurs et du cercle/roue chromatique.

Je n’ai pas de statistiques précises, mais par contre, je pense qu’il y a une forte interdépendance entre le texte alternatif de l’image et les mots clés contenus dans le nom du fichier pour les affichages de résultats dans Google image.

Sincèrement, pourquoi se priver de visites alors qu’il est si simple et même plus pratique d’appeler ses fichiers images avec des noms explicites plutôt qu’utiliser image1, image2, etc?!


11 réponses à “Donnez des noms explicites à vos fichiers image”

  1. Oui, non seulement ça, mais si on fait une galerie photos, utilisé ce nom de fichier dans le title de la page présentant l’image finale.

    Cela fait d’une pierre deux coup, intitulé pertinent utilisé dans l’un des balisages les plus puissants pour la visibilité par rapport aux moteurs de recherche.

    Evidemment ça fait du boulot d’un point de vue rédactionnel :

    nom de fichier pertinent + commentaire pertinent et intéressant + texte alternatif pertinent et efficace.

    Néanmoins si une telle discipline de routine rédactionnelle est mise en place alors il y a une très forte valeur ajoutée. Du point de vue du contenu, sans doute du point de vue du référencement, sans conteste du point de vue de la compétence du rédacteur, point très important dans la perspective de production de documents accessibles.

  2. A jérome >

    « si la photo (ou un logo) représente un batiment ou une asso, je mets son adresse comme texte alternatif. »

    Ce qui signifie que quelqu’un disposant de l’image n’aura pas l’adresse ?

    Très souvent en fait le contenu de alt serait bien mieux placé comme texte complémentaire dans le contexte immédiat de l’image que comme texte alternatif via l’attribut alt.

  3. Je suis entièrement d’accord sur l’importance de bien nommer une image.
    Je rappellerai simplement qu’il faut éviter les accents et les caractères particuliers (« ç », »@ »..) ainsi que les espaces pour le nom du fichier image (fête foraine.jpg).

    Je vois le texte alternatif comme une valeur ajouté: par exemple, si la photo (ou un logo) représente un batiment ou une asso, je mets son adresse comme texte alternatif.

  4. Ce qui signifie que quelqu’un disposant de l’image n’aura pas l’adresse ?

    Non, ça signifit que l’information sera disponible alleurs (liense;texte; contexte)

    à moins que je sache reproduire les infos-bulles lorsque l’on survole un élément, comme dans windows.

  5. Bonne idée.
    Je rajoute à la liste des critères qu’il faut séparer les noms par des tirets – et non des underscores _. Car Google, à ce que je sais, identifie le tiret comme un séparateur de mots, mais pas l’underscore. Une image titrée bebe_dragon_oyoyo.gif n’apporterait aucun trafic, sauf si la personne a cherché précisément bebe_dragon_oyoyo, ce qui est assez rare.

  6. Mais oui, mais oui. En fait après avoir écrit le commentaire, j’ai fait un tour de Web et je me suis rendu compte que je venais de me planter comme un gros naze.
    Cela dit c’est une nouvelle qui me réjouit au plus haut point, vu que j’utilisais abondamment les underscore dans les URL pour des raisons de lisibilité.