Цветовой контраст очень важен с точки зрения обеспечения доступности веб-контента.

Качественный сайт, в том числе его дизайн, должен соответствовать определённым стандартам.

Рекомендую вам ознакомиться с переводом на русский язык руководства  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.

Цветовой контраст и стандарт WCAG 2.0

C помощью этого сервиса вы можете подобрать оптимальную по контрасту цветовую тему.

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *