inert

Baseline 2023

Newly available

Since April 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

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é.
html
<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é.

Note : Bien qu'inert soit un attribut universel qui puisse être appliqué à n'importe quel élément, on l'utilisera généralement pour des sections de contenu. Pour neutraliser des contrôles de façon individuelle, mieux vaudra utiliser l'attribut HTML disabled et la pseudo-classe CSS :disabled.

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