Conseil n°6 : décrire les images porteuses d’information et fournir des transcriptions aux vidéos
Aujourd’hui, les pages web sont majoritairement constituées de texte et d’éléments graphiques comme les images.
Résumé
Aujourd’hui, les pages web sont majoritairement constituées de texte et d’éléments graphiques comme les images. Or, toute information véhiculée uniquement par le visuel (dans les images par exemple) est inaccessible pour ceux qui ne sont pas en mesure d’analyser ces images (les moteurs de recherche, les utilisateurs déficients visuels, les logiciels de reconnaissance vocale, les utilisateurs qui désactivent l’affichage des images dans leur navigateur…). Les images qui apportent une information nécessaire à la compréhension du contenu de la page doivent donc s’accompagner d’une description textuelle. Ce texte descriptif viendra ainsi en alternative pour tous ceux qui ne « voient » pas les images.
Note : dans le cas des images à vocation purement décorative (sans aucune fonction et ne véhiculant aucune information particulière), il faut qu’elles puissent être ignorées par les technologies d’assistance (comme un lecteur d’écran). Selon les types d’images, plusieurs techniques existent, comme par exemple celle de leur adjoindre une alternative textuelle vide.
Le principe de la description sous forme de texte s’applique également aux éléments multimédias comme les vidéos. Si, pour quelque raison que ce soit, un utilisateur ne peut pas visionner une vidéo (faible débit de connexion internet, manque de temps…), il doit pouvoir avoir accès à un contenu textuel qui contient tout ce qui est exprimé oralement ainsi qu’à toutes les informations (visuelles, de contexte) nécessaires à la compréhension de l’action.
Bénéfices pour les internautes
- Lorsque que le lecteur d’écran utilisé par une personne aveugle détectera une image porteuse d’information dans la page web, il vocalisera l’alternative textuelle, fournissant ainsi toute l’information véhiculée par l’image.
- Lorsque que le lecteur d’écran utilisé par une personne aveugle détectera une image dite « de décoration », l’alternative vide de cette image permettra au lecteur d’écran de ne pas signaler la présence de cette image à l’utilisateur et donc de ne pas interférer dans sa navigation avec des informations non utiles.
Exemple
Pour les images :
![Copie écran : pour une image qui représente un logo, l'alternative textuelle décrit ce que représente cette image.](https://aveuglesdefrance.org/app/uploads/2020/11/conseil-5a.png)
Pour les vidéos :
![Copie écran : la vidéo de l'exemple est immédiatement suivie par un lien d'accès vers la transcription textuelle.](https://aveuglesdefrance.org/app/uploads/2022/02/exemple2-conseil6.png)
Boîte à outils
La barre d’outils « Web Developer » sert à vérifier la présence et la pertinence d’éléments telles que les images sur une page web.
Nous vous recommandons de lire aussi
Nous vous recommandons
de lire aussi
- Faire un don aux Aveugles de FranceEn savoir plusEn faisant un don à la Fédération des Aveugles de France, vous permettez la concrétisation de pr...
- Fiches pratiquesVous souhaitez connaitre vos droits, la législation en vigueur ? Consultez nos fiches pratiques qui...En savoir plus