Вимога WCAG A/AA Пріоритет: Серйозно
Клікабельні елементи вкладено один в одного
Деякі клікабельні елементи розміщені всередині інших клікабельних елементів, наприклад кнопка списку бажань усередині клікабельної картки товару.
Цей текст перекладено автоматично, носій мови його ще не вичитав.
Чому це важливо для ваших покупців
Користувачі програм зчитування з екрана та клавіатури можуть не дістатися до внутрішнього елемента або не відрізнити його від зовнішнього. Тоді вони пропускають швидке додавання в кошик чи список бажань або відкривають не те.
Кого це стосується
- користувачі програм зчитування з екрана
- користувачі, які керують сайтом з клавіатури
- користувачі голосового керування
Як виправити
Не розміщуйте посилання, кнопки чи поля всередині іншого посилання чи кнопки або всередині елемента з role="button" чи подібною роллю. Зробіть основне посилання картки та її кнопки сусідніми елементами; за потреби розширте клікабельну область основного посилання через CSS.
У Shopify
Зазвичай це картки товарів із кнопками швидкого додавання чи списку бажань від теми або застосунків. Змініть структуру картки в сніпеті Liquid теми; про кнопки застосунків повідомте розробника.
У Shoptet (CZ)
Зазвичай це картки товарів у шаблоні. Зверніться до Shoptet або до партнера 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 nested-interactive.
dequeuniversity.com, github.com, www.w3.org
Схожі перевірки
-
Сторінка оголошує дві різні мови
WCAG 3.1.1 A
-
Атрибути доступності мають неправильні значення
WCAG 4.1.2 A
-
Назву таблиці записано в клітинці таблиці
WCAG 1.3.1 A
-
Клікабельні елементи вкладено один в одного
WCAG 4.1.2 A