Требование WCAG A/AA Приоритет: Серьёзно
Нет быстрого перехода к основному содержимому
На странице нет ссылки для пропуска, заголовка или области main, которые позволили бы пользователям клавиатуры и скринридеров сразу перейти за шапку и меню.
Этот текст переведён автоматически, носитель языка его ещё не вычитал.
Почему это важно для ваших покупателей
Пользователям клавиатуры приходится на каждой странице проходить клавишей Tab всю шапку, меню и фильтры, прежде чем добраться до товаров или корзины. Пользователи скринридеров не могут быстро найти, где начинается содержимое.
Кого это касается
- пользователи, которые работают только с клавиатуры
- пользователи скринридеров
- люди с нарушениями моторики
Как исправить
Добавьте ссылку «Перейти к содержимому» первым элементом, на который можно перейти клавишей Tab, с переходом к основному содержимому, и сделайте её видимой при фокусе. Оберните основное содержимое в <main> и дайте странице понятную структуру заголовков, начиная с <h1>. Лучше всего иметь все три.
В Shopify
В большинстве современных тем есть ссылка для пропуска и <main>; в старых или сильно изменённых темах их может не быть. Верните их в layout/theme.liquid.
В Shoptet (CZ)
Зависит от шаблона. Проверьте, есть ли в новой версии шаблона ссылка для пропуска; если нет, обратитесь в Shoptet или к партнёру.
В PrestaShop
Стандартные темы обычно имеют заголовки и область основного содержимого; собственные темы — не всегда. Добавьте ссылку для пропуска и <main> в файлы макета .tpl темы.
В WooCommerce
Зависит от темы; некоторые шапки конструкторов страниц или пустые шаблоны убирают ссылку для пропуска или <main>. Добавьте их в шаблон шапки дочерней темы или в настройки темы конструктора.
Стандарты
| Стандарт | Пункт |
|---|---|
| WCAG 2.2 | 2.4.1 (A) Bypass Blocks |
| WCAG 2.1 | 2.4.1 (A) Bypass Blocks |
| WCAG 2.0 | 2.4.1 (A) Bypass Blocks |
| EN 301 549 4.1.1 | 9.2.4.1 |
| EN 301 549 3.2.1 | 9.2.4.1 |
| Section 508 2017 | E205.4 |
| ДСТУ EN 301 549 2022 | 9.2.4.1 |
Автоматическая проверка: правило axe-core bypass.
dequeuniversity.com, github.com, www.w3.org
Похожие проверки
-
У некоторых индикаторов прогресса нет названия
WCAG 1.1.1 A
-
У некоторых индикаторов уровня нет названия
WCAG 1.1.1 A
-
Атрибуты доступности использованы в неподходящей ситуации
WCAG 4.1.2 A
-
У нестандартных полей ввода нет подписи
WCAG 4.1.2 A