Перейти до вмісту
Pandus

Рекомендована практика Пріоритет: Серйозно

Порядок переходу з клавіатури порушено примусово

Деякі елементи мають tabindex зі значенням більше 0, через що вони отримують фокус раніше за все інше, коли людина рухається сторінкою клавішею Tab. Це рекомендована практика, що виходить за межі рівня WCAG 2.2 AA.

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

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

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

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

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

Як виправити

Замініть кожен додатний tabindex на tabindex="0" (щоб елемент отримував фокус на своєму природному місці) або приберіть його зовсім. Якщо порядок і далі здається неправильним, змініть порядок елементів у HTML так, щоб він відповідав візуальному, а не нав'язуйте його через tabindex. Використовуйте tabindex="-1" лише для елементів, які мають отримувати фокус зі скрипта.

У Shopify

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

У Shoptet (CZ)

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

У PrestaShop

Перевірте файли .tpl теми й шаблони модулів на значення tabindex більше 0 і перевизначайте шаблони модулів у темі, а не редагуйте самі модулі.

У WooCommerce

Часто його додають плагіни спливних вікон, форм чи чатів або тема. Знайдіть tabindex у коді сторінки, виправте його в дочірній темі або повідомте автора плагіна.

Стандарти

Це не критерій WCAG, а рекомендована практика, що робить сайт зручнішим.

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

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