Перейти к содержимому
Pandus

Рекомендуемая практика Приоритет: Умеренно

На странице больше одной области основного содержимого

Две или больше частей страницы помечены как основное содержимое. Такая область должна быть только одна. Это рекомендуемая практика, которая выходит за рамки уровня WCAG 2.2 AA, на который опирается закон.

Этот текст переведён автоматически, носитель языка его ещё не вычитал.

Почему это важно для ваших покупателей

Пользователи программ экранного доступа переходят между областями страницы (шапка, меню, основное содержимое, футер), как между главами. Перейдя к «основному содержимому», они могут попасть на баннер или виджет вместо страницы товара или корзины и вынуждены искать заново.

Кого это касается

  • незрячие люди, которые пользуются программами экранного доступа
  • пользователи клавиатуры, которые полагаются на ссылку «Перейти к содержимому»
  • слабовидящие люди, которые пользуются экранной лупой с озвучкой

Как исправить

Оставьте один элемент <main> (или role="main"), который охватывает настоящее содержимое страницы. Лишние <main> или role="main" во вложенных шаблонах, секциях и встроенных виджетах замените на <div> или <section>. Проверьте также всплывающие окна, быстрый просмотр товара и большие меню: их часто собирают из копии шаблона страницы.

В Shopify

Обычно layout/theme.liquid темы уже содержит <main>, а секция или блок приложения добавляет ещё один. Измените лишний <main> в файле секции или попросите разработчика приложения его убрать.

В Shoptet (CZ)

Обычно это идёт от своего HTML, добавленного на страницу, или от шаблона. Сначала проверьте код, который вы добавили сами; если проблема в шаблоне, сообщите Shoptet или партнёру.

В PrestaShop

Обычно и шаблон макета темы (.tpl), и шаблон модуля выводят <main>. Отредактируйте переопределение шаблона модуля в теме, чтобы <main> был только в макете.

В WooCommerce

Обычно тема оборачивает содержимое в <main>, а конструктор страниц или переопределённый шаблон WooCommerce добавляет второй. Исправьте это в шаблоне дочерней темы или смените тег контейнера в конструкторе на div.

Стандарты

Это не критерий WCAG, а рекомендуемая практика, которая делает сайт удобнее.

Автоматическая проверка: правило axe-core landmark-no-duplicate-main. dequeuniversity.com, github.com, www.w3.org

Все правила, которые мы проверяем