Доступность веб-интерфейсов

<b>Клавиатура — не запасной вариант: где ломается доступность интерфейса</b>

<b>Клавиатура — не запасной вариант: где ломается доступность интерфейса</b>

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

Самая частая ошибка — делать красивый кастомный компонент и забывать про семантику. Кнопка должна быть кнопкой, ссылка — ссылкой, поле — полем. Если элемент выглядит кликабельным, но не попадает в Tab, пользователь просто не дойдёт до него. То же касается скрытых элементов: если они нужны для действия, они должны открываться и закрываться предсказуемо.

Отдельно проверьте фокус после действий: открытие модального окна, переход между шагами, удаление строки, отправка формы. Фокус не должен «прыгать» в начало страницы или исчезать в никуда. Хорошее правило: после каждого важного действия пользователь должен понимать, где он оказался и что делать дальше.

Если интерфейс проходит сценарий только мышью, это не мелкий недочёт, а поломка основного пути. Прогоните весь ключевой поток только клавиатурой — и исправляйте всё, что мешает двигаться без догадок.
Этот пост опубликован в Telegram-канале Доступность веб-интерфейсов. Подписаться можно по ссылке: @accessibility_in_design_ww.
editorial

Свежие посты в категории «Editorial Voice & Insider»

Все каналы категории →

start

Готовы запустить рекламу через сеть public.tg?

Новый оффер, продукт, GEO, кейс, событие или партнёрский запуск — соберём маршрут под задачу и отдадим медиаплан.

Telegram для медиаплана: @dumay. Быстрый тест: $20 за канал, $1000 за пакет по сети.