L’accessibilité pour les rédacteurs : les manuels de logiciels

J’ai finalement publié cette traduction de mon article de décembre 2004 sur l’accessibilité.

L’une des améliorations les plus importantes pouvant être réalisée pour l’accessibilité d’un site est une tâche qui échappera souvent aux rédacteurs. Ajouter du texte pour décrire des images permet aux non-voyants et aux déficients visuels d’accéder au contenu de votre page, mais écrire n’est pas forcément quelque chose d’inné. Les conseils énoncés ici vous aideront à débuter et à éviter les erreurs fréquentes.

Si le logiciel sur lequel vous êtes en train d’écrire n’est pas encore accessible, il peut être utile de considérer les difficultés de parents non-voyants essayant d’aider leur enfant qui ne l’est pas. Ou un non-voyant et son épouse qui, elle, voit parfaitement bien, apprenant ensemble à se servir d’un logiciel d’impôts. Les gens auraient tendance à penser qu’un site qui vend des télévisions n’a pas besoin d’être accessible puisque les non-voyants ne peuvent pas la regarder. Pourtant il est tout de même possible qu’ils veuillent en acheter une pour quelqu’un de leur famille ou pour un ami. En effet, même si l’application en elle-même n’est pas ou ne peut pas être conçue de manière accessible, le manuel d’utilisation, quant à lui, pourrait et devrait l’être. Cependant, dans la mesure où le logiciel peut être manipulé par un visiteur handicapé, de longues descriptions devraient décrire et expliquer comment un utilisateur non-voyant peut utiliser le logiciel.

Il existe trois options pour ajouter du texte aux images :

  1. Un texte alternatif – la caractéristique la plus simple et la plus importante à ajouter pour une accessibilité supplémentaire.
    L’information essentielle est incluse dans la description alternative. Elle est spécifiée par l’attribut alt=”[tapez l'information essentielle ici]”
  2. Un titre – utilisé pour apporter un plus à vos descriptions.
    Vous pouvez être plus créatif avec le titre. Il est déterminé par l’attribut title=”[entrez ici une information complémentaire plus longue et plus créative]”

  3. Une longue description – avec des images complexes comme les screen shots (capture d’écran) ou les images qui véhiculent de nombreuses significations chez le spectateur, on utilise une longue description.
    Elle est déterminée par l’utilisation de l’attribut longdesc=”[entrez ici l'url d'une longue description]”

Texte alternatif

Pink Water lillies and blue pads

Vous avez probablement déjà remarqué que Macromedia Contribute vous incite à utiliser du texte alternatif quand vous insérez des images, mais peut-être n’êtes vous pas sûr à 100% de la manière dont le texte approprié devrait être rédigé.

Le texte alternatif doit être utilisé pour décrire ce qu’est, ce que représente ou ce que fait une chose. Par exemple, cette photo des fleurs pourrait correspondre au texte alternatif “fleurs violet sur le lac leman”. Un texte alternatif doit être le résumé en quelques mots de ce qu’est la photo.

La réglementation indiquée dans la loi pour l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées exige que “tout type d’information sous forme numérique” doit être accessible par tous, “quels que soient le moyen d’accès, les contenus et le mode de consultation”. Donc ce texte doit être l’équivalent de ce qu’une personne non déficiente verrait, mais il ne doit pas être trop long, ni trop vague. La difficulté est de trouver l’équilibre entre exactitude et brièveté.

Le texte alternatif ne doit jamais dépasser les 1024 caractères. En général, il ne doit être composé que de quelques mots. Il est important de garder en tête que tout ce qui est sur une page doit pouvoir être lu à haute voix par quelqu’un qui ne peut pas voir l’écran.

Peut-être vous êtes vous demandé “que fait une chose”, comment une image peut “faire” quelque chose? Parfois certaines images ont une fonction précise comme servir de lien vers une autre page. Dans ce cas, le texte alternatif doit prévenir l’utilisateur de ce qui arrivera s’il suit le lien. Par exemple si le lien pointe vers une page concernant les voyages en Haute Savoie, le texte alternatif devra être “Choissisez votre voyage en Haute Savoie” ou quelque chose de similaire.

Les erreurs fréquentes:

dans votre texte alternatif il ne faut jamais utiliser l’expression “image de” ou “lien vers”. Le screen reader (programme de lecture d’écran) aura déjà informé l’utilisateur que le texte se rapporte à un lien ou une photo. Il est facile d’imaginer l’exaspération de l’utilisateur qui entendrait deux fois la même chose à chaque fois qu’il serait confronté à une image.

Le texte alternatif doit absolument être utilisé pour toutes les images, et ce à chaque fois. Néanmoins, il existe des cas où une image n’a pas vraiment de fonction. Par exemple, des images utilisées uniquement pour l’agencement de la page (layout) comme les cadres, les règles, les textures, les angles arrondis ou encore les logos. Dans ce cas, vous devez utilisez l’attribut alt=”” . Cela fera comprendre au screen reader qu’il ne faut pas tenir compte de l’image. Si vous ne mentionnez pas cet attribut pour les images du layout, l’utilisateur entendra à n’en plus finir IMAGE IMAGE IMAGE, et il se demandera ce qui lui échappe.

Tour Button Le texte alternatif devrait toujours être envisagé dans le contexte du document dont il fait partie. Par exemple, les manuels explicatifs de logiciels présentent souvent des boutons et des descriptions de ces boutons. Dans ce programme, le texte alternatif pourrait être “faire une visite” ou “visite du lecteur”, mais dans le cas d’un guide à propos du logiciel, le texte alternatif devrait être “bouton pour faire une visite” ou quelque chose de semblable. Le plus important est que l’utilisateur soit capable d’identifier le bouton et d’appliquer cette information pour utiliser le logiciel.

Pour les screen shots, où on insèrera également une longue description, le texte alternatif devra être “screen shot de la bibliothèque – longue description”. Cela permettra à l’utilisateur de savoir que l’image est à la fois un screen shot de la bibliothèque et un lien vers sa longue description.

Longue description

Ces descriptions sont des pages web à part, utilisées pour décrire des images complexes comme les screen shots qui ne peuvent être complètement résumés par leur texte alternatif ou par leur contexte.

Title Page Screenshot - long description

Pour faciliter leur identification, Joe Clark suggère de garder les longues descriptions dans le même répertoire et de les nommer comme l’image qu’elles décrivent, en ajoutant -LD à la fin du nom du fichier. Par exemple, l’image “TitrePage.png” aurait une page de description nommée “TitrePage-LD.html“.

Ces descriptions sont de simples textes qui utilisent des mots pour décrire ce que l’utilisateur ne peut pas voir. Le titre devrait être “Longue description pour TitrePage.png”

Screen shots:

Suivez ces indications lorsque vous rédigez des descriptions de screen shots.

Vous pouvez observer un exemple de description en cliquant sur l’image du dessus.

  • Décrivez ce que vous voyez.
  • Imaginez que vous êtes un professeur non-voyant qui essaie d’expliquer à un de ses élèves comment se servir de cet écran particulier. Qu’a-t-il besoin de savoir? Expliquez à l’élève comment trouver les différentes fonctions en utilisant seulement des mots.
  • Travaillez en partant du coin supérieur gauche jusqu’au coin inférieur droit, et décrivez les choses dans l’ordre. (puisque le français se lit de gauche à droite et puisque nous écrivons en français)
  • Lorsque certaines parties du screen shot se présentent sous forme de tableaux ou de listes, décrivez les comme telles.
  • Pour rendre la lecture de vos descriptions plus facile, utilisez des groupements de mots comme des colonnes, des lignes, des barres de navigation etc., pour séparer les différentes parties relatives au screen shot.
  • Le langage utilisé doit correspondre à l’image. Des screen shots administratifs doivent être décrits avec un langage fonctionnel, alors qu’un screen shot amusant doit être décrit avec plus de détails.
  • Rapportez vous aux couleurs, aux formes ou à d’autres moyens de présentation qui pourraient aider un professeur ou un parent non-voyant pour expliquer à un élève ce qu’il faut chercher.
  • Evitez d’écrire plusieurs fois la même chose. Si vous avez déjà rédigé une longue description pour la bibliothèque et qu’ensuite vous écrivez une autre description pour un élément en particulier à l’intérieur de la bibliothèque, il est suffisant d’utiliser une expression comme “dans la partie supérieure, à l’intérieur d’une barre jaune, on retrouve des éléments de navigation qui sont présents dans toute la bibliothèque”. Il suffit ensuite de mettre le mot ” bibliothèque” en lien vers la description plus générale de la bibliothèque.
  • La longue description est utilisée pour rendre l’image utile dans son contexte. S’il est absolument nécessaire de rendre la description plus intelligible, vous pouvez éventuellement inclure des informations qui sont déjà citées dans le texte du document, mais en général cela n’est pas indispensable.

Images générales

A lire : les conseils de Joe Clarks sur comment écrire une longue description pour une photo (anglais).
Cet article aborde l’écriture des descriptions pour les screen shots. Sa façon d’aborder le sujet peut vous aider à comprendre quelles informations sont à inclure ou non.

One thought on “L’accessibilité pour les rédacteurs : les manuels de logiciels”

Comments are closed.