Доступность сайта для слабовидящих: что требуется и как проверить

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

Какие есть стандарты

WCAG — международное руководство по доступности веб-контента от W3C (обзор стандарта). Описывает требования по уровням A, AA и AAA. На уровень AA обычно ориентируются как на разумный минимум.

ГОСТ Р 52872-2019 — российский стандарт требований доступности интернет-ресурсов для людей с инвалидностью по зрению (текст стандарта). Во многом опирается на WCAG.

Обязательность зависит от организации. Для сайтов органов власти и учреждений действуют отраслевые требования. Образовательные организации по требованиям к структуре официального сайта должны иметь версию для слабовидящих. Для частного бизнеса это рекомендация, но доступность влияет на удобство и конверсию.

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

• Пожилые клиенты — большая аудитория клиник, аптек, банков, ЖКХ. Мелкий серый текст для них нечитаем.
• Плохой контраст мешает всем на улице при ярком свете.
• Формы без подписей и с непонятными ошибками теряют заявки у всех, не только у людей с инвалидностью.
• Подписи к картинкам и правильные заголовки помогают поисковикам и ИИ-сервисам понимать страницу.
• Для государственных закупок и работы с бюджетными организациями доступность может быть требованием.

10 проверок за час

Версия для слабовидящих

Классическая «версия для слабовидящих» — переключатель, который увеличивает шрифт, включает контрастную схему и убирает картинки. Для организаций, где она обязательна, её нужно сделать. Но важно понимать: люди, которые пользуются программами экранного доступа, обычно не нажимают такую кнопку, а слушают сайт через программу чтения с экрана. Им нужна правильная разметка основного сайта: заголовки, подписи, порядок элементов.

Что исправить в первую очередь

1. Контраст и размер текста. Самая частая и самая дешёвая проблема. Подробно — в статье о контрасте текста.
2. Формы. Подписи над полями, понятные ошибки, правильный тип полей, доступная галочка согласия.
3. Клавиатура и фокус. Видимая рамка фокуса, доступ к меню, модальным окнам и кнопкам без мыши.
4. Картинки. Описания для содержательных изображений, пустой alt для декоративных.
5. Заголовки и структура. Логичный порядок, понятные тексты ссылок.
6. Видео и аудио. Субтитры и текстовые расшифровки для важных материалов.

Как встроить в разработку нового сайта

• Включите требования WCAG AA или ГОСТ Р 52872 в ТЗ.
• Проверяйте контраст и размер шрифтов на этапе дизайн-макета.
• Используйте стандартные элементы разметки: кнопки — кнопками, ссылки — ссылками.
• Тестируйте с клавиатуры и с программой чтения с экрана — встроенной в телефон или компьютер.
• Запускайте автоматические проверки доступности при каждой выкладке.

Для нового сайта доступность почти ничего не стоит, если думать о ней с начала. Для готового сайта исправления занимают от нескольких часов до нескольких недель.

Отдельно про цвет. Не передавайте смысл только цветом: красная подсветка поля с ошибкой без текста не видна людям с нарушением цветовосприятия, а их среди мужчин заметная доля. Добавляйте текст или значок. То же для графиков и статусов: «оплачено» зелёным и «не оплачено» красным должны отличаться ещё и подписью.

Сколько стоит

Как проверять регулярно

Доступность ломается при каждом редизайне и новом блоке. Добавьте в чек-лист приёмки три пункта: контраст нового текста, работа с клавиатуры, подписи к новым картинкам и полям. Раз в полгода прогоняйте автоматическую проверку по всему сайту. Если сайт относится к организациям, для которых доступность обязательна, сохраняйте результаты проверок — они пригодятся при проверках надзорных органов.