Bonjour à toutes et à tous, Pour les fenêtres modales, le design pattern WAI (http://www.w3.org/TR/wai-aria-practices/#dialog_modal) recommande que la navigation au clavier reste dans la fenêtre modale. Dans le wiki AcceDe Web (http://wiki.accede-web.com/notices/interfaces-riches-javascript/fenetres-modales-pop-in#comportement-avec-javascript), la technique JavaScript recommandée consiste à rajouter un « tabindex=-1 » à tous les éléments ne faisant pas partie de la modale.
Sur un document complexe, le rajout d'un tabindex=-1 sur tous les éléments pouvant prendre le focus peut concerner un grand nombre d'éléments, et engendrer des problématiques de performances. Le design pattern du WAI ne parle que du comportement de la tabulation, et j'ai trouvé plusieurs ressources sur le web qui utilisent une approche par la gestion des évènements du clavier pour respecter le pattern : http://juicystudio.com/article/custom-built_dialogs.php#comment9 http://drublic.de/blog/accessible-dialogs-modals/ Cette approche par gestion des évènements clavier me semble plus pertinente, d'un point de vue de la solution technique, et elle respecte le design pattern : Quels sont vos avis sur ce sujet ? De plus, lors d'un test sur Internet Explorer 8, j'ai pu prendre le focus sur un bouton radio avec un tabindex=-1 : avez-vous déjà rencontré ce problème ? En vous remerçiant par avance de vos lumières sur ce sujet, Cordialement, NICOLAS CHARDON ARCHITECTE IHM VSC Technologies 2 place de la Défense - CNIT 1 - BP 440 - 92053 Paris La Défense Cedex TÉL. : +33 (0)1 58 13 73 22 (73 22) - [email protected]<mailto:[email protected]> Voyages-sncf.com, 23 sites couvrant plus de 30 pays. [cid:[email protected]] [V.png]<http://mobile.voyages-sncf.com/> Téléchargez notre application mobile<http://mobile.voyages-sncf.com/> [twitter.jpg]<https://twitter.com/Voyagessncf_com> Suivez-nous sur Twitter<https://twitter.com/Voyagessncf_com> [Facebook.png]<https://fr-fr.facebook.com/VoyagesSncf.com> Rejoignez-nous sur Facebook<https://fr-fr.facebook.com/VoyagesSncf.com> [GooglePlus-512-Red.png]<https://plus.google.com/+voyagessncf/posts> Rejoignez-nous sur Google +<https://plus.google.com/+voyagessncf/posts>
_______________________________________________ liste_gta mailing list [email protected] http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
