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

Деякі елементи мають атрибути доступності, заборонені для їхнього типу, найчастіше aria-label на звичайному <div> чи <span> без ролі.

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

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

Програми зчитування з екрана часто пропускають такі підписи. Рейтинг у зірках, записаний як aria-label="4,5 з 5", іконка «Знижка» чи позначка наявності можуть тоді нічого не сказати або сказати не те, що бачать інші покупці.

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

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

Як виправити

Не ставте aria-label чи aria-labelledby на елементи без відповідної ролі (звичайні div, span, p або елементи з role="presentation"). Натомість подайте інформацію текстом, наприклад візуально прихованим <span>, або дайте елементу відповідну роль, як-от role="img" для рейтингу з іконок-зірок.

У Shopify

Зазвичай це код відгуків, позначок чи іконок у темі або застосунках. Змініть сніпет Liquid так, щоб використовувати візуально прихований текст або role="img"; про віджети застосунків повідомте розробника.

У 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 aria-prohibited-attr. dequeuniversity.com, github.com, www.w3.org

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