1179 sujets

Accessibilité du Web

[Résolu] Semantique interactive

Bonjour,
Lorsque je regarde le menu accessibilité de mon navigateur, on me dit :
upload/1606059524-81417-notabindex.png (En savoir plus).
Je rajoute donc tabindex="0" et on me dit :
upload/1606059619-81417-tabindex0.png (En savoir plus).

Je ne comprend pas pourquoi il y a toujours un avertissement.
Quel est le problème ? Comment le corriger ?

Merci beaucoup !
Re-bonjour,
Lorsque je regarde le menu accessibilité de mon navigateur, on me dit :
upload/1606059524-81417-notabindex.png (En savoir plus).
Je rajoute donc tabindex="0" et on me dit :
upload/1606059619-81417-tabindex0.png (En savoir plus).

Je ne comprend pas pourquoi il y a toujours un avertissement.
Quel est le problème ? Comment le corriger ?

Merci beaucoup !
Modérateur
Bonjour,

Si tu ajoutes un action au click, et que tu rends l'élément focusable via le clavier avec un tabindex="0", c'est bien. Mais il faut aussi que l'utilisateur puisse faire la même chose que l'action du clic via le clavier. C'est à dire qu'il faut que ton javascript prévoit une action lors d'un évènement "keydown" ou "keyup" par exemple en plus de l'évènement "click" (sinon, l'utilisateur pourra bien donner le focus à l'élément via le clavier, mais il ne pourra rien en faire ensuite avec le clavier seul => c'est probablement pour ça que ton navigateur râle).

Note : la fonction de diagnostic des navigateurs concernant la navigation clavier n'est pas toujours parfaite. Des fois ils disent rien alors qu'ils auraient dû, et des fois ils disent quelque chose alors qu'ils devraient pas.

Amicalement,
Merci !
Je ne comprenais rien à ce qu'ils racontaient mais maintenant c'est bon.
Ainsi, il faudrait aussi à chaque fois qu'il y a "click", ajouter "keyup" !

parsimonhi a écrit :
Note : la fonction de diagnostic des navigateurs concernant la navigation clavier n'est pas toujours parfaite. Des fois ils disent rien alors qu'ils auraient dû, et des fois ils disent quelque chose alors qu'ils devraient pas.

Ah ! C'est trop cool ! Smiley cligne
Modifié par js_html (23 Nov 2020 - 16:20)
Meilleure solution
Mais ça ne va toujours pas car lorsque l'on rajoute "keyup" ou "keydown" et que l'on fait "Tab" ça fait directement l'action sans avoir pressé "Entrée".

Comment y remédier ? Comment détecter "Entrée" et non quand touche pressée ?
Modérateur
Bonjour,

Il faut dans ton javascript détecter quelle touche c'est. En général, on ne fait pas une action se déclenchant pour "toutes" les touches, mais seulement pour "certaines" touches ou "certaines combinaisons" de touches. Et il faut éviter ce qui sert par ailleurs au navigateur (comme la touche "tab" qui sert à naviguer). Sinon, évidemment, ton action va se déclencher même quand tu ne veux pas qu'elle se déclenche.

EDIT: Je vois que tu utilises jquery. Pour la touche "entrée", tu peux ajouter au code jsfidle que tu as donné plus haut :
$('.more').keypress(function(ev) {
  if (ev.which == 13) {
    window.open($(this).attr("data-url"))
  }
});


Amicalement,
Modifié par parsimonhi (23 Nov 2020 - 16:23)
Sujet clos
Aller à