1174 sujets

Accessibilité du Web

Pages :
Bonjour à tous,

J'avance pas à pas dans "l'accessibilité" et j'arrive à ces fameux : "tabindex"

Alors, il y a beaucoup de littérature concernant toutes ces fonctionnalités, des controverses mais, le principe de base n'est pas facile à dégager.

A la base, s'agit-il de donner un ordre aux tabulations ?

Si oui, l'ordre est celui de la navigation du site, je suppose, avec des affectations d'usage comme pour les accesskey ...

Et quid des liens dans la page ?

Question subsidiaire :

En fait, je ne parviens pas à utiliser les accesskey : cela ne marche pas chez moi. Ce qui rend tout cela difficile à expérimenter !


Smiley ohwell
Modifié par Vero (21 Jul 2005 - 10:25)
Une chose est sur à partir du moment ou il sont utilisés ils doivent l'être partout et comme le dit jpv dans un de ces messages cest assez contraignant pour les gérer d'ailleurs sur web-pour-tous je me suis obstiné et un retour en arriere risque de ce faire car c'est vrai c'est galère et montre des limites.

En fait je les avais mis car le menu se trouvais avant le contenu dans le flux normal de la page et leur présence permettait de mettre le contenu en premier dans l'ordre de tabulation mais ce n'est pas une bonne solution (ou à éviter autant que possible) je pense, et maintenant je comprends pourquoi.

Je suis en train de faire un petit site ou je ne les ai pas utilisées et je ne m'en porte pas plus mal c'est une prise de tête en moins.

l'ordre de tabulation naturel (flux) du site est celui-ci.

barre_accessibilité
header (logo lien)
recherche
contenu
menu
footer

Par contre si tu les utilisent toujours bien vérifier l'ordre de la tabulation sur ta page y'as des surprises des fois Smiley biggrin .
Modifié par knarf (20 Jul 2005 - 06:34)
Pour compléter l'intervention de JPV sur les tabindex, signalée dans le message ci-dessus :

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.

L'attribut "tabindex" permet de modifier ce parcours "naturel".

Il s'applique aux élément A, AREA, BUTTON, INPUT, OBJECT, SELECT et TEXTAREA.

- la "tabulation" commencera alors par l'élément portant le tabindex le plus petit,

- elle suivra l'ordre croissant des tabindex, qui n'a pas à être une suite continue : on peut passer directement de tabindex=1 à tabindex=100. Cela est très utile, car des tabindex continus m'obligeraien à reprendre toute la numérotation si j'ajoute après coup un lien quelque-part dans ma liste...

- quand la "tabulation" a épuisé tous les éléments ayant un attribut "tabindex", elle continue son parcours en revenant au début de l'ordre des éléments HTML, au premier lien dénué de tabindex.

Imaginons que j'ai au milieu de mon HTML un formulaire où l'ordre naturel de tabulation ne me satisfait pas : forcer un ordre plus satisfaisant à l'aide des tabindex sera en fait une mauvaise idée, car :
- je bouleverse en fait tout l'ordre de tabulation dans ma page, puisque celle-ci va désormais commencer par le formulaire, puis reprendre au premier lien ou contrôle dénué de tabindex (Quand elle arivera à nouveau au formulaire, elle "sautera" celui-ci).
- je dois donc prendre en compte les tabindex pour la totalité de mes liens et contrôles.

En fait, ce que je dois corriger, c'est la structure du formulaire fautif dont l'ordre de tabulation "naturel" n'est pas cohérente : plutôt que de soigner le symptôme, je dois traiter directement la cause structurelle...

Pour l'utilisation des accesskeys, chaque navigateur a ses petites particularités Smiley cligne
L'article http://www.openweb.eu.org/articles/accesskey_essai_non_transforme/ contient une liste de celles-ci, qui est à jour, si tout va bien Smiley cligne
(Si ce n'est pas le cas, je vous serais très reconnaissant de me le signaler ! Smiley smile )

Il omet cependant de préciser que l'utilisation du "pavé numérique" est très souvent problématique, voire impossible-, car celui-ci ne renvoit pas à l'application le "bon" code de touche : il faut passer par les nombres accessibles avec la touche majuscule.

Si tu trouves à l'usage que ça finit par faire mal aux doigts à force d'acrobaties sur ton clavier... c'est que tu as trouvé l'une des limitations les plus patentes des accesskeys : ces acrobaties sont tout aussi inaccessibles à certains handicapés moteurs à qui les accesskeys (et la tablation) sont supposés offrir un moyen de contourner l'impossible utilisation de la souris Smiley lol

Bref, accesskeys et tabindex sont deux mécanismes finalement très problématiques, sur lesquels il ne fait absolument pas compter pour corriger en surface un problème d'accessibilité lié à la structure du document.

Dans un avenir lointain, XHTML2.0 offrira peut-être des mécanismes plus pertinents, car permettant une adaptation côté client en fonction de ses contraintes et particularités.
Modifié par Laurent Denis (20 Jul 2005 - 07:22)
a écrit :
Bref, accesskeys et tabindex sont deux mécanismes finalement très problématiques, sur lesquels il ne fait absolument pas compter pour corriger en surface un problème d'accessibilité lié à la structure du document.


Salut Laurent,

cela signifie-t-il qu'on peut ne pas se casser la tête avec cela, du point de vue de l'accessibilité? Est-ce superflu, ou doit-on l'intégrer à une page?
Bonjour,

Généralement, les tabindex sont superflus, en tout cas il n'y à aucune nécessité à les utiliser si l'ordre de tabulation naturel est satisfaisant.

Dans le cas inverse mieux vaut reflechir sur la structure et/ou implémenter des liens d'évitements ou une TOC.

En revanche, les accesskeys, malgrés les limitations du système, sont beaucoup plus utiles car leur usage est généralisé et habituel.

la liste de l'ADAE/accessiweb devrait faire référence.

Donc on peut s'attendre à ce qu'ils soient attendus par un utilisateur, au moins pour trois d'entres eux : 0 pour l'aide, 1 pour la page d'accueil et 4 pour le moteur de recherche interne auxquels on peut ajouter 3 pour la carte du site et 7 pour le contact technique si ça se justifie.

Ceux là devraient toujours être présent.

JP
Modifié par jpv (20 Jul 2005 - 09:40)
Je pense qu'en réfléchissant bien à l'ordre des éléments dans le code (ce qui est, selon moi, différent de la structure de la page), on peut se passer des tabindex. Sauf cas particulier Smiley cligne (je me sens d'humeur normande, décidément, ce matin!)

Quant aux accesskeys... je suis assez partisan de leur utilisation... limitée. Cela ne fait que quelques octets de plus dans la page, et peut être utile si on les connaît dans une page; cela ne gêne en outre pas les gens qui ne les utilisent pas ou ne connaissent pas leur existence (au contraire des tabindex).
En revanche, je pense qu'il vaut mieux se limiter à des accesskeys "standards" (pas de lettre, quelques chiffres...) afin de ne pas entrer en conflit avec les raccourcis clavier des navigateurs (exemple sur le formulaire de saisie que j'utilise en ce moment: accesskey="s", qui court-circuite chez moi mon extension Sage sur FireFox...)
Modifié par Gilles (20 Jul 2005 - 09:38)
Cette belle unanimité mérite d'être soulignée Smiley biggrin

- tabindex : pas nécessaire si l'ordre des éléments dans le code est bon. Sinon, revoir d'abord l'ordre en question

- accesskey : l'ajout systématique des accesskeys numériques les plus généralement admis est profitable, en visant les 3 cités par jpv, en étendant éventuellement aux autres accesskeys numériques listés par accessiweb-ADAE (qui sont également ceux des sites publics en Grande-Bretagne, d'ailleurs)
Laurent Denis a écrit :
Cette belle unanimité mérite d'être soulignée


... et d'être remerciée !
Smiley biggrin

J'ai enfin réussi à faire fonctionner les accesskeys : effectivement, cela ne marche pas avec le pavé numérique, il faut donc activer les majuscules ou utiliser la combinaison des 3 touches (shift/alt + numero). Ceci est d'ailleurs expliqué sur la page "accessibilité" d'alsa que je n'avais pas lue jusqu'au bout (la vilaine !)

A l'occasion, j'ai découvert également le moyen de passer le clavier en qwerty, sans le vouloir, ce qui peut s'avérer "très pratique" pour la suite !

Smiley murf

Concernant les tabindex, je me félicite, d'une part d'avoir posé la question de base (à quoi cela sert-il ?) et d'autre part d'avoir bien réflechi en montant la structure de mon site : j'ai décidé que nous n'en n'aurons pas besoin ! (hum ...)

Par contre, je rencontre un problème sous Opéra avec les tabulations : je reste bloquée sur le moteur de recherche ?

Dois-je supposer que j'arrive (enfin) sur le fameux problème de focus, qui ne concerne donc, que les formulaires ?!

(Chacun son rythme, l'essentiel est de participer !
Smiley lol )
Ce qui est amusant à propos des tabindex c'est que quand on n'en met pas, le validateur du site accès pour tous nous gratifie d'un avertissement pour s'assurer que l'omission est bien voulue.

En tout état de cause c'est le contraire qui devrait se produire :

si tabindex alors avertissement pour s'assurer qu'une structuration plus rigoureuse du document n'aurait pas permis de s'en passer.
Modifié par clb56 (20 Jul 2005 - 14:37)
Smiley ohwell ... Et moi qui me prend la tête avec les tabindex, croyant bien faire, alors que les menus s'affichent à l'écran dans le bon ordre Smiley biggol
dominique a écrit :
Smiley ohwell ... Et moi qui me prend la tête avec les tabindex, croyant bien faire, alors que les menus s'affichent à l'écran dans le bon ordre Smiley biggol


Smiley lol
Bonjour,

a écrit :
Par contre, je rencontre un problème sous Opéra avec les tabulations : je reste bloquée sur le moteur de recherche ?


Rien à voir, c'est juste qu'opéra à une manière différente de gérer la navigation tabulaire, la touche tabulation ne concerne que les controles de formulaires.

Pour la navigation sur les autres éléments il y à deux touches dédiées A et Q.

JP
Haaaa !

Il faut avoir de l'oreille pour écouter Opéra !

Ce navigateur est ... "impressionnant". J'y arrive à petite dose ...

La fonction d'agrandissement en % est top, je trouve.
Mais attention aux images "qui déchirent" !

Pour les tests, c'est devenu ma préférence ... mais pour surfer, je suis encore trop petite !

Smiley biggrin
clb56 a écrit :
Ce qui est amusant à propos des tabindex c'est que quand on n'en met pas, le validateur du site accès pour tous nous gratifie d'un avertissement pour s'assurer que l'omission est bien voulue.

En tout état de cause c'est le contraire qui devrait se produire


Oui, c'est une des problèmes de ce validateur. Qui a cependant prouvé régulièrement qu'il était non seulement perfectible, mais en train de le faire Smiley cligne
Vero a écrit :
Haaaa !

Il faut avoir de l'oreille pour écouter Opéra !

Ce navigateur est ... "impressionnant". J'y arrive à petite dose ...


lol

C'est off-topic, et il faudrait peut-être en rediscuter ailleurs. Mais c'est vrai que, depuis tout le temps où je l'utilise, je ne sais toujours pas si ce n'est pas une sorte de navigateur pour "powered user".

A côté de cela, il est aussi d'une telle simplicité qu'il est merveilleux dans le cadre scolaire.

Bon, une sorte de "Bang & Olufsen" du navigateur, avec les défauts et les qualités de ce type de design industriel, disons Smiley cligne

Mais en tous cas, la navigation au clavier dans Opera est un bitonio très particulier (entièrement reconfigurable, à propos).
Modifié par Laurent Denis (20 Jul 2005 - 16:40)
clb56 a écrit :
Ce qui est amusant à propos des tabindex c'est que quand on n'en met pas, le validateur du site accès pour tous nous gratifie d'un avertissement pour s'assurer que l'omission est bien voulue.

En tout état de cause c'est le contraire qui devrait se produire :

si tabindex alors avertissement pour s'assurer qu'une structuration plus rigoureuse du document n'aurait pas permis de s'en passer.


Si je suis ton raisonnement, les sites qui ont une navigation au clavier merdique et pas de tabindex n'auraient droit à aucun avertisement. Si un webmestre met des tabindex de partout et qu'il valide son site je m'autorise a penser que c'est le résultat d'une démarche réfléchie de sa part (donc pas de message) par contre si il n'y a que quelque tabindex, je lui demande de vérifier si tout fonctionne bien.
Et puis tant qu'on parle du validateur, je rappelle que celui-ci est libre, opensource, sous licence GPL pour le script et que les pages sur lesquelles le validateur renvoie sont librement modifiables par tout un chacun (wiki) et sous licence Creative Common. Donc n'hésitez pas a participer.
http://validateur-accessibilite.apinc.org
Modifié par stephkup (20 Jul 2005 - 16:50)
Laurent Denis a écrit :

Oui, c'est une des problèmes de ce validateur. Qui a cependant prouvé régulièrement qu'il était non seulement perfectible, mais en train de le faire Smiley cligne


Pas compris Smiley decu
Pour les tabindex j'ai répondu par ailleurs et je suis loin d'être convaincu de leur inutilité.
On peut facilement s'en passer si le site est full css, si les infos arrivent dans le bon ordre, si la page contient des liens d'évitement, si ces liens d'évitement ne sont pas masqués... ça fait beaucoup de si. C'est jouable si cette problématique de navigation est prise en compte dés le début mais c'est loin d'être une généralité.
Ajouter des tabindex sur une page existante est relativement simple, en tous cas beaucoup plus facile que de reprendre la conception de a jusqu'à z.
Pour les sites avec des tableaux pour la présentation, et on en a encore pour encore un paquet d'années, dans 90 % des cas on trouve un schéma type : haut de page, menu gauche trop long, corps de la page, menu de droite trop long, pied de page et l'info importante est perdue au millieu du reste. Les liens d'évitements permettent de contourner le problème mais je ne pense pas que cela soit la solution universelle, les tabindex ont l'avantage de ne pas se voir (comme ça on reste copain avec les graphistes Smiley cligne ).
Là, j'ai l'impression qu'on mélange 2 choses : information utile et moyens d'y acceder ...

Je ne suis pas convaincue que les tabindex vont résoudre un problème d'ergonomie sur une page mal formée ... quoique, peut-être en conduisant le visiteur vers l'information utile ...

Tant pis pour le voyant !
a écrit :

Ajouter des tabindex sur une page existante est relativement simple, en tous cas beaucoup plus facile que de reprendre la conception de a jusqu'à z.


Plus le site est complexe et fourni plus cela risque d'être une vraie galére pour mettre en place une navigation par tabindex, de plus si comme l'as souligné jpv ce site génére du contenu dynamiquement, je ne suis pas certains que la réorganisation de celui ci (le site) prendras plus de temps que de rajouter une navigation par tabindex.

Un seul tabindex oublié et c'est toute la navigation qui est en vrac donc une attention de tous les instants.

C'est encore pire si plusieurs personnes on accés au contenu, dans le cas d'un CMS par exemple.

C'est pareil, je n'y connais pas grand chose en wiki mais si des tabindex sont généré dynamiquement pour des liens une syntaxe wiki les prendra elle en compte?

EDIT:

a écrit :

Dans le cas inverse mieux vaut reflechir sur la structure et/ou implémenter des liens d'évitements ou une TOC


Je crois que c'est effectivement une solution permettant de palier à une mauvaise organisation de la structure du site sans pour autant touché à son propre flux.

Pour moi une TOC (table des matières) fait plus référence à du contenu mais pourquoi ne pas l'utiliser également pour donner un acces rapide à n'importe quels menus dans la page si ceux-ci sont nombreux et interminables une TOM (table des menus) Smiley smile .

Un lien d'évitement dans la barre d'accessibilité dans le cas de 2 colonnes de menu ne donneras acces qu'as une colonne donc ne réglera pas tout.

Aprés il faut connaitre le rapport gain-->gène d'un tel pré-menu.
Modifié par knarf (20 Jul 2005 - 20:02)
Bonsoir et Merci vous ne pouvez pas savoir comment vous me rassurer à propos des "tabindex" (presque) inutiles ^^
J'ai passé la soirée à me creuser la tète et en dernier recours j'ai mis un petit coup de "tabindex"+"liste" dans google et voila que je tombe sur votre message Smiley eek
Je passe actuellement une grosse partie de mon temps sur l'excellent forum Alsacreation et me suis apercu que j'étais une grosse bille et que je n'avais meme pas remarqué que quand je lancais une recherche sur le forum je cherchais uniquement dans "les sujets des messages" et non dans "les contenus des messages" ou j'aurais certainement trouvé mon bonheur rapidement Smiley langue

Donc franchement ca m'arrange que l'on puisses eviter de mettre des tabindex si cela n'est pas indispensable Smiley ravi

Par contre les "accesskey" je trouve vraiment cela tres bien et je ne suis pas le seul tout sur les acceskey
Modifié par webphn (29 Sep 2005 - 03:39)
Pages :