Démo accessibilité web : carrousel et popin accessibles
Dans cette démo, je compare deux composants dynamiques : un carrousel et une popin.
Sur la version non accessible :
– le carrousel défile seul ;
– aucun contrôle clair ne permet de le mettre en pause ;
– l’utilisateur perd la main sur le rythme ;
– lorsqu’une popin s’ouvre, le focus est mal géré ;
– la navigation clavier devient confuse ;
– la fermeture peut devenir difficile, voire impossible.
Sur la version corrigée :
– le carrousel propose des boutons précédent / suivant ;
– une pause ou reprise est possible ;
– l’utilisateur garde le contrôle ;
– quand la popin s’ouvre, le focus est placé à l’intérieur ;
– la tabulation reste contenue dans la fenêtre ;
– la fermeture fonctionne correctement, notamment avec Échap ;
– le focus revient ensuite au bon endroit.
Un composant dynamique accessible laisse toujours le contrôle : pause, fermeture et focus maîtrisé.
Cette vidéo fait partie d’une série de démonstrations autour de l’accessibilité web et du RGAA.
Transcription de la vidéo « Démo accessibilité web : carrousel et popin accessibles »
Donc là, je vais vous montrer des problèmes d’accessibilité de certains scripts.
On va prendre l’exemple d’un caroussel et d’une popine.
Vous voyez que le carousel ici, ça défile mais on a le contrôle sur rien du tout.
Euh donc un lecteur audio aura des problèmes
alors que celui-ci on a des bouton pour mettre sur pause et choisir soi-même le le la vitesse.
On fait on a le temps de de voir ce que c’est. On a du contrôle dessus
et pareil là on a une popine qui s’ouvre. Donc tout ça c’est au clavier.
La personne remplit le formulaire ou lit ce qu’il y a dans la popine et après elle peut fermer la popine avec escape ou elle a le focus sur le bouton fermé au bout d’un moment.
Vous voyez ? Et ça se ferme normalement.
Alors qu’un un script non accessible, la personne lit ou remplit le formulaire et après n’arrive pas à revenir au focus et là, la touche escape ne marche pas.
Donc vous voyez,
c’est alors des fois bon il y en a qui appellent ça des pièges à focus mais ça tourne à l’intérieur sans pouvoir ressortir.
