UX и дизайнUI-дизайнUX-паттерны

Доступность (a11y)

Принципы и практики проектирования продукта, которым могут пользоваться люди с разными возможностями, включая нарушения зрения, слуха, моторики.

КРАТКО
Доступность — это не «забота о меньшинствах», а нормальное проектирование. Контраст текста, крупные кликабельные элементы, работа с клавиатуры и текстовые описания картинок помогают и людям с нарушениями зрения, и всем остальным. По данным ВОЗ, около 16% людей в мире живут с устойчивой инвалидностью, и ещё больше — с временными ограничениями: травма руки, плохой свет, шумное место.
СИНОНИМЫ:доступностьдоступность интерфейсаAccessibilitya11y

Доступность часто сокращают до a11y: между первой «a» и последней «y» в английском слове accessibility ровно 11 букв. Основной стандарт в этой области — WCAG.

Что обычно проверяют

  • Контраст текста и фона: не ниже 4,5:1 для основного текста.
  • Размер интерактивных элементов: 44×44 пикселя — комфортный минимум.
  • Работа без мыши: можно ли пройти все ключевые сценарии с клавиатуры.
  • Текстовые описания картинок и иконок.
  • Понятные сообщения об ошибках, привязанные к полям формы.
  • Поддержка программ экранного доступа и других вспомогательных технологий.

Почему это важно бизнесу

  • Прямые требования регуляторов и крупных корпоративных заказчиков.
  • Расширение аудитории: миллионы людей просто не пользуются неудобными продуктами.
  • Более понятная разметка страниц, а вместе с ней и лучший результат в поиске.
  • Меньше нагрузки на поддержку: люди реже ошибаются и реже пишут «не могу нажать кнопку».
КОГДА ПРИМЕНЯТЬ
  • В любом продукте с публичной аудиторией
  • В государственных, банковских, медицинских сервисах — это часто требование закона
  • В B2B-продуктах для крупных корпораций с собственными требованиями
КОГДА НЕ СТОИТ
  • Не существует: даже внутренние инструменты выигрывают от доступности — среди ваших сотрудников тоже есть люди с разными возможностями
ПРИМЕР

Команда встроила автоматическую проверку контраста в дизайн-систему: все цвета и шрифты теперь прогоняются через требования WCAG AA. Сразу выяснилось, что светло-серый текст подсказок в формах не проходит по контрасту. После правки разницу заметили и пользователи без нарушений зрения: формы стали понятнее, а операторы поддержки получили на треть меньше уточняющих вопросов «куда нажать».

КАК ИСПОЛЬЗОВАТЬ В SHTAB

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

Попробовать бесплатно

Вопросы про «Доступность (a11y)»

Требования зависят от страны. В России нормы действуют для государственных сайтов и сервисов, в ЕС и США есть широкие требования и большая судебная практика по искам к компаниям. В корпоративных закупках крупные заказчики нередко прямо указывают соответствие WCAG уровня AA как условие договора, поэтому доступность превращается ещё и в вопрос продаж.

Применяйте термины на практике

База знаний, задачи и цели — в одном сервисе. Бесплатно — без лимита по числу людей.