inert
L'attribut universel inert
est un attribut booléen indiquant au navigateur d'ignorer l'élément en termes d'interactivité. Avec l'attribut inert
, tous les descendants de l'élément (comme les boîtes modales créées avec <dialog>
) sont ignorés ainsi. L'attribut inert
indique également qu'il faut ignorer les évènements déclenchés par l'utilisatrice ou l'utilisateur, que ce soit ceux liés au focus ou provenant d'outils d'assistance.
inert
aura les effets suivants :
- Empêche le déclenchement de l'évènement
click
lorsque la personne clique sur l'élément. - Empêche le déclenchement de l'évènement
focus
en empêchant que l'élément reçoive le focus. - Masque l'élément et son contenu des outils de l'assistance en le retirant de l'arbre d'accessibilité.
<body inert>
<!-- contenu -->
</body>
L'attribut inert
peut être ajouté à des sections de contenu qui ne devraient pas être interactives. Lorsqu'un élément est inerte, ses descendants le sont également et les éléments normalement interactifs comme les liens, les boutons et les contrôles de formulaire sont désactivés, car ils ne peuvent pas recevoir de clic ou de focus.
L'attribut inert
peut également être placé sur des éléments masqués ou en dehors de l'écran. En effet, un tel élément (avec ses descendants) est retiré de la navigation au clavier et de l'arbre d'accessibilité.
Accessibilité
Par défaut, il n'existe pas de méthode visuelle pour indiquer qu'un élément (avec ses descendants) est inerte. Il faut donc indiquer clairement les parties actives et celles qui sont inertes.
Lorsqu'on fournira des indications visuelles et non-visuelles à propos de cette inertie, il faudra se rappeler que la zone d'affichage peut ne contenir qu'une partie du contenu (les personnes peuvent avoir zoomé, ou avoir un handicap visuel par exemple). Si une section est inerte et n'est pas marquée comme telle, cela pourra être source de frustration et représenter une mauvaise ergonomie.
Spécifications
Specification |
---|
HTML Standard # the-inert-attribute |
Compatibilité des navigateurs
BCD tables only load in the browser
Voir aussi
- L'élément
<dialog>
- La propriété
HTMLElement.inert
du DOM - Une introduction à
inert
(en anglais) - L'attribut
inert
arrive enfin sur le Web (en anglais)