Bénéfice 1 :
Les personnes aveugles ou les utilisateurs n'ayant qu'un accès Internet à faible débit et qui désactivent le chargement des images, ne peuvent visualiser les informations véhiculées par l'intermédiaire d'une image. De même, les personnes malvoyantes ou les personnes souffrant d'un handicap cognitif peuvent éprouver des difficultés à "déchiffrer" une image complexe et porteuse d'information.
Or, la description d'un graphe statistique ou d'un dessin, par exemple, peut s'avérer longue et inappropriée à l'attribut alt dont le contenu ne doit pas dépasser 60 caractères. Il faut alors recourir à l'attribut longdesc qui permet une description détaillée.
Valeur ajoutée pour le site
Bénéfice 1 :
Toute information publiée sous forme de texte dans un site, possède toujours l'avantage d'apporter une meilleure lisibilité de celui-ci pour les moteurs de recherche.
Vérifier la présence de l'attribut longdesc dans la balise IMG concernée.
Par l'utilisation d'outils
Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.
Evaluer avec la barre AccessiWeb (version 1.0) :
Sous Internet Explorer, ouvrir la page à analyser.
Dans le menu "1. Eléments graphiques" de la Barre AccessiWeb, activer le critère 1.10.
Toutes les images de la page sont entourées d'un liseret rouge et sont précédées d'un extrait de code indiquant si l'attribut longdesc est présent ou non.
Vérifier que chaque image nécessitant une description longue comporte l'attribut longdesc.
Note : Pour revenir à la page initiale, recharger la page en cliquant sur la touche F5.
Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :
Ouvrir la page à analyser sous Internet Explorer.
Cliquer sur le menu "Images", puis sur l'option "Liste des images [Nouvelle fenêtre]".
L'ensemble des éléments graphiques et leur extrait de code associé s'affichent.
Vérifier pour chaque élément graphique nécessitant une description longue, qu'il comporte l'attribut longdesc.
Evaluer avec la Barre d'Outils Web Developper pour Firefox (version
1.0.2 en français) :
Méthode 1 :
Activer l'option "Voir Source" du menu "Voir Source".
Une nouvelle fenêtre apparaît et affiche le code source.
Vérifier pour chaque élément graphique nécessitant une description longue qu'il comporte l'attribut longdesc et que celui-ci est renseigné.
Méthode 2 :
Activer l'option "Informations sur la page" du menu "Information" puis l'onglet "Médias" de la nouvelle fenêtre.
La liste des images présentes sur la page apparaît.
Au niveau de la rubrique "Description longue :", vérifier pour chaque élément graphique nécessitant une description longue qu'il comporte l'attribut longdesc et que celui-ci est renseigné.
Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :
Afficher la page à évaluer et passer sur chaque élément graphique ayant une alternative textuelle, en tapant sur la touche G. Note : l'ordre d'apparition des éléments graphiques est celui du code source.
Dès qu'il rencontre l'attribut longdesc sur une image, Jaws dit "appuyer sur entrée pour obtenir une description longue".
Le développeur doit veiller à l'implémentation de ce critère.
Implémentation
Différentes méthodes sont possibles. A chacun d'utiliser celle qui correspondra le mieux à ses contraintes (graphiques, éditoriales, etc) :
Soit mettre une légende texte explicite à proximité de l'image
Soit utiliser l'attribut longdesc pour associer un commentaire plus détaillé.
<img src="stats.gif" alt="évolution de la population française : 1990-2004" longdesc="pop_fr.html" />
Note : l'attribut longdesc est supporté par Netscape 7 et Firefox 1.0.4. Il n'est pas supporté par Internet Explorer 6 dans le sens où le lien fourni par l'attribut longdesc n'est pas cliquable. En revanche, quelque soit le navigateur utilisé, il est reconnu par les aides techniques comme Jaws, par exemple.
Exemple de mauvaise pratique
Le site www.unsitecorporate.com publie une photo de groupe représentant le conseil d'administration.
Inclure la description de cette photo par l'intermédiaire de l'attribut alt risque de dépasser la limite autorisée pour la longueur des alternatives textuelles. Ainsi, il faut éviter le code suivant :
Cette copie d'écran présente un camembert des recettes d'une société. Une alternative textuelle ne suffit pas à décrire cette image porteuse d'information. Il faudrait donc lui associer une description longue.