Bonjour

aucune obligation d'utiliser aria si tu met à jour le title sur ton bouton de manière dynamique pour dire ouvrir le menu / fermer le menu en fonction de l'état du menu. Si tu décide d'utiliser de l'aria effectivement l'exemple de Jean Pierre est bon (pour ma part je ne met pas d'aria-controls car cela force un comportement applicatif sur voiceover osx qui est particulièrement rébarbatif pour les utilisateurs surtout si tu en as plusieurs (oblige à faire un raccourci clavier à trois touches pour entrer et sortir du sous menu)


Aurélien

Bonjour marie,

Si tu n'est pas dans un contexte applicatif :

<button aria-expanded="true|false" aria-controls="@id">menu</button>

<div id="@id">

Le bouton "fermer" est inutile.

Si tu es dans un contexte applicatif, faut voir...

Au sujet de l'accordéon : ne jamais (!!!) utiliser ce DP particulièrement pourri qui a été transmuté en ARIA 1.1 avec une implémentation similaire à celle indiqué ci-dessus.

Et au passage dans l'exemple une utilisation totalement absurde à base de dl/dd/dt.

JPV


Le 12/01/2017 à 16:28, Marie Hanotte a écrit :

*Bonjour la liste,*

J'ai une question sur un système d'ouverture de menu, en regard du critère 7.1.

J'en ai fait un test réduit sur Codepen : http://codepen.io/mh-nichts/pen/GrZBxg

Comme il n'y a pas ici, de base, de motif ARIA utilisé, je ne suis pas sûre de quels points m'assurer. Est-ce-qu'il est ici suffisant que le contenu ouvert se trouve après le bouton, et que le CSS gère de manière directe (display none/block) l'affichage ? Ou est-ce-qu'il faudrait ajouter par exemple un aria-controls sur les boutons, un aria-expanded sur le parent ? Ou enfin faudrait-il absolument passer par un motif ARIA (accordion par exemple) avec tous les attributs ARIA correspondants ? J'aurais tendance à répondre par la négative à cette dernière question, mais pour les 2 autres je ne suis pas sûre.

Je vous remercie par avance pour vos retours.

Cordialement,

*Marie Hanotte* // Intégratrice multimédia - /Interactive Designer/

Experte Accessiweb <http://www.accessiweb.org/index.php/fiche_gta_experts/items/hanotte-marie.html> Opquast certified <https://certified.opquast.com/fr/>

<http://www.acti.fr>      

Tél. : +33 4 37 37 25 10
289, rue Garibaldi
69007 Lyon

        
<http://www.acti.fr/> <https://www.linkedin.com/company/acti> <https://twitter.com/acti> <https://www.facebook.com/agence.acti>

acti recrute <http://www.acti.fr/recrutement-acti-lyon/?utm_source=signature>



_______________________________________________
liste_gta mailing list
liste_gta@list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org



_______________________________________________
liste_gta mailing list
liste_gta@list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org


--
Aurélien Levy
----
Temesis

_______________________________________________
liste_gta mailing list
liste_gta@list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org

Répondre à