Les opérateurs télécom doivent rendre une page accessible

Sophie Schuermans le 04/10/2013

L'institut Belge des Postes et Télécommunications (IBPT) a publié le 28 mars 2013 une décision concernant la publication par les opérateurs des informations sur les produits et services destinés aux utilisateurs handicapés.

Par cette décision, l'IBPT impose aux opérateurs de télécommunication tels que Telenet, Belgacom, Mobistar et d'autres également, d'avoir sur leur site web une page qui:

  • contient toute l'information sur les services que l'opérateur offre spécifiquement pour les personnes handicapées (par exemple le tarif social) ,
  • est accessible à partir de la page d'accueil en maximum deux clics,
  • est conforme aux critères AnySurfer.

Nous applaudissons le fait que l'IBPT prenne des initiatives visant à encourager les opérateurs à rendre leurs services et leurs informations plus accessibles. Mais la décision ci-dessus n'aura pas l'effet désiré. Nous déplorons de n'avoir pas été impliqués dans la réflexion qui a conduit à la rédaction de cette décision.

Quel est l'objectif que vise l'IBPT?

Dans son plan stratégique, l’IBPT s’est promis de veiller à ce que les personnes handicapées puissent bénéficier de manière optimale des offres de communications électroniques en termes de choix, de prix et de qualité.

En demandant aux opérateurs de publier une seule page accessible on n'aide pas le public visé. Les personnes handicapées peuvent très souvent utiliser les mêmes produits et services que le reste de la population. Elles veulent, comme tout le monde, savoir quels sont les prix et les conditions pour pouvoir téléphoner, utiliser internet et regarder la TV. Sur la page "pour personnes handicapées" on n'indique pas combien de gigabytes sont compris dans un abonnement King de Telenet ou combien coûte l'abonnement Dauphin de Mobistar.

Greenwashing

La politique actuelle part du principe qu'une seule page suffit pour informer les personnes handicapées. Elle ne stimule pas les opérateurs pour réellement travailler à rendre leur information accessible. Au contraire. Ils ne doivent publier qu'une seule page accessible. Ils sont alors en règle. Cet argument va sans aucun doute être utilisé ensuite pour ne pas en faire plus.

On peut faire un parallèle avec la pratique du 'greenwashing'. Ce terme est apparu pour décrire la pratique des hôtels qui demandent à leurs clients de réutiliser les essuies pour épargner l'environnement mais qui ne font pas grand-chose comme autres efforts dans le domaine de l'écologie. Un opérateur télécom pourrait ici rendre une seule page accessible et se donner une image 'accessible' sans avoir fait de réels efforts pour rendre réellement les informations et services accessibles à tous.

Que proposons-nous?

Il y a beaucoup de manières d'améliorer à terme l'accessibilité de l'information proposée par les opérateurs télécom belges. Quelques exemples:

  • Sensibiliser et former le personnel de ces opérateurs (conscientisation)
  • Former à l'accessibilité les prestataires web qui construisent leurs sites
  • Faire une audit accompagné de conseils pour un site entier ou des parties essentielles
  • Accompagner les opérateurs lors de la construction ou de la refonte d'un site web
  • Faire tester des fonctionnalités importantes du site par des personnes handicapées.

Nous comprenons qu'il n'est pas évident de rendre un site complètement accessible du jour au lendemain. Mais ce n'est pas une excuse pour ne rien faire. Commencez avec les fonctions les plus importantes, comme la navigation, et avec le contenu le plus important. Ce n'est pas le rapport annuel mais l'information sur les abonnements, les promotions et les prix.

Une autre option serait peut-être la création d'un nouveau site qui rassemblerait les informations des différents opérateurs pour donner aux clients potentiels une vue d'ensemble accessible et compréhensible.

Rectification

Enfin, nous souhaitons faire une rectification par rapport à un mythe qui est évoqué dans la décision de l'IBPT. Belgacom, qui a été consulté lors de la rédaction de la décision, fait la remarque suivante:

Belgacom a des remarques fondamentales concernant l'exigence selon laquelle la page Internet destinée aux personnes handicapées devrait obtenir le label AnySurfer. Belgacom estime que l'architecture du site Internet que ce label impose entre en conflit avec l'architecture des sites commerciaux.

C'est totalement incorrect. Les normes d'accessibilité (WCAG niveau A = AnySurfer checklist) reviennent pour la plus grande partie à suivre les standards du web. Il est parfaitement possible de créer un site commercial qui est également accessible. Prenez l'exemple de a book apart. Ce site prouve également qu'un site accessible peut avoir un beau design. Les livres qui y sont proposés sont d'ailleurs également une excellente source d'information sur les standards du web. C'est avec plaisir que nous en offrirons un à la personne chez Belgacom qui est l'auteur de la citation ci-dessus.

Réagissez

Sensibiliser les étudiants à l'accessibilité

Sophie Schuermans le 16/09/2013

Chaque année des jeunes fraîchement diplômés en graphisme, en web design, en informatique arrivent sur le marché du travail. Parmi ceux-ci il y en a un bon nombre qui commencent leur carrière dans le domaine du web. Quand ils se trouvent face à un client qui leur demande de concevoir un site accessible, ou devant un cahier des charges qui demande que le site web porte le label AnySurfer, est-ce qu'ils savent ce que cela signifie? La réponse est sans doute de plus en plus souvent oui, mais il y a encore un énorme travail de sensibilisation à faire.

Pour que les sites web qui seront conçus dans le futur soient plus accessibles, chaque année AnySurfer parle d'accessibilité numérique dans une dizaine d'écoles supérieures ou universités et fait participer les étudiants de ces écoles à l'élaboration du moniteur de l'accessibilité. Nous voudrions faire participer plus d'écoles francophones cette année.

Objectif

Notre objectif est de sensibiliser les futurs professionnels du web à l'importance de concevoir des sites web lisibles et utilisables par tous, indépendamment de l'équipement utilisé ou du handicap.

Méthode

Comment cela se passe-t-il? Lors d'une présentation d'environ 2 heures, en partant de 10 profils d'utilisateurs différents, par des démonstrations et des exemples sur des sites web existants nous sensibilisons les étudiants au fait qu'il existe de nombreuses manières d'utiliser un ordinateur et de percevoir l'information. L'accessibilité concerne beaucoup de monde. En suivant les standards du web et les bonnes pratiques d'accessibilité ils pourront concevoir des sites web que tout le monde peut utiliser.

Pour mettre la théorie en pratique, nous proposons aux étudiants un exercice pratique d'évaluation de site web. L'exercice peut se faire de manière individuelle ou sous forme d'atelier, en notre présence.

Le résultat concret de tout cela c'est le moniteur de l'accessibilité, une sorte de baromètre de l'accessibilité des sites web en Belgique. Mais c'est surtout l'occasion de faire découvrir l'accessibilité numérique aux étudiants ou de leur en rappeler l'importance.

Pour participer

Nous sommes en train de faire le planning pour l'année académique 2013-2104. Si vous donnez cours dans une école qui forme des futurs professionnels du web et que vous pensez que notre intervention pourrait bien s'intégrer dans le programme de cours de vos étudiants, contactez-nous. Nous pourrons répondre à vos questions et fixer une date pour une intervention dans votre école.

Réagissez

Windows 8 pour les personnes aveugles et malvoyantes

Pierre Jourdain le 13/08/2013

Ci-dessous vous trouverez la traduction du rapport de tests sur Windows 8 publié dans le magazine trimestriel Infovisie MagaZIEN par Jos Verhaegh et Jeroen Baldewijns de Blindenzorg Licht en Liefde vzw, également publié sur la version néerlandaise de ce blog sous le titre Windows 8 voor blinden en slechtzienden.

1. Présentation

Windows 8 est disponible depuis quelques mois déjà. Contrairement aux versions précédentes, son apparence a complétement été renouvelée.

logo Windows 8

Que ceux qui préfèrent continuer à travailler dans un environnement familier ne s'inquiètent pas: le bureau de Windows7 est maintenu. Nous y reviendrons plus loin dans l'article.

Nous avons testé Windows 8 sur le matériel le plus utilisé actuellement par les personnes aveugles et malvoyantes, à savoir un ordinateur de bureau normal et un ordinateur portable.

2. Qu'y a-t-il de changé dans Windows 8 ?

Microsoft a donné un nouveau look à Windows. La nouvelle interface Metro apparaît immédiatement. Elle se compose d'un écran de démarrage montrant les différentes tuiles positionnées l'une à côté de l'autre. Les tuiles ressemblent à des icônes géantes comme celles du bureau classique, mais placées dans de grandes surfaces colorées.

écran de démarrage avec les tuiles

Ces tuiles représentent non seulement des programmes mais aussi des flux d'informations, comme Facebook ou Twitter, les e-mails, la météo, les actualités... Ces tuiles peuvent être cliquées avec la souris, mais sont également accessibles avec le clavier. Cela permet d'ouvrir un programme ou, comme on dit aujourd'hui, une app. Microsoft a donc aligné l'interface de son système d'exploitation pour ordinateurs avec celle de ses versions mobiles: Windows 7 Phone et Windows 8 Phone.

A côté de l'écran d'accueil de l'interface Metro, le bureau classique est toujours présent, comme nous le connaissons depuis les anciennes versions de Windows. Cela permet d'assurer la compatibilité de Microsoft Windows 8 avec les anciens programmes. Office 2010, peut être démarré depuis l'ancien bureau. Ce sera probablement valable jusqu'à ce que Office 2013 arrive sur le marché. Sur le bureau, vous trouverez aussi l'«ancien» explorateur. Mais il a changé. L'interface de base, une colonne à gauche avec l'arbre et à droite une fenêtre avec les fichiers est conservée. Malheureusement la barre de menu a disparu et a été remplacée par des rubans comme nous les connaissons depuis Microsoft Office 2007 et 2010. Comme avec Office ce seront donc de nouveaux raccourcis pour obtenir de l'aide accessible avec les touches fléchées.

Le bouton Démarrer du menu Démarrer a également été supprimé. La touche Windows n'ouvre plus le menu Démarrer. Vous utiliserez cette touche pour passer de l'interface Metro à la classique et vice-versa. En bas du bureau classique, vous trouverez la barre des tâches, où vous pourrez travailler avec les différents programmes, documents et dossiers ouverts comme vous le faisiez avec les précédents versions de Windows. Vous pourrez ouvrir un menu similaire au menu démarrer en utilisant le raccourci Windows + X. Ce menu peut également être appelé en plaçant le curseur de votre souris dans le coin inférieur gauche de l'écran et en appuyant sur le bouton droit de la souris. Un écran de menu apparaît. Malheureusement il n'y a pas de bouton visuel où cliquer, ce qui rend l'opération difficile.

Une autre nouveauté de Windows 8 est la "Charm Bar" (également appelée menu contextuel) de l'interface Metro. On l'ouvre en déplaçant le curseur de la souris dans le coin supérieur droit de l'écran d'accueil ou avec le raccourci clavier Windows + C. Dans cette barre, qui apparaît sur le bord droit de l'écran, vous trouverez les éléments suivants: rechercher, partager (photographies ou d'autres documents), accueil (retour à l'écran d'accueil), périphériques (un autre appareil par exemple, l'utilisation d'un second écran) et paramètres.

la charm bar

L'App Bar que vous ouvrez avec le raccourci Windows + Z est une autre nouveauté du système. Elle contient les fonctions disponibles pour l'application dans laquelle vous travaillez. Si vous ouvrez l'APP Bar à partir de l'écran de démarrage, vous verrez un seul bouton dans l'App Bar: un bouton pour obtenir une vue d'ensemble de tous les programmes installés, aussi bien les applications Windows 8 que les programmes Windows plus anciens.

L'interface des véritables applications Windows 8 (ce sont les applications que l'on démarre depuis l'interface Metro) est complètement différente de celle à laquelle vous êtes habitué. Mais est-elle moins accessible? Nous n'irons pas jusque-là, mais les développeurs des applications écrites pour Windows 8 devront faire l'effort nécessaire pour garantir l'accessibilité de leurs apps.

L'interface de Windows 8 a donc été revue radicalement et offre un nouvel environnement aux utilisateurs bien que l'ancienne interface soit toujours en partie disponible. Nous allons maintenant brièvement examiner ​​les versions disponibles. Comme d'habitude, il y a plusieurs variantes. Windows 8 est disponible en trois variantes pour un usage personnel: Windows 8, Windows 8 Pro et Windows RT. Ce dernier est destiné aux tablettes ou smartphones et ne peut donc être acheté séparément. Cette version est la seule à ne plus utiliser l'ancien bureau.

3. Options d'accessibilités de Windows 8

Il était annoncé sur ​​divers forums que Windows 8 offrirait plusieurs nouvelles options d'accessibilité. Malheureusement, ces prédictions ne se sont réalisées que très partiellement.

Lecteur d'écran

Narrateur est le logiciel de lecture d'écran de Windows 8. Celui-ci vocalise en français mais ne supporte pas le braille. Les ajustements du Narrateur (comme beaucoup d'autres fonctions) se font depuis l'ancien bureau, ce qui est très déroutant.

Les fonctionnalités du Narrateur sont plus nombreuses par rapport aux versions précédentes, mais il reste beaucoup à améliorer. Vous ne pouvez par exemple pas régler le type-echo à votre guise. Vous ne pouvez pas naviguer entre les éléments structurants (titres, liens, listes, ...) d'un document. Vous ne pouvez pas ajouter des étiquettes aux éléments d'interface sans étiquette. Et comme déjà dit: il n'y a pas de support pour le braille. Les possibilités du Narrateur sont donc encore trop limitées pour pouvoir être considéré comme un lecteur d'écran à part entière.

Pour conclure sur une note positive: vous pouvez facilement trouver sur le site de Microsoft, un manuel d'utilisation en français du Narrateur.

Agrandissement

La loupe qui permet de zoomer en plein écran dans Windows 7 n'est utile que dans les thèmes dits Aero. Dans Windows 8 la loupe fonctionne avec tous les autres thèmes. Cela signifie que vous pouvez maintenant utiliser la loupe en combinaison avec les thèmes de contraste élevé. Il est facile de configurer les thèmes à contraste élevé. Les cadres et les exemples clairs dans le menu des paramètres font en sorte que l'on a une meilleure vue d'ensemble.

menu de configuration en haut contraste

Note: revenir à l'ancien thème Windows XP n'est pas possible. Les thèmes à contraste élevé sont également appliqués à la nouvelle page d'accueil, mais sans permettre d'agrandir le texte dans les tuiles

écran de démarrage avec les tuiles en haut contraste

Le centre d'accessibilité (encore une fois bien caché, il se trouve et fonctionne sur l'ancienne interface) offre la possibilité de changer la couleur et la transparence des fenêtres afin que les utilisateurs malvoyants souffrent moins de la transparence des fenêtres sur les thèmes Windows standard. L'adaptation de la taille de police par défaut a également fait l'objet d'une amélioration majeure. En plus d'ajuster la taille des caractères pour tous les élément, vous pouvez ajuster la taille de la police pour un élément d'interface spécifique.

menu agrandissement de la taille des textes

titre avec grandes lettres

De cette façon, vous pouvez en tant qu'utilisateur malvoyant, afficher les textes de la barre de titre en petits caractères, mais afficher les menus en plus grand caractères. Ceci permet de récupérer plus d'espace (et donc de vue d'ensemble) sur l'écran. Ces paramètres peuvent bien sûr être utilisés avec les systèmes de contraste élevé.

Ces paramètres sont ajustés depuis le panneau de commande sur le vieux bureau (dans un panneau de dialogue que nous connaissons depuis Windows 7). Les options d'accessibilité auxquelles vous avez accès dans les paramètres, sont très limitées.

Paramètres - Options d'ergonomie

Ainsi vous ne pouvez activer ou désactiver ici que la fonction de contraste via un curseur. Pour ajuster les paramètres du contraste élevé, vous devez entrer dans les paramètres d'accessibilité sur le vieux bureau. La nouveauté est que l'on a la possibilité d'augmenter tout le contenu de ​​l'écran. Malheureusement, nous n'avons pas pu tester cela car notre ordinateur de bureau et notre portable ne supportent pas cette fonction. Nous avons fait une recherche sur le site Web pour essayer de comprendre ce que cette fonction doit faire exactement, mais en vain ...

Microsoft a donc intégré toute une série de fonctions d'agrandissement dans son nouveau système d'exploitation. Nous avons trouvé cela assez irritant que ces fonctions soient dispersées entre l'ancien écran de configuration et le nouveau panneau de paramètres de l'écran de démarrage. Nous ne comprenons pas pourquoi.

Point positif: on trouve facilement sur le site web de Microsoft un manuel d'utilisation de la loupe en français. Mais nous avons cherché en vain des explications concernant certaines autres fonctions d'accessibilité pour les malvoyants.

4. Windows 8 et les aides techniques

En plus des fonctionnalités d'accessibilité de Windows lui-même, les aides techniques restent une nécessité. Nous allons donc examiner dans quelle mesure les outils actuels sont déjà disponibles pour Windows 8.

Nous n'avons pas pu faire de tests étendus car (comme vous allez le remarquer) l'offre n'est pas très fournie.

Dolphin

La famille Supernova (actuellement la version 13) n'est pas compatible avec Windows 8. Il faudra attendre la future version 13.5, qui sera une mise à jour gratuite pour tous les utilisateurs de Supernova 13. Supernova 13.5 est attendu plus tard cette année.

Freedom Scientific

Freedom Scientific a rendu la version 14 de son lecteur d'écran JAWS entièrement compatible avec Windows 8. Cette version de JAWS est diponible en français.

Les utilisateurs qui ont acheté la version 13 de JAWS après le lancement de la version 14 anglaise pourront réaliser gratuitement la mise à jour.

La version 12 du programme d'agrandissement Magic a récemment été publiée, mais celle-ci n'est pas encore compatible avec Windows 8.

Ai Squared

Ai Squared, le producteur de ZoomText Magnifier (/ Reader), a annoncé qu'ils travaillent à rendre la version 10 de ZoomText entièrement compatible avec Windows 8. Ce serait une mise à jour gratuite pour les utilisateurs de ZoomText version 10 et elle serait encore disponible au cours du premier semestre de cette année. Nous avons pu essayer une version beta, mais ce serait une injustice pour le produit de publier déjà des résultats.

Nous n'avons pas parlé de ZoomText Express. Mais il sera peut-être adapté après son grand-frère ZoomText Agrandisseur/Lecteur.

GW Micro

GW Micro a publié la version 8 de son lecteur d'écran. Cette version est compatible avec Windows 8 et est disponible en français.

Baum

Baum aussi vient de sortir la nouvelle version 10 de son lecteur d'écran Cobra, qui est déjà disponible en français. Cette version n'est pas encore compatible avec Windows 8. Ils y travaillent intensément et devrait être terminé cette année.

NVDA

NVDA est un lecteur d'écran open source (gratuit donc), qui tente d'offrir une alternative aux programmes de lecture d'écran commerciaux coûteux. Par défaut, e-Speak est fourni, donc ceux qui veulent une meilleure synthèse vocale doivent l'acheter. Les fabricants de NVDA indiquent que le programme est déjà compatible avec Windows 8.

Notre premier test a montré que ce n'est malheureusement pas tout à fait le cas. Les 'anciens programmes' qui s'exécutent sur l'interface classique sont généralement utilisables. Les problèmes surgissent lorsqu'on exécute ces programmes dans le nouvel environnement Metro. Par exemple, l'application de messagerie par défaut prononce mal le contenu des mails. Les développeurs ont encore du pain sur la planche.

Autres logiciels

Dolphin a rendu le logiciel Guide (pour faciliter l'emploi de l'ordinateur) compatible avec Windows 8. Dès que Guide version 6 a démarré, vous n'êtes plus en contact avec la nouvelle interface de Windows 8.

Easy Reader et Easy Producer, les produits Daisy de Dolphin, sont déjà compatibles avec Windows 8. En ce qui concerne les programmes de reconnaissance de texte, Kurzweil 1000 version 12 est compatible Windows 8. Par contre sur les sites web de OpenBook et MagniRead, nous n'avons trouvé aucune information concernant Windows 8.

Hardware

Il est impossible de faire un relevé complet de la compatibilité des plages de lecture braille avec Windows 8. Demandez à votre fournisseur si votre appareil est compatible. Ceci s'applique aussi aux scanners.

Les imprimantes braille Index Basic et Everst sont compatibles Windows 8 si la version de leur firmware est 12.03.5 (ou supérieure). En ce qui concerne les imprimantes ViewPlus nous n'avons trouvé aucune information en relation avec Windows 8.

En résumé

L'histoire se répète. Chaque fois que Microsoft sort une nouvelle version de son système d'exploitation, les producteurs d'outils commencent une course contre la montre pour rendre leur produits compatibles. En attendant, il est conseillé aux utilisateurs d'aides techniques de continuer à utiliser l'ancienne version de Windows avec laquelle il se sont familiarisés. On se demande qui gagnera la course et arrivera le premier à livrer un produit compatible avec Windows 8.

À la fin de cette année, nous examinerons l'état ​​du marché et réaliserons un test complet des aides techniques compatibles avec Windows 8.

5. Conclusion

Il est possible pour les personnes malvoyantes d'utiliser Windows 8. Si vous pouvez vous contenter d'un facteur d'agrandissement réduit, que vous acceptez que tout ne peut pas être adapté à vos besoins, et pouvez accepter que les options de configuration sont dispersées, alors les adaptations d'accessibilité standard peuvent peut-être déjà vous aider partiellement. Mais si vous avez besoin d'un grand facteur d'agrandissement, un programme dédié reste un must.

Le soutien que le Narrateur de Windows 8 propose aux malvoyants est vraiment trop limité. Nous ne pouvons pas le considérer comme un lecteur d'écran à part entière. Un utilisateur aveugle devra donc encore faire preuve de patience en attendant que son lecteur d'écran habituel soit compatible avec Windows 8.

Le narrateur peut rendre de bons services si vous souhaitez utiliser un autre ordinateur que le votre (comme un ordinateur dans une bibliothèque publique).

Pour ceux qui ont vraiment besoin de passer à Windows 8, il n'y a pour l'instant que deux options: Narrateur avec ses limitations ou le lecteur d'écran open source NVDA. Il n'est donc pas intéressant pour les utilisateurs aveugles et malvoyants de passer à Windows 8. Et enfin: nous avons trouvé très étrange d'avoir constamment à passer de l'ancien bureau, vers le nouvel écran d'accueil, et vice-versa. Pour une personne ayant une déficience visuelle, passer à Windows 8 représente un investissement en temps et efforts pour apprendre à l'utiliser. Le passage à Windows 8 à partir d'une version antérieure de Windows signifie inévitablement réapprendre à travailler avec l'ordinateur. On peut se demander raisonnablement si les utilisateurs d'aides techniques ont vraiment envie de ça.

3 réactions

N'utilisez pas role="application"

Pierre Jourdain le 26/07/2013

Traduction de l'article en néerlandais Gebruik geen role="application"

Dans un post précédent, nous avons parlé de plusieurs rôles landmark WAI-ARIA. Si vous les utilisez dans vos pages, vous rendrez la navigation plus facile aux utilisateurs de lecteurs d'écran ainsi qu'à ceux qui naviguent avec le clavier. En ce qui concerne le landmark WAI-ARIA role="application" nous n'en avons pas parlé car vous ne devrez presque jamais l'utiliser dans vos sites web.

Que fait-il?

Lorsque vous utilisez role="application" pour un widget de la page web, le lecteur d'écran reçoit l'information que cette section doit s'utiliser comme une application de bureau. Toutes les fonctionnalités standard (Tabulation de lien en lien, utilisation des listes déroulantes avec les touches fléchées, annonce des titres et des listes, ...) que fournit le lecteur d'écran sont alors inhibées. Comme développeur, vous devrez tout reprogrammer vous-même..

A utiliser très rarement

On donne vite à un widget le nom d'application, mais cela ne signifie pas pour autant qu'on doive lui appliquer le role="application". Si le widget utilise les éléments HTML standards (listes déroulantes, cases à cocher, champs de saisie, liens, paragraphes,...), il n'y a pas de raison d'utiliser role="application". Les navigateurs et lecteurs d'écran ne doivent rien faire de particulier pour gérer ces éléments. Même si le widget est dynamique (comme un diaporama, vue arborescente, barre d'outil, menu, onglets,...), role="application" n'est pas nécessaire non plus. WAI-ARIA propose d'autres solutions ce qui fait que vous n'aurez pas besoin de programmer vous-même. Si vous utilisez les composants standards WAI-ARIA, les lecteurs d'écran seront plus à l'aise et vous n'aurez pas à réinventer la roue.

N'utilisez pas role="application" si cela n'est pas nécessaire. L'usage incorrect (lisez: inutile) de role="application" rend une page web ou une partie de celle-ci, totalement inutilisable pour les utilisateurs du clavier, les lecteurs d'écran et autres aides techniques. Le composant aura en effet, un tout autre comportement que celui attendu par l'utilisateur.

Quand l'utiliser?

Si votre widget est composé de moins de 10% de code HTML et est très interactif, role="application" peut être utile. Sont donc seulement concernés les widgets qui s'exécutent dans le navigateur mais qui sont plus proche d'une application de bureau que de contenu web.

Si vous l'utilisez, placez-le sur un seul élément. Celui qui contient le widget auquel il s'applique.

Encore une fois, si vous utilisez role="application", vous devrez vous-même programmer comment le widget va interagir avec le lecteur d'écran et le clavier et en apprendre le maniement à l'utilisateur. C'est un tout autre travail que de construire un site web et demandera des tests avec différents lecteurs d'écrans..

Conclusion

Vous n'allez presque jamais faire usage de role="application"!

Source: If you use the WAI-ARIA role "application", please do so wisely!

Réagissez

Support des rôles landmark ARIA et éléments sectionnants HTML5 par les lecteurs d'écran

Sophie Schuermans le 24/07/2013

Traduction de l'article en néerlandais HTML5, ARIA landmark roles en screenreaders.

Le HTML donne de la structure à l'information de votre site web et cela présente également des avantages pour l'accessibilité. Quelqu'un qui ne voit pas, ou pas bien, la page ne dispose pas d'une vue d'ensemble. Une bonne structure aide le visiteur à mieux comprendre l'information et à trouver plus facilement ce qu'il cherche. Il est bien connu que les lecteurs d'écran peuvent sauter de titre en titre et naviguer facilement dans les listes à condition que la structure de la page respecte la spécification HTML. Depuis peu il existe deux nouvelles manières d'ajouter de la structure à une page: les rôles landmark ARIA et les éléments sectionnants HTML5.

ARIA, recommandation candidate du W3C, doit permettre de rendre les environnements web plus accessibles. Les rôles landmark font partie de la spécification. En bref, ils permettent d'indiquer ce que contiennent les différents blocs qui constituent la page. On a par exemple role="navigation", role="main", role="search" etc.

HTML5 introduit quelque chose de similaire mais sous forme de nouveaux éléments HTML comme <nav>, <main>, <section> etc.

Nous avons testé quels rôles et éléments sectionnants sont supportés par les différents lecteurs d'écran et sur base de ces tests nous faisons les recommandations suivantes:

  • Seul JAWS supporte l'élément <nav>, alors que role="navigation" est reconnu par tous les lecteurs d'écran. C'est une bonne idée de combiner les deux: <nav role="navigation">. Notez bien que ceci ne doit être utilisé que pour le menu principal ainsi qu’éventuellement le sous-menu. Mais il ne faut pas utiliser l'élément nav pour chaque liste de 2 ou 3 liens .
  • Il n'y a pas encore de support pour l'élément <main>, mais role="main" est supporté. Il est utile d'ajouter role="main" au div qui englobe le contenu de la page. Cela permettra peut-être dans le futur de rendre superflu les liens 'aller au contenu'. Si vous utilisez HTML5, vous pouvez utiliser l'élément main à la place d'un div mais toujours en combinaison avec role="main": <main role="main">.
  • Il y a un bon support pour role="search". Ajoutez ceci au div qui contient le champ de recherche et le bouton correspondant. Il n'y a pas d'élément HTML correspondant. .
  • Il existe d'autres éléments sectionnants en HTML5, comme par exemple <section>, <article>, <header> et <footer>: certains lecteurs d'écran les annoncent, d'autres pas. Nous ne considérons pas ces éléments comme essentiels mais attirons votre attention sur le fait de les utiliser correctement si vous choisissez de les utiliser. Il ne faut par exemple pas abuser de l'élément section en le substituant à tous les div et les p. Gardez en mémoire les informations sur l'outline HTML5 fournies dans un article de blog précédent.
  • Il existe également d'autres rôles ARIA comme role="article", role="banner", role="region", role="complementary": Certains de ces rôles sont supportés par plusieurs lecteurs d'écran. Ici également il faut les utiliser avec modération.

(X)HTML ou HTML5?

Nous n'avons pas de préférence pour HTML4, XHTML ou HTML5. A partir du moment où vous utilisez un seul élément HTML5, les navigateurs interpréteront la page en entier comme HTML5. Si vous n'utilisez pas HTML5, vous pouvez toujours ajouter des rôles ARIA. C'est une bonne idée, si vous n'abusez pas. Si vous utilisez HTML5, nous vous encourageons à utiliser les éléments sectionnants correctement. Comme il n'y a encore que très peu de support de la part des lecteurs d'écran pour ces éléments, il faut les combiner aux rôles ARIA correspondants. Une page web pourrait ressembler à ceci:

capture d'écran annotée de la page web

Si vous n'utilisez pas le HTML5, alors vous pouvez conserver les rôles ARIA et remplacer les éléments nav, header, footer et aside par des div.

Le lecteur d'écran JAWS 14 lit ceci dans Internet Explorer 9:

Remarques

  • Tous les lecteurs d'écran ne se comportent pas de la même manière. Il y a des formulations (par les lecteurs d'écran) qui pourraient être améliorées, comme 'début de la région' pour une section. Certaines traductions, sont actuellement mauvaises et peuvent vraiment porter à confusion pour les utilisateurs. Par exemple en néerlandais une section est traduit par 'reeks' qui signifie 'série'
  • Les informations supplémentaires énoncées par les lecteurs d'écran pour chaque région sont utiles, mais peuvent devenir dérangeantes s'il y en a beaucoup.
  • Il est possible d'utiliser un raccourci clavier pour passer de région en région. De cette manière on parcourt bannière, recherche, navigation, région, région principale, région complémentaire et info contenu. Cela permet d'arriver à la navigation en appuyant trois fois d'affilée sur la touche de raccourci, et au contenu principal en 5 fois. On peut s'attendre à voir apparaître des raccourcis spécifiques pour atteindre la zone de recherche, la navigation et le contenu principal. Mais cela ne fonctionnera que si les éléments sectionnants et rôles ARIA sont correctement utilisés.

Seulement pour les lecteurs d'écran?

Le visiteur lambda ne remarquera pas que vous avez utilisé un élément nav ou des rôles ARIA dans le site. Les personnes qui en bénéficieront seront surtout les utilisateurs de lecteurs d'écran. Mais les personnes qui naviguent au clavier ont également besoin de pouvoir naviguer de manière efficace dans une page web. C'est extrêmement fastidieux de naviguer en tabulant de lien en lien sur un site qui comporte beaucoup de liens. Malheureusement les navigateurs n'ont encore rien prévu. Mais il y a une extension Firefox pour naviguer au clavier en utilisant les landmarks.

Comment tester?

L'extension Firefox mentionnée ci-dessus est un bon outil de test pour vérifier si les rôles ARIA et éléments sectionnants sont utilisés de manière logique. Lorsque Firebug est ouvert si vous naviguez de région en région avec le raccourci clavier, la ligne correspondante sera mise en surbrillance dans le code HTML. Vous pouvez donc vérifier si les rôles indiqués sont corrects et également si vous n'avez pas exagéré dans le nombre de régions utilisées. Si vous disposez d'un Mac, vous pouvez tester avec le lecteur d'écran VoiceOver. Si vous travaillez sous Windows, vous pouvez utiliser NVDA. Voir la page Outils de test.

Résultats des tests

Nous avons testé le support des rôles ARIA et éléments sectionnants dans 4 lecteurs d'écran: VoiceOver pour Mac, Supernova, NVDA et Jaws pour Windows. Les tests sur Windows ont eu lieu dans Internet Explorer 9. Nous examinons d'abord le support des rôles ARIA dans un site HTML4/XHTML, ensuite nous testons le support des éléments sectionnants HTML5 sans rôles ARIA , puis avec rôles ARIA.

HTML4 ou XHTML avec rôles ARIA
NVDA 2013.1.1, IE9 VoiceOver
OSX 10.8.4
SuperNova 13.03, IE9 JAWS11, IE8 JAWS13, IE9 JAWS14, IE9
<div role="banner"> Supporté Supporté Supporté Pas supporté Supporté Supporté
<div role="navigation"> Supporté Supporté Supporté Supporté Supporté Supporté
<div role="main"> Supporté Supporté Supporté Supporté Supporté Supporté
<div role="article"> Pas supporté Pas supporté Pas supporté Supporté Supporté Supporté
<div role="complementary"> Supporté Supporté Supporté Supporté Supporté Supporté
<div role="contentinfo"> Supporté Supporté Supporté Supporté Supporté Supporté
HTML5 sans rôles ARIA
NVDA 2013.1.1, IE9 VoiceOver
OSX 10.8.4
SuperNova 13.03, IE9 JAWS11, IE8 JAWS13, IE9 JAWS14, IE9
<header> Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté
<nav> Pas supporté Pas supporté Pas supporté Pas supporté Supporté Supporté
<main> Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté
<section> Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté Supporté
<article> Pas supporté Pas supporté Pas supporté Pas supporté Supporté Supporté
<aside> Pas supporté Supporté Pas supporté Pas supporté Pas supporté Supporté
<footer> Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté Pas supporté
HTML5 avec rôles ARIA
NVDA 2013.1.1, IE9 VoiceOver
OSX 10.8.4
SuperNova 13.03, IE9 JAWS11, IE8 JAWS13, IE9 JAWS14, IE9
<header role="banner"> Supporté Supporté Supporté Pas supporté Supporté Supporté
<nav role="navigation"> Supporté Supporté Supporté Supporté Supporté Supporté
<main role="main"> Supporté Supporté Supporté Supporté Supporté Supporté
<article role="article"> Pas supporté Pas supporté Pas supporté Supporté Supporté Supporté
<aside role="complementary"> Supporté Supporté Supporté Supporté Supporté Supporté
<footer role="contentinfo"> Supporté Supporté Supporté Supporté Supporté Supporté
1 réaction