Démo accessibilité web : sous-menu accessible au clavier
Dans cette démo, je compare deux versions d’un sous-menu de navigation.
Sur la version non accessible :
– le sous-menu existe visuellement ;
– mais il reste surtout pensé pour le survol de la souris ;
– au clavier, il est difficile ou impossible à ouvrir ;
– les liens du sous-menu ne sont pas parcourables correctement ;
– l’état du sous-menu n’est pas clairement annoncé.
Sur la version corrigée :
– le bouton du sous-menu est atteignable au clavier ;
– l’ouverture fonctionne avec la touche Espace ;
– les liens deviennent accessibles dans le bon ordre ;
– l’activation se fait correctement ;
– la fermeture avec Échap permet de reprendre la navigation.
Un sous-menu accessible doit être ouvrable, parcourable et refermable au clavier.
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 : sous-menu accessible au clavier »
Donc nouvelle démo, on a accès à la navigation au clavier. La souris n’est pas ce n’est pas possible.
Donc vous voyez que sur ce menu euh qui a un problème d’accessibilité, on peut pas aller on peut pas naviguer dans les sous-menus.
Donc ça, on peut le corriger via du code et on obtient quelque chose comme ça.
Quand on va là, on appuie sur espace, le menu se développe.
On peut aller dedans.
Puis si on appuie sur entrée et bien on va vers la page sélectionnée par le focus.
on fait escape, ça ressort
et on peut naviguer comme ça normalement dans tous les menus du site.
