Перейти к содержимому
Pandus

Требование WCAG A/AA Приоритет: Умеренно

Атрибуты доступности использованы в неподходящей ситуации

Некоторые элементы используют атрибуты доступности, которые для их типа разрешены только при определённых условиях, например aria-checked на настоящем чекбоксе или атрибуты древовидной таблицы на обычной строке таблицы.

Этот текст переведён автоматически, носитель языка его ещё не вычитал.

Почему это важно для ваших покупателей

Скринридер может объявить состояние, отличное от того, что на экране, например «не отмечено» у отмеченного поля «Я принимаю условия» или у опции фильтра, либо прочитать строки таблицы как уровни дерева. Покупатели могут ошибиться с выбором в фильтрах или при оформлении заказа.

Кого это касается

  • пользователи скринридеров
  • незрячие покупатели

Как исправить

Уберите aria-checked с нативных чекбоксов: состояния самого поля input достаточно. Атрибуты строк, такие как aria-level, aria-posinset, aria-setsize и aria-expanded, используйте на строках таблицы только внутри role="treegrid". Где возможно, отдавайте предпочтение нативным элементам HTML вместо ARIA.

В Shopify

Обычно это собственный код фильтров, вариантов или чекбоксов в теме или приложении. Найдите элемент в файлах Liquid и JavaScript темы и уберите противоречащий атрибут; о виджетах приложений сообщите разработчику.

В Shoptet (CZ)

Обычно это фильтры или формы шаблона либо дополнения. Обратитесь в Shoptet или к партнёру Shoptet.

В PrestaShop

Обычно это модули фасетного поиска, опций товара или форм. Исправьте это в файлах .tpl и JavaScript темы или в переопределённых шаблонах модулей.

В WooCommerce

Обычно это плагины фильтров, опций товара или форм либо конструктор страниц. Исправьте это в дочерней теме или сообщите автору плагина.

Стандарты

Стандарты
СтандартПункт
WCAG 2.2 4.1.2 (A) Name, Role, Value
WCAG 2.1 4.1.2 (A) Name, Role, Value
WCAG 2.0 4.1.2 (A) Name, Role, Value
EN 301 549 4.1.1 9.4.1.2
EN 301 549 3.2.1 9.4.1.2
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.4.1.2

Автоматическая проверка: правило axe-core aria-conditional-attr. dequeuniversity.com, github.com, www.w3.org

Все правила, которые мы проверяем