ARIA : attribut aria-level
L'attribut aria-level
définit le niveau hiérarchique d'un élément au sein d'une structure.
Description
Les niveaux de hiérarchie apparaissent dans les titres, les arbres, les grilles imbriquées, les listes d'onglets imbriquées, etc. Si l'arborescence du DOM ne représente pas correctement le niveau, l'attribut aria-level
doit être utilisé pour définir le niveau hiérarchique des éléments dans leur structure. Les niveaux augmentent avec la profondeur. La valeur de aria-level
est un entier supérieur ou égal à 1
.
Pour les titres dans la structure d'un document, il peut y avoir des titres de premier niveau, de second niveau, de troisième niveau, etc. Dans les arbres, il y a l'élément racine, ses enfants, les enfants des enfants (ou petits-enfants), et ainsi de suite.
L'attribut aria-level
expose la hiérarchie aux technologies d'assistance afin qu'elle puisse être communiquée aux utilisateur·ice·s. Comme tous les attributs ARIA, il n'a aucun impact sur l'agent utilisateur et donc aucun impact sur la détermination de la structure du document par l'agent utilisateur.
Si l'arborescence du DOM représente correctement le niveau, l'agent utilisateur peut calculer le niveau d'un élément à partir de la structure du document, rendant aria-level
non seulement redondant mais risqué car il peut induire en erreur. aria-level
ne doit être utilisé que pour indiquer explicitement un niveau lorsqu'il n'est pas possible de le calculer à partir de la structure du document. Testez si cet attribut est nécessaire. Si l'agent utilisateur peut calculer le niveau, il est préférable d'omettre l'attribut aria-level
.
Avec le rôle heading
L'attribut aria-level
est requis pour le rôle heading
, qui indique aux technologies d'assistance que l'élément doit être traité comme un titre. <div role="heading" aria-level="1">
définit le <div>
comme titre principal de la page. Un titre de niveau 2, défini avec aria-level="2"
, sera le premier sous-titre, un niveau 3 sera un sous-titre de celui-ci, etc.
<div role="heading" aria-level="3">Titre de cette sous-section</div>
Dans le rôle treegrid
Dans le cas d'une treegrid
, aria-level
est pris en charge sur les éléments ayant le rôle row
, et non sur les éléments ayant le rôle gridcell
. Les lignes agissent comme des nœuds feuilles dans l'orientation verticale de la grille. Les cellules de grille sont des nœuds feuilles dans l'orientation horizontale de chaque ligne. aria-level
n'est pas pris en charge sur les cellules à l'intérieur des lignes. Ainsi, dans les treegrids, l'attribut aria-level
s'applique à l'élément ayant le rôle row
.
Si l'ensemble complet des nœuds disponibles n'est pas présent dans le DOM en raison d'un chargement dynamique lors du déplacement de la sélection ou du défilement dans l'arbre, chaque nœud doit inclure aria-level
, aria-setsize
et aria-posinset
.
Valeurs
<integer>
-
Un entier supérieur ou égal à 1
Interfaces associées
Element.ariaLevel
-
La propriété
ariaLevel
, qui fait partie de l'interfaceElement
, reflète la valeur de l'attributaria-level
. ElementInternals.ariaLevel
-
La propriété
ariaLevel
, qui fait partie de l'interfaceElementInternals
, reflète la valeur de l'attributaria-level
.
Rôles associés
Utilisé dans les rôles :
Spécifications
Specification |
---|
Accessible Rich Internet Applications (WAI-ARIA)> # aria-level> |