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