1178 sujets

Accessibilité du Web

Tester l'accessibilité d'un site

Pages :
En n'affichant pas les images (c'est tout ce que j'arrive à faire, faudra que je trouve un tuto pour stopper le CSS et javascript Smiley cligne ) , la partie à droite va sous le texte du centre avec IE6 sous 2000.

Le titres des menus de gauche ne sont pas très lisibles en vert clair sur fond blanc (patinoire, en ligne)
Bonjour,

Je verrais un premier problème à régler : je suis perdu dans l'ordre de tabulation des liens à partir du aller au contenu : dans IE, le contenu prend le focus "visuel", mais pas le focus "actif". autrement dit, la tabulation suivante me ramène au menu d'accessibilité, au lieu de me mettre sur le premier lien du contenu.

Solutions a priori (je n'ai pas regardé le code) : dimensionner l'élément conteneur de l'ancre (c'est idiot, je sais. C'est un hack). Ou utiliser une ancre complète.
Il n'y a pas d'ordre au niveau des tabulations (pas de tabindex d'après ce que j'ai vu) et donc impossible d'utiliser la tabulation sous Opera.

Si l'on Zoom à 150, la mise en forme est complètement cassé.

En mode texte (sous Lynx), le fait d'avoir tous les items du menu en premier est plutôt génant. Exemple, je clique sur l'item Recherche, j'arrive sur la page Recherche et je dois descendre en bas de page pour voir le formulaire de recherche et les champs.

Idem pour l'info "fil d'ariane" qui se trouve dans la partie basse du site après tous les items de menu. Cela n'a plus vraiment d'uitlité.

Cordialement, Eric.
Eric a écrit :
Il n'y a pas d'ordre au niveau des tabulations (pas de tabindex d'après ce que j'ai vu) et donc impossible d'utiliser la tabulation sous Opera..


petite confusion, il me semble : Opera n'a pas besoin de tabindex pour exploiter la tabulation. En revanche, la navigation clavier sous Opera n'utilise pas du tout les mêmes touches que sur les autres navigateurs (voir l'aide de ce navigateur)

(Par ailleurs, mieux vaut éviter de mettre des tabindex si on peut l'éviter : ils peuvent créer plus de confusion qu'autres choses si on modifie maladroitement l'ordre de tabulation naturel)

<edit>Dans le même ordre d'idée, les accesskeys non numérique neutralisent les racourcis clavier correspondant dans les applications clients : dans IE, par exemple, les accesskeys a et e supprime l'accès clavier aux menus affichage et édition d'IE... Mieux vaut s'en tenir aux seuls accesskeys numériques, et les limiter aux pages types indiquées dans le référentiel AccessiWeb/ADAE...
Modifié par Laurent Denis (15 Jul 2005 - 13:40)
Administrateur
Laurent Denis a écrit :
et les limiter aux pages types indiquées dans le référentiel AccessiWeb/ADAE...

Tiens, ces pages-types m'intéressent.
Pour l'instant, je me suis toujours basé sur les indications du site Acces-pour-tous, ce qui donne cette page de politique d'accessibilité, mais je n'avais jamais trouvé de "référentiel" plus officiel à ce sujet.
Tu as un lien ?
Bonjour,

Tout d'abord merci de vos remarques... je vais encore pouvoir avancer en accessibilité.

a écrit :
Je verrais un premier problème à régler : je suis perdu dans l'ordre de tabulation des liens à partir du aller au contenu : dans IE, le contenu prend le focus "visuel", mais pas le focus "actif". autrement dit, la tabulation suivante me ramène au menu d'accessibilité, au lieu de me mettre sur le premier lien du contenu.

Solutions a priori (je n'ai pas regardé le code) : dimensionner l'élément conteneur de l'ancre (c'est idiot, je sais. C'est un hack). Ou utiliser une ancre complète.


Ok, je viens de corriger ce petit problème... Smiley cligne
Modifié par artiloo (15 Jul 2005 - 14:41)
Laurent Denis a écrit :

petite confusion, il me semble : Opera n'a pas besoin de tabindex pour exploiter la tabulation. En revanche, la navigation clavier sous Opera n'utilise pas du tout les mêmes touches que sur les autres navigateurs (voir l'aide de ce navigateur)

Quelle drôle d'idée Smiley decu

Laurent Denis a écrit :

(Par ailleurs, mieux vaut éviter de mettre des tabindex si on peut l'éviter : ils peuvent créer plus de confusion qu'autres choses si on modifie maladroitement l'ordre de tabulation naturel)

C'est quoi "l'ordre naturel de tabulation" ?
Pour le 1er lien je pense instinctivement au lien "Aller au contenu" si le contenu n'est pas en premier dans le code. Pour la suite j'avoue que je ne voie pas quel pourrait être cet ordre naturel, cela dépend beaucoup de la page en question et de la structure générale du site.
Les tabindex étant un pilier important de la navigation au clavier je pense quant à moi qu'ils sont primordiaux. On peut s'en passer avec des sites full CSS si le contenu est systématiquement placé en premier dans le code source, par contre si le positionnement est effectué avec un tableau ( je sais c'est mal Smiley smile ) ils sont indispensables.
Administrateur
a écrit :
Quelle drôle d'idée
En fait, vu qu'il n'existe aucune règle établie à ce sujet, chacun peut faire comme il le souhaite. C'est bien le problème des accesskeys

a écrit :
C'est quoi "l'ordre naturel de tabulation" ?
C'est tout simplement l'ordre qui correspond au flux courant. Tu prends la structure HTML brute (sans mise en forme) et tu classes les liens dans l'ordre d'apparition dans cette structure.
Administrateur
Laurent a écrit :
Pour les accesskeys, la liste est aussi dispo (mais ce coup-ci, pas en pdf, en HTML cligne ) sur:
http://www.accessiweb.org/fr/Label_Accessibilite/criteres_accessiweb/92_accessiweb_lineaire/

J'ai beau chercher, je ne trouve aucune mention du terme accesskey dans cette page. Ni dans le chapitre des aides à la navigation, ni en effectuant une recherche sur toute la page Smiley decu

EDIT : oups, autant pour moi :
Accessiweb a écrit :
12.5 : Les liens importants du site comportent-ils des raccourcis claviers ?
Commentaire :
Les liens importants sont : "Page d'accueil", "Page d'aide", "Plan du site", "Moteur de recherche", "Glossaire", "Contacts". Les raccourcis clavier peuvent porter sur une combinaison de lettres et surtout de chiffres. La liste suivante est conseillée : - "s" : passer le menu, - "1" : page d'accueil, - "2" : page d'actualités, - "3" : plan du site, - "4" : moteur de recherche, - "5" : FAQ, - "6" : Page d'aide, - "7" : contact, - "8" : conditions d'utilisation, - "9" : livre d'or, - "0" : lien vers la liste des raccourcis clavier utilisés dans la page.
Niveau : Or

Modifié par Raphael (15 Jul 2005 - 15:06)
stephkup a écrit :

Quelle drôle d'idée Smiley decu


Disons que c'est le choix d'Opera Smiley cligne il a aussi ses avantages : par exemple, il n'est pas nécessaire de combiner deux touches pour "reculer" dans l'ordre de tabulation, à la différence de shift+tab. Ce qui simplifie la vie à certains handicapés moteurs Smiley cligne

stephkup a écrit :

C'est quoi "l'ordre naturel de tabulation" ?


L'ordre linéaire des liens dans le code HTML, que les navigateurs vont tous adopter en mode tabulation, sauf si on précise des tabindex.

S'il y a des tabindex, il se combine avec eux. Voir http://normand.no-ip.org/?2005/07/12/156-fonctionnement-des-tabindex qui donne une explication assez claire (en revanche, la conclusion de l'article est trop rapide, il me semble)

stephkup a écrit :

Les tabindex étant un pilier important de la navigation au clavier je pense quant à moi qu'ils sont primordiaux. On peut s'en passer avec des sites full CSS si le contenu est systématiquement placé en premier dans le code source, par contre si le positionnement est effectué avec un tableau ( je sais c'est mal Smiley smile ) ils sont indispensables.


pas forcément. C'est la linéarisation du tableau qu'il faut regarder : si l'ordre des liens linéarisés est cohérent, les tabindex sont inutiles.

Mais ce qui est tout à fait important, en effet, c'ests que l'ordre des "bouts" de la page dans le HTML soit cohérent. Pas forcément le contenu avant le menu, quoique ce soit généralement préférable pour d'autres raisons. Mais au moins pas deux menus avec un avant et un après le contenu, ou ce genre de choses.
Raphael a écrit :
En fait, vu qu'il n'existe aucune règle établie à ce sujet, chacun peut faire comme il le souhaite. C'est bien le problème des accesskeys

D'accord pour les accesskey mais là on parlait des tabindex, le fonctionnement courant, d'abord les tabindex du plus petit au plus grand puis les autres liens ou input dans l'ordre d'apparition dans le code source en sautant les tabindex, ne me paraissait pas être d'une logique évidente. J'aurais beaucoup préféré un fonctionnement du type : d'abord les tabindex du plus petit au plus grand puis le premier lien qui suit le dernier tabindex et ainsi de suite.
Pour revenir au site de l'agglo de Cholet, un petit changement de couleur sur le onfocus permettrait de mieux identifier le lien actif.
a écrit :
C'est quoi "l'ordre naturel de tabulation" ?
C'est tout simplement l'ordre qui correspond au flux courant. Tu prends la structure HTML brute (sans mise en forme) et tu classes les liens dans l'ordre d'apparition dans cette structure.
Je pensais plus à un truc du genre "de gauche à droite et en allant du haut vers le bas" comme la lecture sous nos contrées mais ce n'est pas si naturel que ça puisque que les pages sont découpées en colonnes.
Laurent peux-tu nous confirmer ce à quoi tu pensais ?
<edit>Les messages se sont croisés.
Modifié par stephkup (15 Jul 2005 - 15:32)
Laurent Denis a écrit :


petite confusion, il me semble : Opera n'a pas besoin de tabindex pour exploiter la tabulation. En revanche, la navigation clavier sous Opera n'utilise pas du tout les mêmes touches que sur les autres navigateurs (voir l'aide de ce navigateur)


Désolé Laurent, si il n'y a pas de tabindex, je ne peux pas naviguer (ou alors j'ai loupé qq chose au niveau des préférences - Opera 8.01). et dans l'exemple donné de la page d'acceuil, Opera se trouve bloqué sur le champ de recherche lorsque j'appuie sur la touche tabulation.

Pour les touches accesskey, effectivement depuis la version 7 on peut les utiliser avec maj echap lettre.

Eric
Modifié par Eric (15 Jul 2005 - 16:21)
Eric a écrit :


Désolé Laurent, si il n'y a pas de tabindex, je ne peux pas naviguer (ou alors j'ai loupé qq chose au niveau des préférences - Opera 8.01). et dans l'exemple donné de la page d'acceuil, Opera se trouve bloqué sur le champ de recherche lorsque j'appuie sur la touche tabulation.


Oui. Et c'est tout à fait normal. Comme je disais ci-dessus, Opera n'utilise pas les références usuelles en matière de navigation clavier. Smiley cligne

La touche tabulation ne sert qu'à naviguer dans les contrôles de formulaires

a écrit :
Raccourcis de formulaires
Aller au prochain élément dans le formulaire Tab
Aller à l'élément précédent dans le formulaire Maj + Tab


Ce sont les lettres A et Q, ou les flèches combinées avec la touche Ctrl, qui permettent de naviguer de liens en liens

a écrit :
Raccourcis des liens
Sélectionner le prochain lien dans la page
A
Ctrl + &#8595;
Sélectionner le lien précédent dans la page
Q
Ctrl + &#8593;


Plus d'autres moyens de navigation plus étendus. Voir l'aide d'Opera.

A noter que tu peux reconfigurer à ta guise l'ensemble de ces combinaison (par exemple, pour revenir à l'utilisation courante de la touche tab), via les Préférences pour la plupart, et les fichiers ini pour le reste.

Smiley cligne

Oups. Au fait : l'objet de ce fil est de tester l'accessibilité de :
http://www.agglo-choletais.fr
Ne nous égarons donc pas... Smiley confus
Modifié par Laurent Denis (15 Jul 2005 - 16:59)
Laurent : exact, mais si on ne définit pas le tabindex (même pour Opera) le fait d'appuyer sur la touche A n'amène pas obligatoirement sur le premier lien de la page. Or pour revenir au sujet principal de ce post Smiley smile si j'appuie sur A (ou ctrl flêche bas) pour naviguer dans la page, cela active le premier lien de l'encart partenaires, ce qui ne me semble pas logique.

Eric
Modifié par Eric (15 Jul 2005 - 17:38)
Smiley eek
Tu as en effet tout à fait raison dans le cas du site en question !

Sur celui-ci, Opera atteint avec la touche A le premier lien dont l'url est absolue, en sautant toutes les url relatives. Ce qui relève apparemment du bug, mais dont je ne vois pas l'origine.

Car je ne retrouve pas le même comportement sur d'autres sites...

à creuser Smiley cligne
Bon. Quelques tests rapides plus tard :

En réalité, le comportement d'Opera avec cette touche A est plus complexe que nous ne ne croyions :
- A et Ctrl flèche ne sélectionnent pas les liens dans l'ordre naturel, mais le prochain lien, comme le dit d'ailleurs la doc Smiley cligne
- en tenant compte du scroll vertical, des clics et mouvements de souris, des éventuelles autres actes de navigation dans le contenu avec d'autres touches clavier, et de la présence ou non d'une mise en page CSS (ouf)
- sans tenir compte de tabindex.

Pour vous en assurer, affichez la page du site en question, en désactivant sa CSS. Scrollez au hasard, appuyez sur a... Scrollez, Cliquez quelque-part (sans activer aucun lien) et faites à nouveau a.

Il y a un rapport manifeste avec la zone de visualisation du canevas, et l'affichage avec ou sans CSS, bref ce qu'Opera appelle la "navigation spatiale", dont je pensais pas qu'il avait conduit à renoncer complètement aux éléments "classiques" de navigation au clavier. Bref, la navigation au clavier dans Opera est totalement originale.

Au temps pour moi : je navigue beaucoup au clavier, mais lorsque je dois utiliser mon lecteur d'écran, pas dans Opera. ça m'apprendra Smiley cligne
Laurent : C'est bien l'impression que j'avais (pour Opera) mais je n'aurais pas su l'exprimer et l'analyser à ta façon. Il vrai que dans certain cas cela déroute mais peut s'avérer pratique.

Il s'avère donc pratique d'utiliser la tabulation et de bien définir les tabindex.

Eric
Pages :
Sujet clos
Aller à