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

Управление клавиатурой: 7 проверок, которые ломают доступность интерфейса

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

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

Не ставьте tabindex выше 0 без крайней нужды. Чаще используйте нативные button, a, input: у них уже есть роли и базовая клавиатурная логика. Div с onclick придётся дополнять вручную.

Мини-тест: откройте страницу, уберите мышь и попробуйте оформить заказ, отправить форму или раскрыть меню. Если приходится угадывать, где фокус, интерфейс недоступен.

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

Свежие посты в категории «Сервисы и инфраструктура»

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

start

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

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

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