WAI-ARIA et lexpérience Web                                             page 1 sur 30DELAMER Céline                       ...
WAI-ARIA et lexpérience Web                                             page 2 sur 30                Université Michel de ...
WAI-ARIA et lexpérience Web                                                                                           page...
WAI-ARIA et lexpérience Web                                                page 4 sur 30WAI-ARIADepuis l’avènement des nou...
WAI-ARIA et lexpérience Web                                                   page 5 sur 30           Historique de public...
WAI-ARIA et lexpérience Web                                                page 6 sur 30             Histoire d’ARIA en fo...
WAI-ARIA et lexpérience Web                                              page 7 sur 30Comportement des contenus dynamiques...
WAI-ARIA et lexpérience Web                                             page 8 sur 30Fonctionnement réel des contenus dyna...
WAI-ARIA et lexpérience Web                                              page 9 sur 30                               Menu ...
WAI-ARIA et lexpérience Web                                                  page 10 sur 30   Exemple d’une mise à jour de...
WAI-ARIA et lexpérience Web                                                       page 11 sur 30navigateurs les plus utili...
WAI-ARIA et lexpérience Web                                                   page 12 sur 30Intervention des Spécification...
WAI-ARIA et lexpérience Web                                                 page 13 sur 30« Vers l’infini et au-delà… ! »P...
WAI-ARIA et lexpérience Web                                                page 14 sur 30Au menu : Google !La suite bureau...
WAI-ARIA et lexpérience Web                                              page 15 sur 30Toutefois, si cela paraît évident e...
WAI-ARIA et lexpérience Web                                              page 16 sur 30   3. L’utilisateur doit pouvoir ac...
WAI-ARIA et lexpérience Web                                             page 17 sur 30                Université Michel de...
WAI-ARIA et lexpérience Web                                             page 18 sur 30                                 Une...
WAI-ARIA et lexpérience Web                                                     page 19 sur 30                            ...
WAI-ARIA et lexpérience Web                                                       page 20 sur 30À ce titre, le guide d’imp...
WAI-ARIA et lexpérience Web                                                    page 21 sur 30Un bon exemple de documentati...
WAI-ARIA et lexpérience Web                                              page 22 sur 30      les spécifications en questio...
WAI-ARIA et lexpérience Web                                              page 23 sur 30  "safe" ARIA that degrades gracefu...
WAI-ARIA et lexpérience Web                                                 page 24 sur 30              Les compétences in...
WAI-ARIA et lexpérience Web                                                page 25 sur 30                    Survey of Pre...
WAI-ARIA et lexpérience Web                                                 page 26 sur 30     Interface de Gmail, exemple...
WAI-ARIA et lexpérience Web                                                 page 27 sur 30stopper lutilisateur dans sa nav...
WAI-ARIA et lexpérience Web                                                   page 28 sur 30naturelle. Ce futur est encore...
WAI-ARIA et lexpérience Web                                                page 29 sur 30GlossaireAAgent UtilisateurEn ang...
WAI-ARIA et lexpérience Web                                             page 30 sur 30PProtocols and Formats Working Group...
Prochain SlideShare
Chargement dans…5
×

Dossier2012 aria-delamer-menant-vergnol

314 vues

Publié le

Normes et standards : ARIA

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
314
Sur SlideShare
0
Issues des intégrations
0
Intégrations
2
Actions
Partages
0
Téléchargements
5
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Dossier2012 aria-delamer-menant-vergnol

  1. 1. WAI-ARIA et lexpérience Web page 1 sur 30DELAMER Céline Master CPEAMMENANT BenjaminVERGNOL Morgan Normes et Standards Clément Dussarps> Dans quelles mesures les spécifications ARIA étendent-elles l’expérience web des utilisateurs en situation de handicap ? Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  2. 2. WAI-ARIA et lexpérience Web page 2 sur 30 Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  3. 3. WAI-ARIA et lexpérience Web page 3 sur 30SommaireWAI-ARIA......................................................................................................................................... 4 Introduction à ARIA...................................................................................................................... 4 Qu’est-ce qu’ARIA ?................................................................................................................ 4 Un peu d’histoire… ................................................................................................................. 4 Les objectifs d’ARIA................................................................................................................ 5 Les contenus dynamiques sont partout : quelques exemples….............................................. 8 Les implémentations d’ARIA................................................................................................. 10 L’action des logiciels d’assistances ...................................................................................... 12 « Vers l’infini et au-delà… ! »................................................................................................. 13ARIA par l’exemple......................................................................................................................... 13 Au menu : Google !.................................................................................................................... 14 Les Attentes fonctionnelles.................................................................................................... 15 Qu’a fait Google (Docs) ?...................................................................................................... 16 Qu’ont fait Mozilla, Google, Microsoft et consorts ?...............................................................19 Qu’ont fait les développeurs de JAWS, VoiceOver et consorts ?...........................................20ARIA et l’expérience utilisateur....................................................................................................... 21 À qui les spécifications ARIA profitent-elles ?........................................................................ 21 Un outil dont il faut pouvoir et savoir se servir....................................................................... 22 Implémenter… mais pas que !............................................................................................... 25 ARIA peut-il devenir une gêne ? ........................................................................................... 26 ARIA en quelques points....................................................................................................... 27Conclusion..................................................................................................................................... 28Glossaire........................................................................................................................................ 29 Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  4. 4. WAI-ARIA et lexpérience Web page 4 sur 30WAI-ARIADepuis l’avènement des nouvelles technologies et du web, Internet s’est introduit dans lequotidien de tous, peu importe le contexte d’utilisation ou le lieu d’usage : bureaux, salons,gares, jardins publics, troquets, etc. Au fur et à mesure que les technologies ont évolué, lesusages se sont diversifiés et le web a changé, s’adaptant tantôt aux usages, auxtechnologies, ou en proposant des innovations. Les contenus des pages web et desinteractions avec elles se sont alors étendus et complexifiés.Ces évolutions posent une question essentielle : comment continuer à rendre accessibletous les contenus du web et ce indépendamment de leurs modalités d’usage (matériels etlogiciels de navigation, mode de perception des contenus…) ? Nous nous sommes doncintéressés à cette problématique, mais plus précisément aux dispositifs techniques utiles àcertains types d’utilisateurs pour qui une navigation classique sur Internet représente déjàune difficulté.Les spécifications Accessible Rich Interactive Applications (ARIA) sont l’exemple mêmed’une tentative de réponse à cette problématique. Ainsi, dans quelles mesures lesspécifications ARIA étendent-elles l’expérience web des utilisateurs concernés ? C’est ce àquoi nous tacherons de répondre en vous présentant ARIA, ses objectifs et sonfonctionnement et, pour finir, ses limites en termes d’utilisation.Introduction à ARIAQu’est-ce qu’ARIA ?ARIA, littéralement « Accessible Rich Interactive Applications », est une spécificationtechnique du W3C encore en cours de rédaction qui permet de rendre certainesapplications et sites web plus accessibles, particulièrement aux personnes souffrant d’unhandicap nécessitant un lecteur d’écran ou ne pouvant utiliser un périphérique de typesouris pour naviguer sur Internet.Un peu d’histoire…Le développement des spécifications ARIA est intégré dans le projet centré surl’accessibilité web du W3C : le « WAI », Web Accessibility Initiative.Le premier document initialisant le projet ARIA date de 2006 mais on imagine que leproblème a été soulevé quelques années auparavant. S’en est suivi depuis une dizained’autres documents de travail relatant l’avancée des recherches sur les précisions et la miseen œuvre d’ARIA. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  5. 5. WAI-ARIA et lexpérience Web page 5 sur 30 Historique de publication des documents sur ARIA : du brouillon de travail (« working draft ») au dernier appel (« last call working draft »)Le « Protocols and Formats Working group », le groupe de travail qui produit lesdocuments relatif à ARIA, est composé de personnes venant de tous secteurs :professionnels du milieu, enseignants, chercheurs…En janvier 2011, ARIA est enfin candidate pour devenir une recommandation officielle duW3C. Elle reste cependant, comme toutes les recommandations, en constante discussion.Les objectifs d’ARIA.Comme leur nom l’indique, les spécifications ARIA permettent l’accessibilité à descontenus dits « riches » et « interactifs » (les « Rich Interactives Application »), qui sontaujourd’hui incontournables sur le Web.Ces contenus dynamiques sont apparus avec l’avènement du web 2.0 et des nouvellespossibilités d’interactions entre les sites Internet et leurs utilisateurs.Développé la plupart du temps dans des langages de développement web tels queJavascript (et AJAX) ou Flash, ils reposent sur une technologie essentielle du web : leprotocole XMLHttpRequest. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  6. 6. WAI-ARIA et lexpérience Web page 6 sur 30 Histoire d’ARIA en fonction des autres grandes technologies du web.C’est justement l’utilisation de ce protocole dans leur fonctionnement qui caractérise lescontenus dynamiques. En effet ils se définissent comme des contenus qui changent decomportement indépendamment de la page web où ils se trouvent. Ce sont en fait deszones d’une page web plus ou moins importante, qui adoptent différents comportementssans amener à complètement rafraîchir celle-ci. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  7. 7. WAI-ARIA et lexpérience Web page 7 sur 30Comportement des contenus dynamiques au sein d’une page web classique (partie visiblepar l’utilisateur) :Ils peuvent afficher / masquer du contenu, permettre des actions aux utilisateurs sans queles autres éléments de la page ne soient modifiés. Selon certains cas et selon l’objectif deces contenus, leur comportement changeant peut être contrôlé par l’utilisateur ou pas dutout. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  8. 8. WAI-ARIA et lexpérience Web page 8 sur 30Fonctionnement réel des contenus dynamiques (partie invisible pour les utilisateurs) :Les contenus dynamiques sont partout : quelques exemples…Parmi les contenus dynamiques on trouve par exemple les menus déroulants, lesmessageries instantanées, les encarts publicitaires en Flash, les diaporamas, la suggestionde recherche en direct sur les moteurs de recherches etc. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  9. 9. WAI-ARIA et lexpérience Web page 9 sur 30 Menu déroulant sur FNAC.comFacebook, le premier des sites de réseaux sociaux (grands porteurs du Web 2.0) est,comme la plupart de ses concurrents (Twitter, Google +), un des exemples les plusprobants de l’existence de ces contenus. Tous les modules du site sont développés enutilisant massivement AJAX, technologies qui permettent donc une interactivité decertaines zones d’une page sans la recharger complètement. Page principale d’actualités Facebook.Notifications et menu déroulant, mise à jour des actualités, messagerie instantanée, ajout /compteur de commentaires, affichage / masquage d’informations… Le fonctionnementmême du site est entièrement basé sur ces mises à jour régulières et en direct desinformations.Comme évoqué précédemment, ces changements de comportements peuvent survenirgrâce à l’action de l’utilisateur (affichage d’un contenu par exemple) ou sans (apparitiond’une notification).Parce qu’ils peuvent changer d’états pendant la navigation, on comprend pourquoi cescontenus ne sont pas « visibles »par les utilisateurs de lecteurs d’écrans par exemple, carceux-ci ne peuvent avoir une vision globale de la page. C’est en effet surtout visuellementque la plupart des utilisateurs les repèrent. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  10. 10. WAI-ARIA et lexpérience Web page 10 sur 30 Exemple d’une mise à jour de contenu dynamique non perçue par une personne utilisant un lecteur d’écran. Source : diaporama de JP Vilain (http://qelios.net/demo_aria/index.php)D’autres utilisateurs sont aussi concernés : tous ceux qui utilisent d’autres périphériquesque la souris pour leur navigation, tel que le clavier. Si ceux-ci peuvent percevoir leschangements qui s’opèrent sur la page, ils ne peuvent interagir avec les contenus car lestabulations claviers sont par défaut inefficaces sur ces zones.Heureusement les spécifications ARIA vont changer ça. Les contenus dynamiques sedémocratisant de plus en plus, rendre ces contenus visibles, accessibles et fonctionnels estalors devenu un enjeu crucial.Les implémentations d’ARIALes spécifications permettent justement aux navigateurs, et aux technologies d’assistancede reconnaître ces contenus et de pouvoir communiquer avec elles afin de les rendreutilisables. Pour cela, les spécifications ARIA sont à penser dès la conception de la pageweb et à intégrer dans son code HTML, langage qui gère, comme nous l’avons vuprécédemment, la structure de la page. Le développeur de la page intègre dans son codedes propriétés et attributs qui vont permettre aux contenus dynamiques de se déclarercomme des applications plutôt que de simples contenus statiques.Mais afin que ces attributions dans le code puissent être reconnues, il faut aussi que lesagents utilisateur (les navigateurs) puissent les reconnaître. Dès ses premières phases dedéveloppement les navigateurs ont commencé à les implémenter et ce jusqu’à 2012 : les Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  11. 11. WAI-ARIA et lexpérience Web page 11 sur 30navigateurs les plus utilisés1 les reconnaissent désormais tous. Frise : Utilisation d’ARIA en fonction de l’évolution des agents utilisateurs (et par rapport aux recommandations web sur l’accessibilité)De même que pour les navigateurs web, les logiciels d’assistance à la navigation (JAWS 2,Voice Over) doivent connaître les propriétés des spécifications ARIA afin de pouvoir agiren fonction de celles-ci.A chaque rôle ou propriété ARIA, une action est associée qui permet de rendre « visible »et manipulable les contenus dynamiques interactifs.1 Opéra, Internet Explorer, Safari, Chrome et Firefox d’après un article du 6 mars d’Openlog.fr :http://www.openlog.fr/blog/navigateurs-internet-plus-utilises2 Un article de Techno-Science.net sur JAWS peut vous permettre de comprendre le fonctionnement de ceslogiciels en général : http://www.techno-science.net/?onglet=glossaire&definition=572 Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  12. 12. WAI-ARIA et lexpérience Web page 12 sur 30Intervention des Spécifications ARIA au sein du processus de navigation d’un utilisateur employant un logiciel d’assistance.L’action des logiciels d’assistancesPrenons l’exemple d’un utilisateur utilisant un lecteur d’écran. Lors d’une session denavigation, s’il a passé un contenu dynamique et que celui-ci change de comportement à cemoment, l’utilisateur ne peut le savoir (voir le schéma de JP Vilain page 6).Cependant, grâce aux implémentations d’ARIA dans le code de la page, le lecteur d’écran areconnu le contenu et a perçu sa mise à jour. Grâce à cela, le logiciel peut agir pourprévenir l’utilisateur et de différentes manières selon les préférences de ce dernier : - soit il interrompt la navigation de l’utilisateur afin de le prévenir du changement opéré - soit il continue la navigation et revenir ensuite sur ce contenu - soit il ne fait rien.L’utilisateur est donc libre de décider de « voir » ces contenus ou non, de les utiliser ounon, mais ils lui sont accessibles. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  13. 13. WAI-ARIA et lexpérience Web page 13 sur 30« Vers l’infini et au-delà… ! »Pas encore recommandation officielle du W3C, ni standard, les spécifications ARIAtendent à le devenir, grâce à la prise de conscience générale autour de l’accessibilité : ellessont déjà implémentées par les agents utilisateurs et utilisées par des sites webincontournables (sites gouvernementaux, grands groupes tels que Google...). Reste encoreà prouver leur efficacité technique et surtout leur efficience du côté des utilisateursconcernés.ARIA par l’exempleLe propos de cette partie consiste à donner un aperçu concret de ce que supposel’implémentation d’ARIA. On a vu précédemment que ces spécifications s’adressaient àtrois « acteurs » importants lors de la médiation technique d’une information à unutilisateur : 1. le producteur de contenu, comprenant les concepteurs de sites Web, les développeurs et intégrateurs HTML ainsi que les éditeurs d’outils d’édition Web, comme BlueGriffon ou Dreamweaver ; 2. les éditeurs (ou développeurs) des agents utilisateurs 3 Web (navigateurs), comme Microsoft, Google, Mozilla, Apple, Opera Software… ; 3. les éditeurs (ou développeurs) des assistants utilisateurs 4, comme Freedom Scientific (JAWS), Apple (VoiceOver)… ;Nous allons donc, en premier lieu, identifier un élément précis des spécifications quicorrespondrait à une fonctionnalité ou à un composant concret d’une page Web. Ensuite,nous observerons ce que l’implémentation d’ARIA suppose pour chacun des trois acteursprécédemment cités. Nous procéderons à cette observation sur un cas réel, avec un site enproduction.Les outils utilisés pour réaliser cette observation sont : le navigateur Mozilla Firefox 12(beta) et son inspecteur de code.3 Le terme « agent utilisateur » est défini dans le glossaire.4 Idem pour « assistant utilisateur ». Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  14. 14. WAI-ARIA et lexpérience Web page 14 sur 30Au menu : Google !La suite bureautique en ligne Google Docs est l’un des meilleurs exemples d’applicationWeb riches, dotée d’un haut degré d’interactivité et de nombreuses fonctionnalitésdynamiques. L’utilisation d’un tel outil par des personnes en situation de handicap peuts’avérer catastrophique sans l’adjonction d’un panel de technologies assistantes, dontARIA. La barre de menu de Google DocsNous nous proposons d’étudier la barre de menu du traitement de texte de Google, icireprésentée. Le principe de fonctionnement d’une barre de menu est connu ; c’est unélément conventionnel des programmes informatiques, apparus très tôt après l’arrivée desinterfaces graphiques. Barre de menu du système d’exploitation d’un Atari STUne barre de menu est ainsi constituée d’un certains nombre d’items de menu (le plussouvent représenté par un mot : un nom substantif). Chacun de ces items peut-êtresélectionné puis actionné, pour exécuter l’opération que le concepteur du logiciel auradéfinie.Très souvent, chaque item d’une barre de menu, une fois actionné, ouvre un sous-menu. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  15. 15. WAI-ARIA et lexpérience Web page 15 sur 30Toutefois, si cela paraît évident en terme d’usage, il en va autrement en termes deconception. Aussi, chacun de ces sous-menus doit être considéré comme un menu à partentière, indépendant de la barre de menu.Autrement dit, le composant (ou la fonctionnalité) « barre de menu » se cantonne à lasélection et l’actionnement de ses items de menus. Au-delà, l’utilisateur utilise (enl’ignorant) un autre composant. Le sous-menu est un autre menu, indépendant de la barre de menuLes Attentes fonctionnellesLa barre de menu Google, pour être utilisable et accessible à tous, doit répondre à quelquescritères simples : 1. L’utilisateur doit être informé qu’il s’agit d’une barre de menu (ou, à minima, d’un menu). Cette information peut être visuelle (une suite de nom substantif, disposé à sur une même ligne et régulièrement espacé indique, conventionnellement, une barre de menu) mais doit aussi être indiquée lorsque la vue ne le permet pas (annonce sonore, braille ou autres). Une telle annonce permet à l’utilisateur d’interagir avec cet élément de manière conforme et identique avec d’autres menus (celui de son explorateur de fichier, par exemple). 2. L’utilisateur doit pouvoir naviguer parmi les différents items de menu et tous les sélectionner un à un. Avec la souris, les touches fléchées du clavier ou tout autre dispositif de saisie. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  16. 16. WAI-ARIA et lexpérience Web page 16 sur 30 3. L’utilisateur doit pouvoir actionner un item et poursuivre sa tâche, selon l’objectif visé. Avec la souris, le clavier ou tout autre dispositif de saisie…ARIA, pour peu qu’elle soit implémentée, répond à ces attentes.Qu’a fait Google (Docs) ?Ils ont implémenté ARIA dans leur application Web, bien sûr ! Ainsi, dans le code sourcede la page HTML, on trouve un élément <div> avec l’attribut role défini à menubar. Cetélément contient tous les items du menu : d’autres <div> avec l’attribut role défini àmenuitem. D’autres attributs ARIA ont été utilisé, pour compléter le fonctionnement dumenu, comme on le voit sur les captures d’écran.L’équipe Google Docs a en réalité suivi les spécifications concernant le rôle d’une barre demenu : http://www.w3.org/TR/wai-aria/roles#menubar et http://www.w3.org/TR/wai-aria/roles#menuitem (ici, une citation pour la barre de menu, à titre d’illustration) : « A presentation of menu that usually remains visible and is usually presented horizontally. The menubar role is used to create a menu bar similar to those found in Windows, Mac, and Gnome desktop applications. A menu bar is used to create a consistent set of frequently used commands. AuthorsSHOULD ensure that menubar interaction is similar to the typical menu bar interaction in a desktop graphical user interface. To be keyboard accessible, authors SHOULD manage focus of descendants for all instances of this role, as described in Managing Focus. » Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  17. 17. WAI-ARIA et lexpérience Web page 17 sur 30 Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  18. 18. WAI-ARIA et lexpérience Web page 18 sur 30 Une barre de menu ARIA Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  19. 19. WAI-ARIA et lexpérience Web page 19 sur 30 Un item de menu ARIAEn examinant le code source plus attentivement, on repère l’attribut tabindex. Cetattribut n’est pas normalisé par les spécifications ARIA, mais fait partie du standardHTML. Pourtant, bien conscients qu’une simple recommandation officielle ne suffira pas àfaire bouger les lignes, les rédacteurs d’ARIA ont écrit un ensemble de documentation àl’intention des producteurs de contenus 5, en allant au-delà des spécifications ARIA :une mauvaise structuration HTML ne sera pas plus accessible avec ARIA.Qu’ont fait Mozilla, Google, Microsoft et consorts ?Les navigateurs doivent être en mesure d’interpréter les attributs définis par le producteurdu contenu, puis d’envoyer les informations correspondantes aux API d’accessibilitéfournies par les systèmes d’exploitation.Lors de l’élaboration des spécifications ARIA, tous les acteurs se sont accordés pourréutiliser les éléments existants dans les différentes API (propres aux différentesplateformes applicatives). C’est un choix important pour favoriser l’adoption rapide desspécifications par les agents utilisateurs, et au bout du compte, améliorer l’accessibilitégénérale du Web rapidement.5 WAI-ARIA 1.0 Authoring Practices : http://www.w3.org/TR/wai-aria-practices/. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  20. 20. WAI-ARIA et lexpérience Web page 20 sur 30À ce titre, le guide d’implémentation pour les développeurs 6 fait explicitement référenceaux API accessibilités ; c’est même le fil conducteur du document :« The WAI-ARIA User Agent Implementation Guide defines how implementations shouldexpose content to accessibility APIs, helping to ensure that this information appears in a manner consistent with author intent. »Plus spécifiquement, pour les barres de menu, les navigateurs doivent déclarer certainsrôles de façon très rigoureuse.Qu’ont fait les développeurs de JAWS, VoiceOver et consorts ?Les développeurs d’assistants utilisateurs ont travaillé bien avant la création d’ARIA poursupporter quelques fonctionnalité du Web Applicatif. De fait, les éléments de formulairedu langage HTML présentent de grandes similitudes avec les interfaces utilisateurstraditionnelles (type desktop). Aussi, dès lors qu’un lecteur d’écran supportait les barres demenu du système d’exploitation, il est virtuellement à même de supporter lesenrichissements ARIA des pages Web, via les API d’accessibilité.Par conséquent, en pratique, une large part du support d’ARIA repose ici sur le navigateuret sa qualité à communiquer le rôle de l’élément « menubar » à l’API. Pourtant, lesdéveloppeurs ont dû adapter leurs solutions logicielles pour prendre en compte lesinformations rendues disponibles par le navigateur (notamment pour les contrôles claviersdes lecteurs d’écran). De nouvelles fonctionnalités d’aide à la navigation ont également étéajoutées.6 WAI-ARIA 1.0 User Agent Implementation Guide : http://www.w3.org/TR/wai-aria-implementation/. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  21. 21. WAI-ARIA et lexpérience Web page 21 sur 30Un bon exemple de documentation sur la prise en charge des spécifications ARIA a étépublié par Freedom Scientific, pour JAWS :http://www.paciellogroup.com/blog/2010/10/jaws-support-for-aria/.Au contraire des deux précédents acteurs, le groupe de travail WAI-ARIA n’a pas proposéde document référence à l’intention exclusive des développeurs d’assistant utilisateur. Onpeut en effet considérer la tâche moins cruciale, étant donné qu’il s’agit de leur cœur demétier. Ils ont, de fait, tout intérêt à profiter au mieux de ces nouveaux apports en cours destandardisation.ARIA et l’expérience utilisateur Le ressenti des utilisateurs - déficients ou non - face au web 2.0 Survey of Preferences of Screen Readers Users (2009)A qui les spécifications ARIA profitent-elles ? 1. Aux personnes non-voyantes : ARIA permet d’offrir aux utilisateurs de lecteurs d’écran une expérience de navigation similaire à la navigation visuelle dont bénéficie toute personne valide. En donnant accès et vie à des applications Web désormais communes qui, bien que dynamiques et interactives pour une personne valide, restent statiques et bloquantes pour les personnes non-voyantes, ARIA met les internautes sur un pied d’égalité. 2. Aux personnes déficientes de manière générale : ARIA permet aux utilisateurs ne pouvant pas utiliser de souris, par exemple, une navigation au clavier plus aisée et intuitive que celle que l’on trouve naturellement sur une page n’implémentant pas Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  22. 22. WAI-ARIA et lexpérience Web page 22 sur 30 les spécifications en question, notamment par la précision de l’attribut HTML tabindex contrôlant le focus ou par la définition de zones sémantiques dans le document. 3. Aux personnes non-déficientes : d’une manière générale, tout le monde aurait un avantage à ce qu’ARIA soit implémenté, sous réserve bien sûr que les producteurs de contenus qui alimentent le Web anticipent et prennent en compte les recommandations du W3C. La navigation au clavier nest pas réservée aux personnes déficientes, de nombreuses personnes valides naviguent de cette façon par souci de confort ou tout simplement car leur niveau dexpertise de lapplication ou de la machine qui la supporte leur permet davoir recours à ce mode de navigation. Il en va de même pour les lecteurs décrans, certains utilisateurs valides – même sils représentent une petite minorité – les utilisent pour des raisons diverses (essentiellement pour effectuer des tests ou pour vérifier le niveau daccessibilité de certains sites).ARIA ne pose aucun problème de rétrocompatibilité, c’est une amélioration pour tousmême si l’on en a pas un usage courant ou averti, il s’inscrit dans une démarche positivevoulue par le consortium. Bien au-delà des fonctionnalités et des widgets auxquels ilpermet daccéder, que ce soit des menus dynamiques, des sliders, ou bien encore deslecteurs audio/video, ARIA permet avant tout à un public quasiment complet de pouvoirprofiter de tous les avantages du Web.Cela passe notamment par un meilleur accès aux réseaux sociaux pour les personnesdéficientes – aujourdhui devenus presque indispensables pour une vie sociale épanouie –mais également par la libération des produits culturels auparavant enfermés dans descapsules de type lecteur Flash. Cela sinscrit donc bien dans la démarche du W3C visant àfaire du Web une place ouverte, lopen Web, où chacun aurait un accès équitable etéquivalent aux ressources, quelles soient culturelles ou non.Un outil dont il faut pouvoir et savoir se servirAvant même de se poser la question de la maîtrise techniques des outils dassistance à lanavigation, il faut considérer laccès même à ces ressources. En effet, tout comme lon nepeut exclure les utilisateurs de navigateurs obsolètes lors du processus de production dunsite Web, il est nécessaire de toujours considérer les utilisateurs les moins bien dotés.Les spécifications ARIA sont aujourdhui largement compatibles avec lensemble desnavigateurs ainsi quavec la plupart des lecteurs décran modernes du marché (JAWS étantencore majoritaire). Cependant, il existe de gros problèmes de compatibilité avec des outilsplus anciens et un certain nombre dutilisateurs peuvent donc se trouver exclus – même sice nest que temporaire. On trouve donc ça et là des recommandations mettant en avant ceproblème et préconisant une certaine prudence, Mozilla conseille en effet dutiliser ARIAen ayant conscience des utilisateurs minoritaires :« Implementations vary and older technologies dont support it well (if at all). Use either Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  23. 23. WAI-ARIA et lexpérience Web page 23 sur 30 "safe" ARIA that degrades gracefully, or ask users to upgrade to newer technology. » https://developer.mozilla.org/en/ARIALes limites dARIA ne se situent pas seulement au niveau matériel, la bonne utilisation dece système requiert en effet un certain nombre de connaissances tant des navigateurs quedes lecteurs décran et cela peut poser certains problèmes de navigation à des utilisateurspeu expérimentés. En effet, il faut bien considérer quau-delà des simples contraintes liéesà la possession de loutil, le niveau dexpertise de celui-ci peut rapidement remettre encause son usage. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  24. 24. WAI-ARIA et lexpérience Web page 24 sur 30 Les compétences informatiques des utilisateurs de lecteurs décran. Survey of Preferences of Screen Readers Users (2009)Bien que peu récentes, ces statistiques montrent bien quun nombre non-négligeabledutilisateurs – quils soient déficients ou non – manquent de compétences techniques tantface aux outils de navigation quaux outils dassistance.Au-delà du niveau dexpertise, les utilisateurs nont pas tous le même usage de ces outils.En effet, tout comme bon nombre dutilisateurs valides se contentent dun niveau demaîtrise relativement faible des outils quils utilisent quasi-quotidiennement, il nest passurprenant de retrouver la même tendance chez les utilisateurs déficients.Cela sexplique principalement par la qualité des outils disponibles sur le marché, qui nenécessitent pas de grandes compétences pour être utilisés de manière basique et répondreà des besoins fondamentaux, mais également par simple méconnaissance des possibilités.Dune manière générale, ce constat est plutôt positif, il témoigne de la volonté desproducteurs doutils techniques de démocratiser leurs produits et den étendre lusage àune majorité dutilisateurs. Cependant, dans le cas dARIA, certains éléments requièrentune expertise certaine pour exploiter au mieux les fonctionnalités prévues par lesspécifications. Usage des landmarks dARIA Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  25. 25. WAI-ARIA et lexpérience Web page 25 sur 30 Survey of Preferences of Screen Readers Users (2010)ARIA est encore mal connu, on voit que plus de 30% des utilisateurs nont pasconnaissance dune fonctionnalité pourtant centrale, les landmarks. Alors même quARIAest directement développé à légard des utilisateurs de lecteurs décrans par exemple, onconstate que beaucoup dentre eux nutilisent que peu ou pas ses avantages. Est-ce parchoix ou par simple méconnaissance ? Il est difficile de trancher.Quoiquil en soit, les chiffres ne sont pas vraiment positifs : en tout et pour tout, seulement14.5% des utilisateurs ont recours aux landmarks, on imagine que les chiffres ne sont guèremieux concernant les autres fonctionnalités que propose ARIA, il existe donc un réelproblème d’acclimatation aux nouvelles technologies dassistance. En effet, cette mêmeétude montre quen 2010 environ 37% des utilisateurs estimaient que le Web étaitaujourdhui plus accessible quavant, contre plus de 45% en 2009.Ces données doivent malgré tout être nuancées, on constate en effet quune grandemajorité des utilisateurs concernés prévoient une nette amélioration de laccessibilitégénérale des sites Web dans un futur proche, notamment grâce à des technologies commeARIA, il ne faut donc pas juger le travail en cours sur ces quelques retours pessimistes.Dans cette optique, on peut également noter quARIA saccompagne dune communautéactive – qui rejoint celle, plus large, qui soutient et développe laccessibilité Web auquotidien – et quun grand nombre de ressources sont disponibles sur la toile de manièreouverte et libre, provenant du W3C ou non. Alors que les utilisateurs pouvaient se trouverconfrontés à un silence contraignant en termes de feedback ou tout simplementdassistance, il existe aujourdhui un réel support technique et éthique des questionsdaccessibilité et cela ne peut que favoriser lessor de technologies telles quARIA.Il existe donc encore beaucoup de contraintes liées à lutilisation de matériel inadapté, àdes mises à jour de logiciels trop peu fréquentes, ou tout simplement au manque deconnaissances précises pour personnaliser les logiciels dassistance et donc les utiliserefficacement, mais on peut assez aisément imaginer un futur optimiste dans ces domainescar les conditions sont aujourdhui bien plus favorables quavant.Implémenter... mais pas que !Limplémentation dARIA soulève, au delà de son simple fonctionnement technique, uncertain nombre de questions dergonomie, notamment pour les personnes voyantes. Mêmesi techniquement tout fonctionne, il faut prendre en compte les conventions et standardsde l’ergonomie Web pour offrir un usage optimal de l’outil. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  26. 26. WAI-ARIA et lexpérience Web page 26 sur 30 Interface de Gmail, exemple dimplémentation dARIA dans une application riche (2012)Si lon prend lexemple de linterface principale de Gmail, on peut voir que certainesfonctionnalités utilisent ARIA, notamment les menus déroulants qui apparaissent en hautde page et qui donnent accès aux réglages et aux fonctions annexes. Il suffit donc denaviguer jusquau lien « Paramètres » par exemple, grâce à la touche tabulation, pourensuite avoir accès au sous-menu déroulant correspondant, tout ceci en utilisantuniquement le clavier. Une fois activé, on peut donc naviguer au sein du menu avec lestouches fléchées du clavier, ce qui est très agréable en termes de confort et qui permetsurtout daccéder facilement aux liens dordinaire « masqués » aux lecteurs décrans.Seulement, comme souvent dans les questions informatiques, le bon fonctionnementtechnique dun module est nécessaire mais pas suffisant, il est nécessaire de toujoursconsidérer lutilisateur et donc des questions ergonomiques qui aideront à rendre cemodule utilisable. Dans le cas de ce menu déroulant de Gmail, on comprend donc quedonner laccès aux « sous-informations » aux utilisateurs de lecteurs décrans estimportant mais que cela implique de réfléchir à la manière de lui faire comprendre quil y adésormais accès.Ici, Google répond parfaitement à cette question en renforçant laffordance du bouton« Paramètres». Tant visuellement quauditivement (par un attribut), il est clair que cebouton donnera accès à du contenu secondaire, graphiquement symbolisé par la petiteflèche pointant vers le bas, un standard ergonomique. Il faut donc bien garder à lesprit,lors de limplémentation dARIA, que cest un travail de fond et de forme, il ne faut négligeraucune de ces deux dimensions pour obtenir un résultat satisfaisant, qui nest autre que laréussite ou léchec de laccès à linformation.ARIA peut-il devenir une gêne ?Les attributs de régions actives, « live regions », permettent détablir des zones se mettantpotentiellement à jour dans le document et davertir lutilisateur déventuels ajouts oumodifications de contenus. Il existe notamment une valeur rude qui va littéralement Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  27. 27. WAI-ARIA et lexpérience Web page 27 sur 30stopper lutilisateur dans sa navigation afin de le prévenir dune mise à jour. Cettepratique, plutôt brutale, peut facilement aller à lencontre du but premier delimplémentation dARIA à savoir favoriser le repérage et la compréhension dun documenttout en laissant lutilisateur totalement libre de ses choix et de ses actions.Il se peut également, en cas de mauvaise implémentation, que la sémantique dHTMLentre en conflit avec la sémantique dARIA et porte ainsi atteinte à laccessibilité dunepage, cest pourquoi lutilisation des spécifications reste encore difficile ou du moinslaborieuse à mettre en place car elle requiert de nombreux tests et donc des coûtssupplémentaires qui, souvent, sont laissés de côté.ARIA en quelques points 1. ARIA représente un progrès indéniable en matière daccessibilité web de part son ouverture et sa philosophie. 2. ARIA tend à devenir un standard, il sinscrit pleinement dans la vision positive du W3C. 3. ARIA permet daccéder à des contenus riches et dynamiques sans contraintes, cest une porte sur le web 2.0 qui a longtemps été fermée aux personnes déficientes. 4. Il reste hasardeux et peu (ou mal) implémenté, mais sa progression est encourageante.La mise en avant de la structure sémantique des différentes zones d’un document dit« riche » est souvent problématique en termes d’accessibilité, les spécifications ARIA y ontd’ailleurs parfaitement répondu en introduisant le concept de « landmarks ». Seulement,certains pans d’ARIA – et notamment les landmarks – semblent aujourd’hui perdre de leurintérêt car l’arrivée d’HTML5 a permis une nette amélioration dans ce domaine. Leslandmarks spécifiés par ARIA (main, navigation, banner, etc...) sont en effet renduesobsolètes ou du moins redondantes par les nouvelles balises intégrées dans HTML5.On peut aujourd’hui contourner une écriture de type <div id="nav"role="navigation">…</div> en s’appuyant sur des balises sémantiques comme<nav>…</nav> tout en conservant les mêmes bénéfices et en simplifiant le code source.Cependant, HTML 5 ne sera pleinement utilisé et utilisable que d’ici quelques années etARIA reste donc tout à fait pertinent sur bon nombre de points. On peut dailleurs espérerquil sera un jour nativement intégrée au langage HTML et quil ne sera donc plusnécessaire de « faire leffort » de rendre un site accessible, il le sera par défaut, de manière Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  28. 28. WAI-ARIA et lexpérience Web page 28 sur 30naturelle. Ce futur est encore lointain, de part la médiocrité trop souvent notable de lamajorité des sites actuellement en ligne sur le Web, mais le développement continu destechnologies dassistance et des standards daccessibilité laisse imaginer une progressioncertaine et positive.ConclusionLes implémentations existent et se multiplient, tandis que les outils d’éditions les plusrépandus (Drupal, WordPress…) intègrent désormais ARIA. Cependant, qui, parmi lesproducteurs de site Web, fait de réelles études auprès des utilisateurs concernés par cesspécifications ?Il est de fait très difficile d’en quantifier les bénéfices exclusifs. D’autant plus difficile quede telles améliorations sont très souvent accompagnées de refontes plus profondes, quiimpactent un public trop hétérogène pour être analysé finement.Nous pensons qu’une approche qualitative pour l’étude d’une expérience utilisateur dansl’usage d’application Web riches offrirait un point de vue intéressant et indispensable pourla compréhension et l’utilisation efficiente des spécifications ARIA. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  29. 29. WAI-ARIA et lexpérience Web page 29 sur 30GlossaireAAgent UtilisateurEn anglais, « user agent ». Logiciel interface de l’utilisateur. Dans une topologie client-serveur d’un réseau informatique, l’agent utilisateur est le client, c’est la dernière briquelogicielle avant l’utilisateur du service. Pour le Web navigateur (Microsoft InternetExplorer, Mozilla Firefox, Google Chrome, Safari, Opera…).AJAXAsynchronous Javascript and XML. Technologie de développement web basé sur leJavaScript qui permet une communication entre différentes entités d’une page web etdifférents langages : Javscript, CSS, XML… Cet ensemble de langage permet de construiredes contenus dynamiques.APIApplication Programming Interface. C’est une interface fournie par un programmeinformatique. Les API permettent aux programmes d’interagir les uns avec les autres.Assistant UtilisateurEn anglais, « assistive technology ». Dispositif d’aide technique aux utilisateurs déficients.Les lecteurs d’écran (tels que JAWS, NVDA ou Voice Over) sont les plus connus, mais il y aaussi des dispositifs d’aide à la saisie ou des systèmes de pointage alternatif, des loupesd’écran… etc. Les possibilités sont infinies.LLandmarksZones définie dun document. Lattribut role propose un ensemble de valeurs permettantde définir les grandes structures de la page. Ces repères peuvent servir de point denavigation (de manière similaire aux titres) dans la structure pour naviguer rapidement. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM
  30. 30. WAI-ARIA et lexpérience Web page 30 sur 30PProtocols and Formats Working GroupC’est le nom du groupe de travail qui se réunit pour produire les documents du W3C etplus précisément ceux des spécifications ARIA.RRich Interactive ApplicationsCe sont les applications dynamiques, les contenus dits « riches » ou encore les « contenusdynamiques interactifs ». Ce sont des zones d’une page Web qui se mettent à jourrégulièrement et indépendamment du reste de la page.WWAI“Web Accessibility Initiative” regroupe un ensemble de recommandations du W3C quiconcerne spécifiquement l’accessibilité du web.W3CWorld Wide Web Consortium. Le W3C est un organisme à but non lucratif, regroupant unecommunauté internationale pour travailler autour des standards ouverts et assurer au Webun développement pérenne.XXMLHttpRequestC’est un objet du langage de développement JavaScript qui permet une communicationdirect entre la page Web et le serveur. C’est cette technologie qui permet justement lerafraîchissement d’une zone d’une page. Université Michel de Montaigne – Bordeaux 3 | Master CPEAM

×