Tag - Etiquette

Les tags permettent d'organiser, de catégoriser ou de classer le contenu à l'aide de mots-clés.

dsa-tag

Rôle et attributs ARIA

Rôles et attributs ARIA générés par défaut
  • Pas de rôle ou attributs ARIA par défaut

 

Attributs de l’élément ayant un impact sur l’accessibilité

Attribut

Impact

label

Libellé du tag.

Modifie l’attribut aria-label du bouton de suppression si removable est présent.

removable

Ajoute un bouton de suppression au tag, avec un attribut aria-label ayant pour valeur “Retirer” (ou sa traduction) + la valeur de label.

 

 

dsa-tag-button

Rôle et attributs ARIA

Rôles et attributs ARIA générés par défaut
  • Élément principal : <button>

 

Attributs de l’élément ayant un impact sur l’accessibilité

Attribut

Impact

accessible-name

Ajoute un attribut aria-label à la balise.

⚠️ Cet attribut n’est à renseigner que lorsque le bouton n’est pas explicite en lui-même (bouton du type « Lire plus », « Découvrir », « Voir plus », etc.).
Dans ces cas-là, il faut reprendre le nom du bouton, puis ajouter les informations complémentaires.
Exemple : accessible-name="Découvrir : le projet handicap du CNSA".

description

Crée un élément caché avec le contenu renseigné, et ajoute un attribut aria-describedby pointant vers celui-ci à la balise.

href

Si renseigné, l’élément interactif sera une balise <a>. Sinon, ce sera une balise <button>.

 


dsa-anchor-tag

Rôle et attributs ARIA

Rôles et attributs ARIA générés par défaut
  • Élément principal : <a>

 

Attributs de l’élément ayant un impact sur l’accessibilité

Attribut

Impact

label

⚠️ Obligatoire

Nom accessible de l’élément.