Back to the original French page Read this page in Italian by Google Translation Read this page in Portuguese by Google Translation Read this page in English by Google Translation Read this page in German by Google Translation Read this page in Spanish by Google Translation Read this page in Arabic by Google Translation Read this page in Hebrew by Google Translation

Créer des images accessibles : descriptions longues

Aller au début du contenu sans utiliser la barre Consultation et Partage Mode d'emploi de la barre Consultation et Partage Ecoutez le contenu principal de cette page
Imprimer Imprimer le contenu principal de cette page Envoyer Envoyer par courriel le contenu principal de cette page Partager Partager cette page sur TwitThis Partager cette page sur Facebook Partager cette page sur Wikio Partager cette page sur Google Partager cette page sur LinkedIn Partager cette page sur Digg Partager cette page sur del.icio.us Partager cette page sur Netvibes

Avertissement : la version originale de ce document est Creating Accessible Images : Long Descriptions. Cette traduction en français a été réalisée par Ideose dans le cadre d’un accord entre WebAIM et Ideose.

Note : consulter la page Documents sur l’accessibilité du Web pour obtenir la liste de tous les documents déjà traduits. D’autres ressources sur l’accessibilité du Web sont également listées dans le Portail du numérique accessible.

Quand faut-il mettre une description longue ?

Dans certains cas, une image est trop complexe à décrire en quelques mots. Les tableaux et les graphiques sont les principaux exemples de ce type d’images. Bien qu’il n’y a pas de limite à la longueur du texte dans un attribut alt, le alt texte est destiné à être relativement court. Ce serait donc un abus d’écrire plus que quelques mots ou même plus que quelques phrases courtes. La réponse est donc de donner une alternative textuelle courte dans l’attribut alt et de fournir une description plus détaillée autrement.

Méthodes pour créer une description longue

Il existe plusieurs manières de donner une description longue aux images. Ces possibilités sont listées ci-dessous de celle à privilégier le plus à celle à privilégier le moins :

  1. Mettre une description longue dans le contexte du document lui-même.
  2. Mettre un lien vers la description longue par un lien texte normal.
  3. Mettre un lien vers une description longue via l’attribut longdesc.
  4. Mettre un lien vers une description longue par un lien « d » link.

Ceux qui sont familiers avec les techniques d’accessibilité peuvent être surpris de voir l’attribut longdesc et le lien « d » link en fin de liste. La raison est que les deux méthodes posent des problèmes. L’attribut longdesc est invisible (et inaccessible dans certains navigateurs) pour les personnes qui n’utilisent pas de lecteurs d’écran modernes. Le « d » link est un lien non conventionnel. Il peut être déroutant pour les personnes qui ne le connaissent pas. La manière la plus simple de rendre accessibles les descriptions longues est de les rendre évidentes et disponibles pour toutes les personnes, qu’elles aient un handicap ou non.

Dans le corps du document

En mettant une longue description dans le corps du document où il y a l’image, chacun en bénéficie et pas seulement les personnes handicapées. Tout le monde sera capable de lire la description longue et d’en tirer profit. Voici un exemple de réalisation avec une image d’un graphe :

Graphique des pourcentages de la population totale non institutionnelle des Etats-Unis âgée de 16 à 64 ans déclarant un ou plusieurs handicaps

Le graphique ci-dessus montre les pourcentages de la population totale non institutionnelle des Etats-Unis âgées de 16 à 64 ans déclarant un ou plusieurs handicaps. Les valeurs du pourcentage dans chaque catégorie sont les suivantes :

  • Total de personnes déclarant un ou plusieurs handicaps : 18.6%
  • Handicap sensoriel (visuel ou auditif) : 2.3%
  • Handicap physique : 6.2%
  • Handicap mental : 3.8%
  • Self-care: 1.8%
  • Difficulté à sortir de chez soi : 6.4%
  • handicap professionnel : 11.9%

Les données sont extraites du document 2000 U.S. Census (pdf, 880 ko).

Dans l’exemple ci-dessus, les données apparaissent après l’image et sont accessibles à tous.

L’attribut longdesc

L’attribut longdesc, qui peut être ajouté à une balise img, ne fait rien de plus que de fournir un lien vers une page où une longue description est disponible. Il fonctionne de la même façon que dans l’exemple précédent, sauf que le lien est invisible pour les lecteurs voyants. L’exemple suivant est le même graphique avec un attribut longdesc ajouté :

Graphique des pourcentages de la population totale non institutionnelle des Etats-Unis âgée de 16 à 64 ans déclarant un ou plusieurs handicaps

Ceux qui voient comprennent qu’il n’y a rien de visible quand l’attribut longdesc est utilisé. En ce qui les concerne, c’est comme s’il n’était pas là. Les seules personnes qui peuvent accéder à l’attribut longdesc sont celles qui utilisent des lecteurs d’écrans modernes. Les lecteurs d’écrans plus anciens n’interprètent pas cet attribut. Même parmi ceux qui utilisent la dernière version de leur lecteur d’écran, nombreux sont ceux qui ne sont pas familiers avec l’attribut longdesc (car il est utilisé si rarement) et ne savent pas comment y accéder, même si leur lecteur d’écran le prend en charge.

Le point essentiel est que l’attribut longdesc ne profite qu’à un petit nombre de personnes, en dépit du fait qu’il s’agisse d’une technique recommandée à la fois dans les recommandations de WAI et de la Section 508.

Voici le code pour l’attribut longdesc :

<img src= »graph.jpg » width= »526″ height= »353″ alt= »Graphique des pourcentages de la population totale non institutionnelle des Etats-Unis âgée de 16 à 64 ans déclarant un ou plusieurs handicaps » longdesc= »/images/media/description.htm »>

Les liens « D » (« D » Links)

Avant que la balise longdesc soit supportée par des lecteurs d’écran, un groupe de personnes avaient décidé qu’elles avaient besoin d’une méthode équivalente qui soit prise en charge par les navigateurs. Elles ont alors inventé le lien « d ». La lettre « d » signifie « description ». Ces liens « d » sont en fait des liens qui pointent vers d’autres pages et dont l’intitulé de lien est la lettre « d ». Voici à quoi ressemblerait un lien « d » dans notre exemple :

Graphique des pourcentages de la population totale non institutionnelle des Etats-Unis âgée de 16 à 64 ans déclarant un ou plusieurs handicaps
D

Vous pouvez utiliser un D majuscule ou un d minuscule. Ce n’est pas vraiment important. Un lien « D » est généralement placé juste après l’image. Cette technique fonctionne dans tous les navigateurs, elle remplit son objectif de donner une description textuelle mais elle est moins élégante que les autres méthodes. Certaines personnes vont être déroutées par un lien dont l’intitulé est une seule lettre. D’autres vont tout simplement l’ignorer. Vous pouvez utiliser cette méthode, mais seulement si vous avez une bonne raison de rejeter les autres.

WebAIM est une initiative de :
Center for Persons with Disabilities (CPD) Utah State University

Copyright 1999-2009 WebAIM

Haut de la page