enum Valeurs : page,step,location,date,time,true,false

aria-current

Indique l'élément qui représente l'état courant dans un ensemble de navigation ou de progression (page active, étape actuelle, date du jour...).

Description

aria-current identifie l’élément qui correspond à l’état ou à la position actuelle dans un contexte de navigation. Les valeurs sémantiques sont :

  • page — page actuelle dans une navigation de site
  • step — étape actuelle dans un processus (fil d’Ariane, wizard)
  • location — localisation courante dans un plan ou diagramme
  • date — date actuelle dans un calendrier
  • time — heure actuelle dans un horaire
  • true — valeur générique quand aucune autre ne convient
  • false (défaut) — pas d’état courant

Syntaxe

<nav aria-label="Navigation principale">
  <a href="/">Accueil</a>
  <a href="/produits" aria-current="page">Produits</a>
  <a href="/contact">Contact</a>
</nav>

Exemples

Fil d’Ariane :

<nav aria-label="Fil d'Ariane">
  <ol>
    <li><a href="/">Accueil</a></li>
    <li><a href="/blog">Blog</a></li>
    <li><a href="/blog/accessibilite" aria-current="page">Accessibilité</a></li>
  </ol>
</nav>

Processus en étapes :

<ol aria-label="Étapes de commande">
  <li><a href="/commande/panier">Panier</a></li>
  <li><a href="/commande/livraison" aria-current="step">Livraison</a></li>
  <li><span>Paiement</span></li>
  <li><span>Confirmation</span></li>
</ol>

Calendrier :

<td role="gridcell" aria-current="date">15</td>

Notes

Différence avec aria-selected : aria-selected indique la sélection interactive dans un widget ; aria-current indique l’élément courant dans un contexte de navigation ou de progression.

Un seul par contexte : dans une navigation donnée, un seul élément doit avoir aria-current à la fois.

Mettre à jour dynamiquement : dans les SPA, mettre à jour aria-current à chaque changement de route.

Support navigateurs