Перейти до вмісту
Pandus
uk Змінити мову
Меню

Вимога WCAG A/AA Пріоритет: Серйозно

Деякими областями з прокруткою не можна користуватися з клавіатури

Деякі блоки на сторінці прокручуються, але користувачі клавіатури не можуть перейти в них, щоб прокрутити вміст.

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

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

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

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

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

Як виправити

Зробіть кожну область із прокруткою доступною з клавіатури: додайте tabindex="0" з доступною назвою (aria-label) і відповідною роллю або переконайтеся, що всередині є елемент, який отримує фокус. Краще не використовувати маленькі блоки з прокруткою для важливого вмісту.

У Shopify

Зазвичай це таблиці, вкладки, списки фільтрів чи віджети застосунків у темі. Додайте tabindex і підпис у секціях Liquid теми або відмовтеся в CSS від блоків із фіксованою висотою та прокруткою.

У Shoptet (CZ)

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

У PrestaShop

Зазвичай це вкладки товару, таблиці чи списки фасетного пошуку. Виправте це в шаблонах .tpl або CSS теми.

У WooCommerce

Зазвичай це таблиці, вкладки чи віджети з теми або плагінів. Виправте це в шаблонах чи CSS дочірньої теми або повідомте автора плагіна.

Стандарти

Стандарти
СтандартПункт
WCAG 2.2 2.1.1 (A) Keyboard
WCAG 2.2 2.1.3 (AAA) Keyboard (No Exception)
WCAG 2.1 2.1.1 (A) Keyboard
WCAG 2.1 2.1.3 (AAA) Keyboard (No Exception)
WCAG 2.0 2.1.1 (A) Keyboard
WCAG 2.0 2.1.3 (AAA) Keyboard (No Exception)
EN 301 549 4.1.1 9.2.1.1
EN 301 549 3.2.1 9.2.1.1
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.2.1.1

Автоматична перевірка: правило axe-core scrollable-region-focusable. dequeuniversity.com, github.com, www.w3.org, www.w3.org, www.etsi.org

Схожі перевірки

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