Quelques ressources pour comprendre et utiliser WAI-ARIA

WAI-ARIA est une spécification du W3C qui vise à rendre plus accessibles les interfaces riches du web moderne. Elle permet de définir le rôle, l'état et le changement d'état des éléments HTML d'une page, et les relations éventuelles entre ces éléments.

Ceci prend toute son importance avec la sophistication croissante des interfaces proposées par les applications web. Prenons l'exemple, volontairement simpliste, d'un menu de navigation: le HTML, jusqu'à sa version 4.01, ne dispose pas de balise spécifiquement dédiée à ce type d'élément. Pour compenser, les développeurs web utilisent généralement des balises de listes, modifiées grâce aux feuilles de style, pour ressembler par exemple au menu d'un logiciel de bureau. Puis elles sont rendues dynamiques grâce à un langage de script tel que Javascript, afin de simuler le comportement d'un menu (ouverture, fermeture, déploiement des sous-niveaux au passage de la souris, réactions aux clics...). Visuellement, le résultat est probant, et l'utilisateur comprend aisément l'intention de l'auteur, et donc la façon d'utiliser ce menu. C'est bien là la limite de ces solutions: en l'absence de perception visuelle, les informations implicites visibles telles que "le menu est ouvert", ou "la branche de ce sous-menu est déployée", ne sont pas fournies intrinsèquement aux utilisateurs de lecteurs d'écran, par exemple. D'autre part, la navigation au clavier est parfois mal, voire pas du tout, prise en compte. Cet exemple fournit un cas d'utilisation très simple; les problèmes sont encore plus délicats avec des éléments plus complexes comme des curseurs, des arbres hiérarchiques, des grilles de données éditables, etc.

En introduisant, via des attributs spécifiques des balises standards, des propriétés supplémentaires, ARIA promet de fournir aux utilisateurs des technologies d'assistance assez d'informations pour qu'ils aient une expérience de navigation similaire à la navigation visuelle. Un avantage majeur d'ARIA, bien qu'encore à l'état de draft,  est qu'elle est déjà largement implémentée, et prête à être utilisée. Elle est prise en charge dans Firefox 3, Opera 9.5, Safari, et le sera dans Internet Explorer 8. De nombreuses librairies Javascript l'intègrent (Dojo, JQuery, GWT, YUI...), et les lecteurs d'écran (Jaws, Window-Eyes, FireVox, NVDA...) suivent le mouvement. Des applications grand public telles que GMail et Google Reader en bénéficient. Pour plus d'informations, une FAQ sur codetalks.org (anciennement, FAQ du centre des développeurs Mozilla) offre un panorama complet et instructif.

Cela dit, bien qu'effervescente, cela reste une technologie émergente, et les ressources et exemples d'application sont encore rares. L'Université de l'Illinois, via l'iCITA, son centre de recherches sur l'accessibilité des technologies de l'information, propose deux ressources très utiles dans le cadre d'un développement exploitant ARIA.
La première est une série d'exemples de composants (widgets) exploitant ARIA. Avec, par exemple, Firefox 3 et FireVox, on peut découvrir comment les rôles et gestions d'états sont utilisés pour renseigner l'utilisateur sur le comportement des composants.
La seconde est une barre d'outils permettant de contrôler l'accessibilité d'une page (sous FireFox). Encore une autre, me direz-vous? Celle-ci présente l'avantage de faciliter l'inspection et le test des éléments de scripts, et en particulier des widgets ARIA. Les développeurs disposent donc d'un outil de productivité supplémentaire. Par ailleurs ses fonctions de personnalisation du rendu visuel intéressera les utilisateurs ayant des problèmes de vision.