Рекомендуемая практика Приоритет: Умеренно
Основное содержимое вложено в другую область страницы
Элемент <main> или область с role="main", которая обозначает начало собственного содержимого страницы, вложена в другую область, например в шапку, навигацию или боковую панель. Это рекомендуемая практика, выходящая за рамки уровня WCAG 2.2 AA, на который опираются законы о доступности.
Этот текст переведён автоматически, носитель языка его ещё не вычитал.
Почему это важно для ваших покупателей
Пользователи программ чтения с экрана переходят между областями страницы (шапка, меню, основное содержимое, подвал), как между главами, и чаще всего пользуются именно главой «основное содержимое»: она ведёт сразу к списку товаров, описанию товара или форме оформления заказа. Когда она вложена в шапку или меню, структура страницы путается, и покупатели теряют время, чтобы понять, где же начинаются сами покупки.
Кого это касается
- пользователи программ чтения с экрана
- незрячие и слабовидящие покупатели
- люди, которые переходят между областями страницы с помощью инструментов браузера
Как исправить
Сделайте <main> (или role="main") частью верхнего уровня страницы: не внутри <header>, <nav>, <aside>, <footer> или любого элемента с ролью ориентира. Обычно причина в обёртке с role="banner" или role="navigation" вокруг всей страницы либо в лишнем role="main" внутри существующего ориентира. На странице должна быть ровно одна основная область.
В Shopify
<main> обычно задан в layout/theme.liquid. Проверьте, что его не охватывает обёртка шапки или встроенное приложение и что секции не добавляют собственный role="main".
В Shoptet (CZ)
Определяется HTML-структурой шаблона. Проверьте, исправляет ли это более новая версия шаблона; иначе сообщите в Shoptet или партнёру.
В PrestaShop
Обычно это .tpl-файлы макета темы, где открывается обёртка содержимого. Убедитесь, что она не находится внутри шапки, колонки или другого элемента с ролью ориентира.
В WooCommerce
Обычно header.php темы открывает обёртку с ролью ориентира, которая затем содержит область содержимого, или конструктор страниц добавляет role="main" внутреннему контейнеру. Исправьте это в шаблонах дочерней темы или в настройках макета конструктора.
Стандарты
Это не критерий WCAG, а рекомендуемая практика, которая делает сайт удобнее.
Автоматическая проверка: правило axe-core landmark-main-is-top-level.
dequeuniversity.com, github.com, www.w3.org