Support des attributs ARIA par les lecteurs d’écran

5 commentaires

Publié le 19 décembre 2013 par Équipe Atalan

Régulièrement, au cours de nos projets, nous sommes amenés à réaliser des tests de support des attributs de la spécification ARIA (externe) (en anglais) sur différentes combinaisons navigateur/lecteur d’écran.

Cette ressource, qui sera fréquemment agrémentée et mise à jour, présente les résultats de ces tests.

Présentation des résultats

Chaque attribut ARIA testé est précédé d’une explication présentant son utilité et d’un lien vers sa spécification officielle.

Les résultats de ces tests se présentent sous la forme de tableaux de données à double entrée.
Les entêtes de colonne supérieures de ces tableaux correspondent aux types de lecteurs d’écran ; les inférieures, aux versions de ces derniers.
Les entêtes de ligne, elles, listent les navigateurs (et leur version) sur lesquels les tests ont été réalisés.

Enfin, lorsque nécessaire, des informations complémentaires quant à ces tests figurent sous les tableaux.
Il peut par exemple s’agir d’explications sur la méthodologie adoptée pour les tests ou le report d’éventuels comportements anormaux.

Fréquence de mise à jour

Chaque tableau de résultats est amené à évoluer en fonction de l’apparition sur le marché d’une nouvelle version d’un lecteur d’écran ou d’un navigateur.

En haut à gauche de chaque tableau figure la date de sa dernière mise à jour.

Pour l’instant, les tests sont réalisés sur un échantillon de combinaisons navigateur/lecteur d’écran assez réduit ne couvrant que partiellement le champ des configurations utilisateurs possible.

À noter qu’à court terme, le nombre de ces combinaisons va augmenter.

Table des matières

Support de aria-describedby

L’attribut aria-describedby (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Il sert à identifier le ou les élément(s) décrivant l’élément en question.

Résultats
Mis à jour le 10/02/2014 JAWS NVDA VoiceOver
11 13 2012.3.1 iOS 6.1.2 iOS 7.0.4
IE 10 Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
Firefox 23 Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Supporté. Supporté.

Attribut testé sur les éléments de formulaire suivants : <input type="text" />, <input type="checkbox" /> et <textarea>.

Support de aria-expanded

Lorsque la valeur de l’attribut aria-expanded (externe) (en anglais) est à true, il informe l’utilisateur que l’élément en question (ou celui qu’il contrôle) est développé/déplié.

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Non-supporté. Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 24 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-supporté. Non-testé.
Cr 29 Non-supporté. Partiellement supporté. Partiellement supporté. Partiellement supporté. Non-testé. Supporté.

Attribut testé sur les éléments suivants : <button>, <a role="button"> et <a>.

Cas particuliers

JAWS 11 / Internet Explorer 10
Seulement supporté sur <a role="button">.
JAWS 13 / Internet Explorer 10
Seulement supporté sur <a role="button">.
JAWS 13 / Chrome 29
Non supporté sur l’élément <a>.
Lorsque la valeur de l’attribut est à false, aucune information n’est restituée.
JAWS 14 / Chrome 29
Lorsque la valeur de l’attribut est à false, aucune information n’est restituée.
NVDA 2013.2 / Chrome 29
Lorsque la valeur de l’attribut est à false, aucune information n’est restituée.

Support de aria-grabbed

L’attribut aria-grabbed (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Il sert à indiquer si l’élément en question est ou peut-être saisi (fonctionnalité de glisser/déposer).

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Supporté. Supporté. Supporté. Partiellement supporté. Non-testé. Non-testé.
FF 24 Supporté. Supporté. Supporté. Partiellement supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-supporté. Non-testé.
Cr 30 Non-supporté. Supporté. Supporté. Non-supporté. Non-testé. Non-supporté.

Attribut testé sur l’élément <div tabindex="0">.

Cas particulier

NVDA 2013.2 / Firefox 24 et Internet Explorer 10
Supporté lorsque l’élément intégre role="button".

Support de aria-haspopup

L’attribut aria-haspopup (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Lorsque la valeur de cet attribut est à true, il informe l’utilisateur que l’élement en question dispose d’un menu contextuel pouvant s’afficher.

Résultats
Mis à jour le 10/02/2014 JAWS NVDA VoiceOver ChromeVox
11 13 2013.2 iOS 7.0.4 1.29.1
IE 10 Non supporté. Supporté. Supporté. Non-testé. Non-testé.
Firefox 23 Partiellement supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Partiellement supporté. Non-testé.
Chrome 29 Non-testé. Non-testé. Non-testé. Non-testé. Supporté.

Attribut testé sur les éléments suivants : <button>, <a role="button"> et <a>.

Cas particuliers

JAWS 11 / Firefox 23
Supporté sur les éléments <button> et <a role="button"> mais non sur l’élément <a>.
VoiceOver / iOS 7.0.4
Supporté sur les éléments <button> et <a role="button"> mais non sur l’élément <a>.

Support de aria-hidden

L’attribut aria-hidden (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Lorsque la valeur de cet attribut est à true, il rend l’élément en question (et tous ses enfants) invisible(s) aux outils d’assistance (comme les lecteurs d’écran).

Résultats
Mis à jour le 10/02/2014 JAWS NVDA VoiceOver ChromeVox
11 13 2013.2 iOS 7.0.4 1.29.1
IE 10 Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
Firefox 23 Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Chrome 29 Non-testé. Non-testé. Non-testé. Non-testé. Supporté.

Attribut testé sur les éléments suivants : <p> et <a>.

Support de aria-invalid

L’attribut aria-invalid (externe) (en anglais) s’intègre dans les éléments de formulaire.

Lorsque la valeur de cet attribut est à true, il informe l’utilisateur que la saisie du champ de formulaire en question est erronée.

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver
11 13 2012.3.1 iOS 6.1.2 iOS 7.0.4
IE 10 Non-supporté. Supporté. Non-supporté. Non-testé. Non-testé.
Firefox 23 Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Supporté. Supporté.

Attribut testé sur les éléments de formulaire suivants : <input type="text" />, <input type="checkbox" /> et <textarea>.

Cas particulier

L’attribut aria-invalid n’est cependant pas supporté par Safari (iOS 6.1.2) sur l’élément <input type="checkbox" />.

Support de aria-label

L’attribut aria-label (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Non-supporté. Supporté. Supporté. Partiellement supporté. Non-testé. Non-testé.
FF 25 Supporté. Supporté. Supporté. Partiellement supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Cr 30 Supporté. Supporté. Supporté. Partiellement supporté. Non-testé. Supporté.

Attribut testé sur les éléments suivants : <a>, <button> et <input type="text" />.

Cas particulier

NVDA 2013.2 / Firefox 25
Supporté sur l’élément <input type="text" />. Non sur <a> et <button>.
NVDA 2013.2 / Internet explorer 10
Supporté sur les éléments <button> et <input type="text" />. Non sur <a>.
NVDA 2013.2 / Chrome 30
Supporté sur les éléments <button> et <input type="text" />. Non sur <a>.

Support de aria-live

L’attribut aria-live (externe) (en anglais) peut-être intégré dans tous les éléments HTML.

Il sert à signaler que le contenu de l’élément en question a été mis à jour.

Résultats
MAJ le 12/11/2013 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 6.1.2 1.29.1
IE 10 Non-supporté. Supporté. Supporté. Non-supporté. Non-testé. Non-testé.
FF 25 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-testé.
Cr 30 Non-supporté. Supporté. Supporté. Non-supporté. Non-testé. Supporté.

Attribut testé sur les éléments suivants : <div> et <p> (avec comme valeur polite puis assertive).

Support de aria-posinset

L’attribut aria-posinset (externe) (en anglais) s’utilise conjointement avec l’attribut aria-setsize.

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 25 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-supporté. Non-testé.
Cr 30 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Supporté.

Attribut testé sur l’élément <li>.

Support de aria-required

L’attribut aria-required (externe) (en anglais) s’intègre dans les éléments de formulaire.

Lorsque la valeur de cet attribut est à true, il informe l’utilisateur que la saisie du champ de formulaire en question est requise.

Résultats
Mis à jour le 10/02/2014 JAWS NVDA VoiceOver
11 13 2012.3.1 iOS 6.1.2 iOS 7.0.4
IE 10 Non-supporté. Supporté. Supporté. Non-testé. Non-testé.
Firefox 23 Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Supporté. Supporté.

Attribut testé sur les éléments de formulaire suivants : <input type="text" />, <input type="checkbox" /> et <textarea>.

Support de aria-setsize

L’attribut aria-setsize (externe) (en anglais) s’utilise conjointement avec l’attribut aria-posinset.

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 25 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-supporté. Non-testé.
Cr 30 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Supporté.

Attribut testé sur l’élément <li>.

Support de aria-sort

L’attribut aria-sort (externe) (en anglais) peut-être intégré dans l’élément <th>.

Il sert à indiquer si les contenus liés à l’entête en question sont triés de manière croissante (aria-sort="ascending") ou décroissante (aria-sort="descending").

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.2 iOS 7.0.4 1.29.1
IE 10 Non-supporté. Non-supporté. Non-supporté. Supporté. Non-testé. Non-testé.
FF 24 Non-supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Non-supporté. Non-testé.
Cr 29 Non-supporté. Non-supporté. Non-supporté. Non-supporté. Non-testé. Non-supporté.

Attribut testé sur l’élément <th>.

Support de role="alert"

Résultats
MAJ le 04/07/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2014.2 iOS 7.1.2 1.31.4
IE 11 Non-supporté Non-supporté Non-supporté Non-supporté Non-testé Non-testé
FF 30 Non-supporté Supporté Supporté Supporté Non-testé Non-testé
Safari Non-testé Non-testé Non-testé Non-testé Supporté Non-testé
Cr 35 Non-supporté Non-supporté Non-supporté Non-supporté Non-testé Supporté

Tests effectués sur la page WAI-ARIA role=alert on setTimeout (externe).

Support de role="banner"

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.3 iOS 7.0.4 1.29.1
IE 11 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 26 Partiellement supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Cr 31 Non-supporté. Supporté. Supporté. Supporté. Non-testé. Supporté.

Testé sur les éléments <header> et <div>.

Cas particulier

JAWS 11 / Firefox 26
Supporté sur l’élément <div>. Non sur <header>.
À noter que de manière générale, l’élément <header> et ses contenus ne sont pas restitués avec cette combinaison.

Support de role="contentinfo"

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.3 iOS 7.0.4 1.29.1
IE 11 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 26 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Cr 31 Non-supporté. Supporté. Supporté. Supporté. Non-testé. Supporté.

Attribut testé sur les éléments <div> et <footer>.

Support de role="main"

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.3 iOS 7.0.4 1.29.1
IE 11 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 26 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Cr 31 Non-supporté. Supporté. Supporté. Supporté. Non-testé. Supporté.

Testé sur les éléments <main> et <div>.

Support de role="navigation"

Résultats
MAJ le 10/02/2014 JAWS NVDA VoiceOver CrVox
11 13 14 2013.3 iOS 7.0.4 1.29.1
IE 11 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
FF 26 Supporté. Supporté. Supporté. Supporté. Non-testé. Non-testé.
Safari Non-testé. Non-testé. Non-testé. Non-testé. Supporté. Non-testé.
Cr 31 Non-supporté. Supporté. Supporté. Supporté. Non-testé. Supporté.

Attribut testé sur les éléments <nav>, <ul> et <div>.

Dans le cas où vous n’obtiendriez pas les mêmes résultats, nous vous invitons à nous le signaler dans les commentaires de ce billet, via notre formulaire de contact ou en écrivant à blog(AT)atalan.fr.

Vos commentaires

  • Par Raphael, le 19 juillet 2015 à 10:23.

    Bonjour et merci pour cet énorme travail que je découvre.

    Je me demandais s’il était prévu des mises à jour prochaines (les dernières semblent dater d’il y a 1 an et demi) et surtout s’il était prévu d’intégrer de nouveaux tests.

    Je pense particulièrement à :
    – role=presentation
    – role=image
    – speak (?)

    Qui pourraient être très utiles un jour dans le cas des icones-fontes.

    Bonne continuation,

    Raphaël

    Répondre

    • Par Johan Ramon, le 21 juillet 2015 à 11:57.

      Bonjour Raphaël,

      Merci pour ton message et l’intérêt que tu portes à cette initiative !

      Malheureusement, à court terme, nous ne prévoyons pas de mises à jour ni de nouveaux tests.
      Notamment car nous sommes en pleine ré-écriture du projet AcceDe Web (qui devrait d’ailleurs en principe sortir courant septembre ;)).

      Ensuite, nous prévoyons de poursuivre notre série de billets sur les lecteurs vidéo HTML5 accessibles car nous ressentons une grosse attente à ce sujet.

      Mais nous n’abandonnons pas cette initiative. Nous réfléchissons d’ailleurs à une manière de l’optimiser (aspect collaboratif ?, autre support de diffusion ?, etc.).

      Dans tous les cas, on ne manquera pas de te tenir informé.

      Très bonne journée !
      Johan

      Répondre

  • Par QuentinC, le 18 septembre 2013 à 18:58.

    Bonsoir,

    Bravo pour ces tests qui sont assurément très utiles pour savoir qu’est-ce qui est supporté, où et comment, et qui sont manquants sur des sites où ils auraient dû exister depuis un bon moment déjà.

    Par contre, vos tableaux sont à jour, mais visiblement pas vos lecteurs d’écran.

    NVDA en est à sa version 2013.1.1 et la 2013.2 est même déjà sortie me semble-t-il.

    Jaws 14.0 est sorti depuis un an déjà, depuis au moins 6 mois en français, et jaws 15 vient de sortir en bêta.

    Si pour jaws c’est utile de lister des versions anciennes parce que tout le monde ne peut pas se mettre à jour, par contre pour NVDA il n’y a aucun intérêt à garder une ancienne version, d’autant plus qu’elle se met maintenant à jour automatiquement.

    Autre suggestion, il pourrait peut-être être utile d’ajouter IE8 et IE9, ces navigateurs sont encore beaucoup utilisés en conjonction avec les lecteurs d’écran, notamment pour ceux qui ne peuvent pas mettre leur jaws à jour. De plus d’après mes dernières informations, Chrome est censé être accessible aussi avec jaws et NVDA.

    Enfin, il manque peut-être aussi Mac OS X 10.* + VO pour être vraiment complet, mais c’est pas grave, moi non plus j’ai pas de mac.

    Répondre

    • Par Johan Ramon, le 24 septembre 2013 à 13:57.

      Bonjour QuentinC et merci pour ton commentaire.

      Tant mieux si ces tests et résultats peuvent être profitables !

      Effectivement, à ce jour, nous testons encore sur un échantillon non représentatif des combinaisons possibles.
      Nous le précisons d’ailleurs dans le billet, juste avant la table des matières. ;)

      Comme nous l’indiquons dans cette remarque, il est prévu que ce nombre de combinaisons augmente avec effectivement l’ajout des dernières versions de JAWS (14 et 15) ainsi que des précédentes moutures d’Internet Explorer (8 et 9).

      Oui, nous avons suivi le passage à la version 2013.2 de la revue d’écran NVDA. D’ailleurs, les deux derniers tableaux publiées (aria-haspopup et aria-hidden) inclus déjà les résultats des tests sur cette version.

      Tout comme toi, il ne nous apparaît pas pertinent de procéder à des tests sur les anciennes versions de NVDA. C’est d’ailleurs pourquoi sur ces 2 derniers tableaux, seuls les résultats portant sur la dernière version y figurent.

      C’est une bonne nouvelle si JAWS et NVDA peuvent être utilisés sous Chrome. Nous allons tester ça et agrémenter les futurs tableaux de ces éventuels nouveaux résultats.

      Merci encore pour ton retour et tes suggestions !

      Répondre

  • Par JY, le 2 septembre 2013 à 11:13.

    Ce sont des résultats très intéressants pouvant prétendre à enrichir la base de http://caniuse.com/ ?

    Répondre

Ajouter un commentaire

Tous les champs sont obligatoires.

Haut de page