aria-sort

Кога да се използва

На role="columnheader" или role="rowheader" (или нативен <th>, действащ като такъв) в таблица или решетка, която потребителят може да пресортира. Атрибутът уведомява помощните технологии едновременно, че колоната е сортируема и в каква посока е сортирана в момента, така че потребител на екранен четец чува „Фамилия, сортирано в нарастващ ред”, преди да чете надолу по колоната.

Ако колоната не е сортируема, aria-sort не трябва да се поставя върху нея. Атрибутът е договорът, означаващ „може да промените това”.

Как се държи

Приема четири токен стойности:

• "ascending" — А→Я, 0→9, от най-старо към най-ново.
• "descending" — Я→А, 9→0, от най-ново към най-старо.
• "none" — сортируемо, но в момента не е сортирано по тази колона. Това е стандартното състояние, когато друга колона поеме сортирането.
• "other" — сортируемо, в момента сортирано по правило, което не е азбучно или числово и не се вписва в нарастващ/намаляващ ред (например потребителски рейтинг на релевантност). Рядко се среща на практика.

Само едно заглавие в таблицата трябва да носи "ascending", "descending" или "other" в даден момент. Когато потребителят промени сортирането, новата колона получава новата стойност, а предишната се нулира до "none" (или атрибутът се премахва).

aria-sort е единствено обявяване. Действителното поведение при сортиране — обработчик на щракване, активиране с клавиатура, пренареждане на редовете — е задача на разработчика. Помощните технологии не сортират таблицата вместо него.

Чести грешки

• Актуализиране на визуалния индикатор за сортиране (иконата с стрелка), но пропускане на актуализация на aria-sort. Потребителите на екранни четци чуват грешната посока.
• Оставяне на две колони с aria-sort="ascending" след щракване върху ново заглавие. Първата колона вече не управлява сортирането, но все още го декларира.
• Поставяне на aria-sort на несортируема колона. Помощните технологии обещават поведение за сортиране, което потребителят не може да задейства.
• Използване на стойност извън четирите разрешени токена — aria-sort="asc" е невалидно и се игнорира.
• Пропускане на осигуряването на активируемост на заглавната клетка с клавиатура. aria-sort не прави заглавието на колоната фокусируемо — това е задача на разработчика.
• Третиране на aria-sort като основен източник на истина вместо като производна от текущото ви сортирано състояние. При повторно рендиране, при което атрибутът се изгуби, обявяването изчезва.

Пример

<table>
  <thead>
    <tr>
      <th
        scope="col"
        aria-sort="ascending"
      >
        <button type="button">Last name</button>
      </th>
      <th scope="col" aria-sort="none">
        <button type="button">First name</button>
      </th>
      <th scope="col">Email</th>
    </tr>
  </thead>
  <tbody>
    <!-- … rows sorted by Last name ascending -->
  </tbody>
</table>