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

Цветовой контраст — не «красота», а условие, чтобы текст вообще читали

Цветовой контраст — не «красота», а условие, чтобы текст вообще читали

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

Проверяйте не только основной текст, но и:
— плейсхолдеры, подписи, иконки и состояния disabled;
— ссылки в тексте и hover/focus-состояния;
— графики, бейджи, уведомления и табы.

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

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

Свежие посты в категории «Tech Infrastructure»

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

start

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

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

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