Деякі підписи вказують на не той елемент

Два або більше елементи мають однаковий id, і цей id використовується, щоб пов'язати підпис, опис чи повідомлення про помилку з полем або елементом керування.

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

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

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

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

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

Як виправити

Зробіть кожен id на сторінці унікальним, особливо ті, на які посилаються aria-labelledby, aria-describedby, aria-controls або <label for>. Блоки, що повторюються (картки товарів, спливні вікна швидкого перегляду, мобільне й десктопне меню), мають створювати id із суфіксом, наприклад id товару чи секції. Перевірте кожен випадок вручну: axe позначає їх для ручної перевірки.

У Shopify

Часто причина в секції чи сніпеті, який виводиться двічі (шапка для мобільних і десктопу, картки товарів, швидкий перегляд) з фіксованим id. Додайте унікальний суфікс у коді Liquid, наприклад section.id або product.id; віджети застосунків має виправити їхній розробник.

У Shoptet (CZ)

Зазвичай походить із шаблону або з власного коду, доданого кілька разів. Спершу виправте власний код; щодо шаблону зверніться до Shoptet або партнера Shoptet.

У PrestaShop

Зазвичай у шаблонах .tpl теми або в модулях, які виводять той самий блок кілька разів, наприклад мініатюри товарів чи меню для мобільних і десктопу. Зробіть id унікальними в темі або в перевизначених шаблонах модулів.

У WooCommerce

Часто трапляється з конструкторами сторінок і віджетами, розміщеними двічі (мобільне й десктопне меню, повторені форми), та з плагінами, у яких id прописані жорстко. Виправте id у дочірній темі чи налаштуваннях віджета; про код плагіна повідомте його автора.

Стандарти

Стандарти
Стандарт	Пункт
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 duplicate-id-aria. dequeuniversity.com, github.com, www.w3.org

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