Клавиатура как основной путь: где ломается доступность интерфейса
Если в интерфейсе всё работает только мышью, пользователь быстро упирается в тупик. Проверка простая: можно ли дойти до любой кнопки, поля и меню клавишей Tab, понять, где сейчас фокус, и выполнить действие без «дополнительных» жестов.
Базовый чек-лист:
• порядок фокуса должен совпадать с логикой экрана, а не с DOM-хаосом;
• фокус всегда видим: не убирайте outline без замены;
• модальные окна ловят фокус внутри себя и возвращают его на триггер после закрытия;
• все раскрывающиеся элементы открываются и закрываются с клавиатуры;
• для нестандартных компонентов используйте ожидаемые клавиши: Enter, Space, Esc, стрелки.
Частая ошибка — сделать элемент «похожим на кнопку», но оставить его div без роли и обработки клавиш. Пользователь табом до него дойдёт, но активировать не сможет. Ещё одна ловушка — кастомные списки и табы, где стрелки меняют выбор, а фокус остаётся где-то в стороне. В итоге экран читается плохо и действия становятся непредсказуемыми.
Проверяйте не только видимые кнопки, но и скрытые сценарии: поиск, фильтры, автодополнение, выпадающие меню, карусели. Если элемент меняет состояние, это должно быть доступно с клавиатуры и заметно по фокусу. Иначе интерфейс выглядит «готовым», но для части людей он просто не работает.
Хороший тест один: попробуйте пройти ключевой сценарий без мыши от начала до конца. Если где-то хочется «ну тут уже можно и кликнуть» — это и есть место, где доступность сломана.
Доступность веб-интерфейсов
@accessibility_in_design_ww
Клавиатура как основной путь: где ломается доступность интерфейса
Этот пост опубликован в Telegram-канале Доступность веб-интерфейсов. Подписаться можно по ссылке: @accessibility_in_design_ww.