Accessibilité accordion
Appliquez le motif de conception Disclosure sur les accordions :
-
Entourez le bloc cliquable à l'aide d'une balise <button type="button">
-
ajoutez sur la balise <button>un attributaria-expanded="true|false"selon l'état déplié/plié du panneau -
ajoutez un attribut id sur le conteneur du contenu du panneau ( <div class="content">) : il devra être calculé pour être unique à chaque instance de l'accordion -
ajoutez sur la balise <button>un attributaria-controls="<id du contenu>" -
Définissez des styles de prise de focus clavier sur ce bouton, si nécessaire à l'aide du pseudo sélecteur focus-visible
