Цветовой контраст очень важен с точки зрения обеспечения доступности веб-контента.
Качественный сайт, в том числе его дизайн, должен соответствовать определённым стандартам.
Рекомендую вам ознакомиться с переводом на русский язык руководства WCAG 2.0.
Цветовой контраст текста
Совсем недавно на одном из форумов автор темы попросил оценить дизайн его городского портала. И если в целом дизайн был интересен, то отдельные его элементы — цвет текста и ссылок в футере, требовали доработки.
Дело в том, что указанные элементы почти сливались с фоном и пользователь вынужден напрягать зрение и присматриваться для того, чтобы понять, что там написано.
Это одна из причин того, что цветовой контраст текста очень важен с точки зрения визуализации веб-контента. Мы должны помнить, что среди пользователей интернет много людей со слабым зрением. Учитывая это, цветовой контраст текста по возможности должен соответствовать всем уровням стандарта WCAG 2.0.
Цветовой контраст текста — основные требования
Основные требования к цветовому контрасту принято разделять на три уровня:
«А» — базовый уровень.
«АА» — минимальные требования к контрасту.
«ААА» — расширенные требования к контрасту.
Начнем сразу с уровня «АА». Этим уровнем предусмотрен коэффициент контрастности текста 4,5 к 1, за исключением случаев, описанных в п.1.4.3 Руководства WCAG 2.0.
Третий уровень «ААА» предписывает использовать коэффициент контрастности текста 7 к 1.
Исключения из этого правила указаны в п.1.4.6 Руководства WCAG 2.0.
Как же проверить, отвечает ли цветовой контраст текста (используемая вами схема) требованиям стандарта?
Для этого придуман очень хороший и главное бесплатный онлайн-инструмент — Contrast — A.
C помощью этого сервиса вы можете подобрать оптимальную по контрасту цветовую тему.
Надеюсь, что после этой публикации цветовой контраст текста многих сайтов значительно улучшиться.