Нестандартні поля введення не мають підпису

Деякі поля, створені власноруч, наприклад пошук або вибір країни, не мають назви, яку можуть прочитати допоміжні технології.

Цей текст перекладено автоматично, носій мови його ще не вичитав.

Чому це важливо для ваших покупців

Користувачі програм зчитування з екрана не знають, для чого поле, тому можуть не змогти знайти товар або ввести адресу.

Кого це стосується

незрячі покупці
користувачі програм зчитування з екрана
користувачі голосового керування

Як виправити

Дайте кожному елементу з роллю поля введення (combobox, textbox, searchbox, listbox, slider, spinbutton) назву через aria-labelledby з посиланням на видимий текст або через aria-label. Ще краще — використати нативні <input> або <select> з <label>.

У Shopify

Зазвичай це підказки пошуку, фільтри чи віджети застосунків. Виправте підписи в Liquid і JavaScript теми; про віджети застосунків повідомте розробника.

У Shoptet (CZ)

Зазвичай це компоненти пошуку чи фільтрів у шаблоні. Зверніться до Shoptet або до партнера Shoptet.

У PrestaShop

Зазвичай це модулі пошуку чи фільтрів. Додайте підписи в перевизначених шаблонах модуля або повідомте його розробника.

У 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-input-field-name. dequeuniversity.com, github.com, www.w3.org

Випадний список не має підпису
WCAG 4.1.2 A
Відвідувачі не можуть збільшити сторінку на смартфоні
WCAG 1.4.4 AA
Кнопка-зображення не має текстового опису
WCAG 1.1.1 A
Список зібрано неправильно
WCAG 1.3.1 A

Усі правила, які ми перевіряємо