Résultats du Quiz Accessibilité

Quelle initiative menée par le W3C est chargée des questions d'accessibilité numérique ?

• DGME
• Wii
• WCAG
• WAI
• ADAE

C'est la Web Accessibily Initiative (WAI) qui se charge des questions d'accessibilité numérique.
La WAI publie un document de travail, les Web Content Accessibility Guidelines (WCAG), qui regroupent les critères d'accessibilité et les points de contrôle.
L'ADAE (Agence pour le développement de l’administration électronique) est/fut l'organisme gouvernemental français chargé de l'accessibilité numérique sur le territoire.
Depuis fin 2005, l'ADAE a été rattachée à une direction du MINEFI, la DGME (Direction Générale pour la Modernisation de l'Etat).

En règle générale, quels outils sont employés par les personnes non-voyantes pour naviguer sur Internet ?

• Un correcteur optique
• Une synthèse vocale et/ou une plage braille
• Une souris détectant les liens sur les pages
• Un écran en relief

L'utilisateur aveugle peut utiliser un navigateur moderne ou texte associé à un synthétiseur vocal (IBM Home Page Reader, JAWS), aussi appelés lecteurs d'écran (screen-reader) ou une plage Braille (qui restitue sous forme de matrice de picots les caractères Braille).
Dans ce cas de la plage Braille, seul le texte est restitué. Dans le cas des lecteurs d'écrans, certaines versions offrent la possibilité de restituer certains types de texte de façon différentes (utilisation de plusieurs voix), à vitesse variable.

Source OpenWeb.

Pour des raisons d'accessibilité, le W3C a supprimé la balise table en HTML.

• C'est parfaitement Vrai
• C'est complètement Faux
• Uniquement le vendredi
• Le kiwi mange des bananes

C'est bien évidemment faux : la balise "table" est un élément dont la fonction est de présenter des informations sous forme de cellules associées en lignes et/ou en colonnes. Il est cependant déconseillé pour la mise en page, notamment lorsqu'il n'est pas linéarisable à la lecture vocale.

Plus d'info dans le Guide Accessiweb.

Quel problème d'accessibilité pose la règle suivante : #page {background:url(fond-noir.png); color:white;}

• Tous les navigateurs ne comprennent pas la valeur "white" pour l'attribut color, et pourraient afficher le texte en noir sur fond noir.
• Le texte blanc sur fond noir n'est pas très lisible.
• Si l'image de fond n'est pas chargée ou est désactivée par l'utilisateur, le texte s'affichera probablement en blanc sur fond blanc.
• De toute façon, ça marchera chez la quasi-totalité des utilisateurs, pas besoin de se monter le bourrichon.

La réponse est la proposition 3. Dans le code donné, on attribue à un bloc une image de fond sombre, et une couleur de texte blanche. On peut donc supposer que le contraste entre la couleur du texte et celle du fond sera suffisant pour garantir une bonne lisibilité.
Cependant, il est possible que l'image de fond ne s'affiche pas : image indisponible sur le serveur, serveur temporairement peu performant, connexion internet de l'utilisateur défaillante. Sans oublier que la plupart des navigateurs permettent de désactiver le chargement des images. Bref, on n'est jamais sûr que l'image sera chargée. Et si l'image de fond n'est pas chargée, le fond ne sera pas noir mais transparent ! On court donc le risque d'avoir un texte illisible, par exemple en blanc sur fond blanc.

La solution est donc de préciser également une couleur de fond, et pas juste une image de fond. Voici le même code que ci-dessus, mais corrigé pour tenir compte de cette contrainte :

#page {background: black url(fond-noir.png) repeat; color: white;}

Dans quel cas le code suivant posera-t-il des problèmes d'accessibilité ?
<a id="lien" href="index.html" title="Page d'accueil"> </a>
#lien { background-image: url('icone-home.png'); }

• Proposition A :
  Les utilisateurs ayant désactivé les images
• Proposition B :
  Les utilisateurs sans support de CSS
• Proposition C :
  Les utilisateurs d'un lecteur d'écran tel que Jaws
• Proposition D :
  Les utilisateurs ayant désactivé l'affichage des couleurs
• Propositions A, B, C, D et plus si affinités
• Tous sauf A, B et C

Le lien est vide de contenu. Il n'existe que grâce à son arrière-plan en image.

Ce genre de techniques posera des soucis à une large partie de la population, à commencer par les utilisateurs de lecteurs d'écran dont la configuration ne permet pas la lecture des title, ou les utilisateurs de traducteurs automatiques.

Les utilisateurs ayant désactivé les images ou les styles n'auront aucun rendu de ce lien.
Même si par défaut Jaws lit le contenu du title, rien n'empêche l'utilisateur de désactiver ce comportement. Il ne faut pas se baser sur un utilisateur Jaws "moyen" : potentiellement, cette technique n'est pas suffisante pour les utilisateurs non voyants. Il est toujours conseillé de placer du contenu textuel réel au sein des liens.

A qui le texte inclus dans l'attribut "alt" des images sera utile s'il est bien renseigné ?

• A : Aux utilisateurs de lecteurs d'écran tels que Jaws
• B : Aux moteurs de recherche comme Google
• C : Aux utilisateurs de navigateurs ne supportant pas le CSS
• D : Aux utilisateurs qui emploient un navigateur en mode texte de type Lynx
• E : Aux utilisateurs qui ont désactivé l'affichage des images
• Réponses A, B, D, E

Réponse : A, B, D, E

L'attribut "alt" indique un texte alternatif au sein de l'élément <img>. Ce contenu est primordial pour les agents utilisateurs non graphiques, les moteurs de recherche et les lecteurs d'écran pour qui il s'agit souvent de la seule information véhiculée par l'image.
La désactivation des styles CSS n'a aucune influence sur le contenu transmis pat cet attribut.

Pourquoi est-il préférable de doubler les a:hover par des a:focus ?

• Pour faciliter l'accès au lien sans la souris
• Pour des raisons de compatibilités entre les navigateurs
• Pour les lecteurs vocaux
• La Ford Focus a des actions au sein du W3C

Tous les utilisateurs ne naviguent pas exclusivement à l'aide de la souris. Il existe de très nombreux autres moyens de navigation dont le clavier, des contacteurs, la voix, etc.
Ajouter aux liens la pseudo-classe "focus" permet de ne pas se limiter à une navigation à la souris.

Découvrez différentes aides techniques pour les personnes handicapées.

Dans une démarche d'accessibilité, quelle solution d'ouverture de popup (nouvelle fenêtre) serait à privilégier parmi celles-ci ?

• <a href="page.html" target="_blank">Lien</a>
• <a href="javascript:void(window.open('page.html'));">Lien</a>
• <a href="page.html" onclick="return !window.open(this.href);">Lien</a>
• Dans une réelle démarche d'accessibilité, aucune des solutions précédentes n'est à privilégier.

Dans une réelle démarche d'accessibilité (et non de validité), aucune des solutions précédentes n'est à privilégier. Même si cela ne relève pas d'un critère WCAG particulier, forcer l'ouverture d'une page dans une nouvelle fenêtre va à l'encontre de la navigation par défaut de l'utilisateur.
Il convient donc de laisser le visiteur libre de sa navigation, ou de lui indiquer clairement lorsqu'un lien ouvre une nouvelle fenêtre.

Plus d'information dans le Guide Accessiweb.

A qui profitent les liens d'évitement placés en haut de page ("Aller au menu", "Aller au contenu", "Aller à la recherche",...) ?

• Aux personnes ayant des problèmes moteur
• A ceux qui ne peuvent pas utiliser de souris
• Aux personnes non-voyantes
• Tous les internautes
• Une kipa surgelée

Contrairement à certaines idées reçues, les liens d'évitement ne servent pas uniquement aux personnes non voyantes.
Cela peut concerner aussi par exemple des personnes en situation de handicap cognitif, ou des utilisateurs de dispositifs d'agrandissement, ou des utilisateurs n'ayant pas de handicap moteur et ayant un dispositif de pointage inhabituel pour eux et d'utilisation malaisée. Cette liste est loin d'être exhaustive.
Potentiellement, ils peuvent être utiles à chacun d'entre nous. Il faut donc éviter de les masquer.

L'attribut "tabindex" permet :

• De créer un index (plan) du site
• De créer le parcours naturel de tabulation
• De modifier le parcours naturel de tabulation
• De concevoir des tableaux sans cellules
• De forcer la navigation uniquement avec son index

La touche "tabulation" permet, dans la grande partie des navigateurs, de parcourir les liens et contrôles de formulaires dans l'ordre où ils apparaissent dans le code HTML et constitue donc une alternative de navigation à l'aide du clavier.
L'attribut "tabindex" permet de modifier ce parcours "naturel". Pour diverses raisons, l'usage de l`'attribut tabindex est déconseillé si l'on n'en maîtrise pas les conséquences.