Клавиатурная навигация: 7 мест, где сайт ломает доступность без мыши

Если человек может открыть сайт, но не может пройти по нему Tab’ом, интерфейс уже теряет часть аудитории. Проверка простая: открой страницу и проходи только клавиатурой. Видимый фокус должен быть на каждой интерактивной зоне, а порядок перехода — совпадать с логикой страницы.

Сначала проверь базу:
— меню, кнопки, ссылки, поля форм;
— модальные окна и выпадающие списки;
— слайдеры, табы, аккордеоны;
— элементы, которые появляются после клика или наведения.

Самые частые ошибки: фокус скрыт стилями, табуляция уходит в невидимые блоки, закрыть окно с клавиатуры нельзя, а активный элемент не получает понятный outline. Ещё одна проблема — кастомные элементы без роли и управления Enter/Space. Для пользователя это выглядит как «кнопка есть, но нажать нельзя».

Проверь и поведение: Esc закрывает модалку, Tab не застревает внутри неё, Shift+Tab идёт назад, а после закрытия фокус возвращается туда, откуда человек пришёл. Это особенно важно для форм, поиска и навигации по каталогу.

Хорошая клавиатурная навигация не заметна. Плохая — мгновенно превращает сайт в набор декоративных блоков. Если пройти страницу без мыши нельзя, сначала чините фокус и порядок табуляции, а уже потом визуальный слой.