enum Valeurs : ascending,descending,none,other

aria-sort

Indique si les éléments d'une colonne ou d'une ligne de tableau sont triés, et dans quel ordre.

Description

aria-sort est placé sur un en-tête de colonne ou de ligne (columnheader, rowheader) pour indiquer l’état de tri actuel :

  • none — non trié (triable)
  • ascending — tri croissant
  • descending — tri décroissant
  • other — tri selon un algorithme non standard

Syntaxe

<th role="columnheader" aria-sort="ascending">Nom</th>
<th role="columnheader" aria-sort="none">Date</th>

Exemples

Tableau de données avec en-têtes triables :

<table>
  <thead>
    <tr>
      <th scope="col" aria-sort="ascending">
        <button>Nom ↑</button>
      </th>
      <th scope="col" aria-sort="none">
        <button>Prénom</button>
      </th>
      <th scope="col" aria-sort="descending">
        <button>Date ↓</button>
      </th>
    </tr>
  </thead>

</table>

Notes

Un seul tri actif à la fois : dans un tableau, une seule colonne doit avoir aria-sort avec une valeur autre que none à la fois. Les autres colonnes triables gardent aria-sort="none".

Indicateur visuel obligatoire : accompagner aria-sort d’un indicateur visuel (flèche, icône) pour les utilisateurs voyants.

Ne pas omettre sur les colonnes non triées : les colonnes triables mais non triées doivent avoir aria-sort="none" pour indiquer qu’elles sont triables.

Support navigateurs