élément HTML pour message contextuel

Bonjour,

J'appelle message contextuel la petite phrase qui s'affiche en haut de page pour aider l'utilisateur à se repérer et l'alerter en cas d'erreur.

"Vous êtes sur la fiche du produit 12453."

"Veuillez préciser la quantité."

etc.

J'ai épluché la liste des éléments html5 sans rien trouver.

Alors, pour l'accessibilité, un simple "p" ?

Salut,

Comme il s'agit d'un message avec son contexte propre, tu peux mettre un <section> que tu pourrais compléter avec un rôle alert.
Modifié par Olivier C (02 Nov 2023 - 12:37)

Bonjour Olivier C,

Je découvre le rôle alert, c'est une bonne piste, de même que <section>.

Je mets en œuvre et vous tiens informés.

Bonjour,

Après réflexion je n'emploie pas <section> mais <p id="annonce">

Je ne demande s'il ne vaut pas mieux :

<p aria-label="annonce">

J'emploie role="alert" avec parcimonie, uniquement pour les erreur de saisie dans un formulaire.

<p id="annonce" role="alert">Votre nom est vide !</p>

Bonsoir,

L'attribut aria-label ne sert à rien sur un élément <p>. Cet attribut ne fonctionne que pour les éléments interactifs, focusables, ou définissant des régions (landmark). Pour tous les autres, il ne sera probablement pas rendu.
Par contre, si je ne me trompe pas, ça fonctionne avec <section>, car il fait partie des éléments définissant des régions.

Pour role=alert, c'est une bonne idée non seulement pour les messages d'erreur, mais aussi pour les informations qui devraient être lues dès qu'elles apparaissent.
Donc même pour les messages de succès ou de navigation, ça peut être utile et rassurant.
Le tout est effectivement de ne pas trop en abuser, car ça peut devenir lourd, ou bien les vraies erreurs bloquantes peuvent se fondre dans la masse.


Et sinon non, de manière générale, il n'y a pas d'élément plus spécifique que <p>, <section> ou <div> pour ce cas. A défaut, ils conviennent très bien.