Meilleures pratiques d'accessibilité pour les curseurs / carrousels de contenu?
Je suis en train de créer un curseur de contenu pour un site d'actualités et face au problème de l'accessibilité du clavier et de la lecture d'écran.
Cas n ° 1: curseur d'image pure
Pour le curseur d'image générique, il semble que vous pouvez utiliser les options suivantes: - rendre les boutons prev-next focalisables afin que l'utilisateur puisse changer les images.
Les zones pouvant être mises au point sont affichées en rouge
Cas n ° 2: contenu sur les images
Pour le carrousel de contenu avec des liens/contenu dans les diapositives, cela ne fonctionnera pas de cette façon, car vous devez également rendre le contenu focalisable.
Dans ce cas, je n'arrive pas à comprendre comment le focus doit se déplacer dans les diapositives/flèches.
Il existe essentiellement deux options:
- Moins de diapositives: la mise au point se déplace uniquement dans les flèches et la diapositive active (par exemple, Guardian) .Pour passer à la diapositive suivante, l'utilisateur passe TAB à la flèche, puis MAJ + TAB pour rendre le contenu de la diapositive focalisable:
- La mise au point se déplace à l'intérieur des flèches et de chaque diapositive (Amazon). Ainsi, pour accéder à la flèche suivante, l'utilisateur doit d'abord parcourir toutes les diapositives.
Lecteurs d'écran et curseurs
Je pense que je suis perdu ici, donc si quelqu'un a une expérience, c'est apprécié. Je suppose qu'il peut être présenté aux lecteurs d'écran comme une simple liste avec des flèches et une navigation cachées?
Des questions
Existe-t-il d'autres conventions (peut-être meilleures) pour cela, par exemple utiliser les flèches du clavier pour se déplacer dans les diapositives? Comment signifiez-vous à l'utilisateur qu'il peut être déplacé avec les flèches?
Comment gérez-vous par ex. navigation par points?
Comment gérez-vous les curseurs en boucle?
Vous ne devriez pas vraiment utiliser un curseur. Oui mais...
On peut dire que vous ne devriez pas du tout utiliser le curseur et oui c'est vrai. Mais il semble que certaines personnes l'utilisent de toute façon, il est donc préférable de rendre les curseurs plus accessibles plutôt que de leur en trouver d'autres qui ne sont pas accessibles du tout.
Je suis en faveur de ne pas utiliser de carrousel pour commencer, vous cachez du contenu qui est apparemment important à montrer ..
Mais à part cela, vous pouvez ignorer les flèches dans l'ordre de tabulation et parcourir les diapositives en utilisant tab directement tout en vous concentrant sur le composant cliquable de chaque diapositive.
Cela suppose que vous avez un lien sur chaque diapositive et pas beaucoup (comme Amazon) pour être une nuisance pour les utilisateurs qui souhaitent naviguer vers le contenu plus bas sur la page.
Le type/valeur du contenu vous aidera à décider.
Par exemple: si le contenu n'est que des images avec des informations visuelles importantes pour le visiteur, choisissez le premier cas.
Si le contenu est des images avec des informations visuelles importantes pour le visiteur et du texte, allez avec le cas 2 - 1.
Si le texte est plus important que les images, choisissez le cas 2 - 2.
Le reste est à peu près technique et je ne suis pas sûr que ce soit le bon endroit pour répondre. Une brève explication est que les liens peuvent contenir des images. Donc, sauter à travers les liens signifie que vous sautez également à travers les images.
Installez ChromeVox , accédez à la section PLUS DE THÈMES de www.magnumphotos.com , prétendez que vous ne pouvez pas contrôler votre souris ou fermer les yeux et l'onglet.