Вимога WCAG A/AA Пріоритет: Критично

Деякі кнопки не мають назви

Деякі кнопки не мають підпису, який можна прочитати, наприклад кнопки-іконки «додати в кошик», пошуку чи меню.

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

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

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

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

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

Як виправити

Дайте кожній кнопці назву: видимий текст, aria-label або aria-labelledby з посиланням на видимий текст. Кнопкам лише з іконкою потрібен aria-label, наприклад «Додати в кошик» або «Закрити». Не покладайтеся на атрибут title чи іконки, задані лише через CSS.

У Shopify

Зазвичай це кнопки-іконки в темі (меню, пошук, кількість, закриття) або кнопки, які додають застосунки. Додайте підписи в сніпетах Liquid теми; попросіть розробників застосунків виправити кнопки, які додають їхні застосунки.

У Shoptet (CZ)

Зазвичай це кнопки-іконки в шаблоні. Перевірте, чи є новіша версія шаблону з підписами; якщо ні, попросіть Shoptet або партнера Shoptet змінити код шаблону.

У PrestaShop

Зазвичай це кнопки-іконки в темі чи модулях (кошик, пошук, меню). Додайте aria-label у шаблонах .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 button-name. dequeuniversity.com, github.com, www.w3.org

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