Логический порядок табуляции важен для удобства работы с клавиатурой. Программы чтения с экрана и другие вспомогательные технологии перемещаются по странице в порядке DOM. Поток информации должен иметь смысл.
Как проверить вручную
Чтобы проверить, является ли порядок табуляции в вашем приложении логичным, попробуйте перемещаться по странице с помощью табуляции. В общем, фокус должен соответствовать порядку чтения, сверху вниз на странице. В большинстве языков порядок чтения меняется слева направо. В некоторых языках, например в арабском и иврите, порядок чтения перемещается справа налево.
При оценке порядка табуляции следует учитывать две основные идеи:
- Расположены ли элементы в DOM в логическом порядке?
- Правильно ли скрыто закадровое содержимое от навигации?
Обратите внимание на любые скачки в навигации, которые кажутся резкими. Также обратите внимание на переходы за пределы экрана, когда нажатие табуляции приводит к содержимому, которое не должно быть видимым.
Дополнительные сведения см. в разделе «Основы доступа с клавиатуры» .
Как исправить
Если порядок фокуса кажется неправильным, измените порядок элементов в DOM, чтобы сделать порядок табуляции более естественным.
Избегайте использования CSS для визуального изменения положения элементов, поскольку пользователи вспомогательных технологий столкнутся с бессмысленной навигацией. Вместо использования CSS переместите элемент на более раннюю позицию в DOM.
Если закадровый контент по-прежнему доступен для элементов управления с клавиатуры, рассмотрите возможность его удаления с помощью tabindex="-1" .
Узнайте больше в разделе Управление фокусом с помощью tabindex .
Ресурсы
Исходный код для визуального порядка на странице соответствует аудиту порядка DOM.