AngularJS et ARIA (synthèse)
Afin de préparer l’accompagnement de l’un de nos clients sur un projet utilisant le framework JavaScript de Google, nous avons réalisé une petite synthèse sur l’intégration de composants enrichis avec ARIA (en anglais) dans AngularJS (en anglais).
Nous la partageons ici.
N’hésitez pas à enrichir cette synthèse grâce à vos commentaires.
En bref
Par défaut, ARIA est prise en charge dans AngularJS par l’intermédiaire d’un module, mais ce dernier n’offre qu’un très maigre support de quelques attributs.
Du reste, le framework est extrêmement modulable et on développe en AngularJS en ayant largement la main sur les codes HTML/CSS/JS produits en sortie. Ainsi, dans le cas où un module de base n’est pas accessible, il est toujours possible de l’optimiser. En particulier, nous n’avons pas isolé de barrières quelconques à la mise en place d’états, de rôles, ou de propriétés ARIA.
En bref, AngularJS peut produire des interfaces riches très accessibles.
AngularJS
- Framework JavaScript.
- Libre et open source.
- Développé par Google.
- Lancé en 2009.
- Couplé à jQuery (en anglais) dans une certaine mesure.
- Philosophie : adapter, étendre et améliorer HTML pour créer des interfaces riches plutôt orientées applications.
L’accessibilité dans AngularJS
- AngularJS intègre un module d’accessibilité appelé ngAria (en anglais).
- Ce module n’est une sorte de « socle de départ » à enrichir au besoin.
- Une fois le module chargé, les attributs suivants sont gérés sur certains composants :
- Il est toujours possible de redéfinir ces attributs au cas par cas, en utilisant la méthode
config()
. - Il est possible d’intégrer tous les attributs que l’on souhaite sur n’importe quel élément. Il suffit ensuite de gérer le comportement de ces derniers (ajout/suppression d’attributs, ou passage des valeurs de ceux-ci à
true
/false
, par exemple), côté contrôleur.
Pour plus d’informations
Vos commentaires
-
Je profite de ce billet pour le compléter de cette vidéo :
AngularJS Accessibility by Marcy Sutton at ng-europe 2014 (en anglais) que nous avons prévue de visionner dans les bureaux prochainement :)