Перейти к содержимому
Pandus
ru Сменить язык
Меню

Требование WCAG A/AA Приоритет: Серьёзно

Пользователи клавиатуры не могут добраться до встроенного содержимого

Встроенный фрейм (iframe) содержит ссылки, кнопки или поля формы, но у самого фрейма стоит tabindex="-1", из-за чего он исключён из порядка перехода с клавиатуры.

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

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

Люди, которые перемещаются клавишей Tab, пропускают весь фрейм. Если в нём форма оплаты картой, карта доставки, календарь бронирования или чат, они не смогут ими воспользоваться и, возможно, не завершат заказ.

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

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

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

Уберите tabindex="-1" у каждого <iframe> или <frame> с интерактивным содержимым, чтобы фокус клавиатуры мог попасть внутрь. Если фрейм чисто декоративный или дублируется, скройте его правильно (например, aria-hidden и никакого фокусируемого содержимого внутри). Для сторонних встраиваний проверьте код встраивания или обратитесь к поставщику.

В Shopify

Обычно это код встраивания или приложение, которое добавляет tabindex="-1" своему iframe (видео, отзывы, чат, оплата). Уберите его из своего кода встраивания; iframe приложений должен исправить их разработчик.

В Shoptet (CZ)

Обычно это коды встраивания или виджеты, добавленные через собственный код. Уберите tabindex="-1" из кода встраивания; поставщикам виджетов, возможно, придётся исправить свои фреймы.

В PrestaShop

Обычно это модули, встраивающие видео, карты или формы оплаты в iframe. Уберите tabindex="-1" в шаблонах .tpl модуля или темы; о сторонних модулях сообщите их разработчику.

В WooCommerce

Обычно это конструкторы страниц, слайдеры или плагины (видео, карты, оплата, чат), которые добавляют tabindex="-1" к iframe. Проверьте настройки виджета или плагина и сообщите автору плагина.

Стандарты

Стандарты
СтандартПункт
WCAG 2.2 2.1.1 (A) Keyboard
WCAG 2.1 2.1.1 (A) Keyboard
WCAG 2.0 2.1.1 (A) Keyboard
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 frame-focusable-content. dequeuniversity.com, github.com, www.w3.org

Похожие проверки

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