У выпадающего списка нет подписи

У выпадающего списка нет подписи, которую могут прочитать вспомогательные технологии.

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

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

Пользователи скринридеров слышат только «комбинированный список» и не знают, выбирается ли размер, цвет, количество или страна. Это может помешать выбрать вариант товара или оформить заказ.

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

незрячие покупатели
пользователи скринридеров
пользователи голосового управления
люди с когнитивными нарушениями

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

Свяжите с каждым <select> видимый <label for> или используйте aria-labelledby со ссылкой на видимый текст. aria-label используйте, только если видимая подпись невозможна. Проверьте выбор вариантов, сортировку и выбор страны.

В Shopify

Обычно это выбор вариантов, сортировка или переключатели валюты и языка в теме. Добавьте подписи в Liquid-сниппетах темы; списки из приложений должен исправить разработчик приложения.

В Shoptet (CZ)

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

В PrestaShop

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

В 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 select-name. dequeuniversity.com, github.com, www.w3.org

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