GérerGestionLe B.A. BA de la gestion

Des images accessibles à tous !

L’accessibilité n’est pas forcément très technique et très compliquée ! Les conseils de cet article vous permettront de faire un premier pas dans l’accessibilité ! Pour vous aider à améliorer l’accessibilité de votre site, prenons l’exemple des images et quelques bonnes pratiques.

Comment peut-on percevoir des images quand on ne voit pas ?

Effectivement ceci paraît compliqué pour ceux qui voient correctement ! Une personne aveugle utilise une aide technique qui s’appelle un lecteur d’écran. Ce logiciel retranscrit par synthèse vocale (et/ou sur un afficheur braille) ce qui est affiché sur l’écran d’un ordinateur et permet d’interagir avec le système d’exploitation et les autres logiciels. 

Dans le cas d’une image, le lecteur d’écran va donc retranscrire le nom du fichier image ainsi qu’un court texte qui est nommé « alternative textuelle » de l’image (attribut « alt » en termes techniques). Ce champ est proposé par défaut par les CMS (système de gestion de contenu), comme par exemple WordPress ou Joomla, lors de l’insertion d’images.

L’alternative textuelle n’est pas réservée à l’usage des lecteurs d’écran

Parfois votre navigateur ne peut pas afficher les images. C’est le cas si le débit internet est trop faible ou si vous avez choisi de ne pas afficher les images pour gagner du temps. Il en est de même sur votre tablette ou votre mobile.

Qu’allez-vous voir à la place des images ? Rien si l’alternative textuelle est inexistante !

Les différents types d’images

Il y a cependant plusieurs types d’images à considérer :

• Les images porteuses d’information : o images porteuses de sens : sans elles il n’est pas possible de comprendre la page correctement.
o images-liens : elles sont essentielles à la navigation, par exemple, la traditionnelle icône représentant une silhouette de maison et suggérant un lien vers votre page d’accueil
o textes en image : par exemple le slogan de votre entreprise, transformé en image

• Les images de décoration : o images qui n’apportent pas d’information : elles ne sont pas nécessaires à la compréhension.

Voyons maintenant comment traiter ces différents types d’images.

Quelques bonnes pratiques pour rendre des images accessibles

1. Utilisez un nom de fichier pertinent : plutôt que IMG28312.jpg qui n’est pas très parlant. Préférez un nom du type « logo.jpg » si l’image est celle de votre logo. Le lecteur d’écran cité plus haut énoncera donc un titre que l’utilisateur pourra comprendre, et qui le renseignera sur le contenu de l’image.

2. Evitez de remplir le champ « title », inutile et redondant la plupart du temps. Les CMS proposent ce champ quand vous insérez des images sur votre site.

3. Vérifiez que chaque image a un attribut « alt » et que celui-ci :

a. est vide pour les images de décoration (alt= » »)

b. est rempli pour les images porteuses d’information. Dans le cas de l’image-lien représentant l’accueil de votre site, l’alternative textuelle sera « accueil» (alt= »Accueil »)

Voilà, c’est plutôt simple, non ? Comme quoi l’accessibilité ce n’est pas forcément très technique et très compliqué ! Il ne vous reste plus qu’à vérifier les images de votre site et vous aurez fait un premier pas dans l’accessibilité !

Afficher plus

Articles similaires

Bouton retour en haut de la page