Контраст текста: почему «почти видно» всё равно ломает интерфейс

Контраст текста: почему «почти видно» всё равно ломает интерфейс

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

Базовые правила:
— обычный текст: контраст не ниже 4.5:1;
— крупный текст, иконки и границы важных контролов: не ниже 3:1;
— placeholder не должен быть единственным способом понять поле;
— состояние focus/hover/error должно отличаться не только цветом.

Типовые ловушки:
— серый текст на белом «для аккуратности»;
— белый текст на яркой кнопке без проверки;
— текст поверх фото или градиента;
— disabled-элементы, которые выглядят как обычный текст, но еле видны.

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

Хороший контраст не делает интерфейс грубым. Он делает его читаемым. Сначала обеспечьте доступность, потом настраивайте визуальную тонкость.