Проверка контрастности WCAG
Убедитесь, что цветовые сочетания вашего сайта соответствуют стандартам доступности WCAG 2.1 (уровни AA и AAA).
Зачем нужна контрастность цветов?
Веб-доступность означает создание сайтов, которыми могут пользоваться все люди, включая людей с ограниченными возможностями. Контрастность цветов — один из ключевых аспектов доступности. Она влияет на людей со слабым зрением, дальтонизмом и на всех, кто читает с экрана при ярком солнечном свете.
Руководство по обеспечению доступности веб-контента (WCAG) — международный стандарт веб-доступности. Он определяет три уровня соответствия: A (минимальный), AA (средний) и AAA (максимальный).
Коэффициенты контрастности WCAG
Коэффициент контрастности — это числовое значение от 1:1 (белый текст на белом фоне) до 21:1 (черный текст на белом фоне). Чем выше значение, тем лучше читаемость.
- Уровень AA (минимальный): коэффициент контрастности не менее 4.5:1 для обычного текста и 3:1 для крупного текста.
- Уровень AAA (повышенный): коэффициент контрастности не менее 7:1 для обычного текста и 4.5:1 для крупного текста.
Что считается крупным текстом?
По стандарту WCAG крупный текст — это текст размером от 18pt (24px) или 14pt (18.66px) при полужирном начертании. Поскольку крупный и жирный текст легче воспринимается, для него допустим более низкий коэффициент контрастности.
Как исправить проблемы с контрастностью
Если цвета не прошли проверку, доступность можно улучшить следующими способами:
- Затемните текст: если у вас светлый фон, попробуйте сделать цвет текста темнее.
- Осветлите фон: более светлый фон улучшает контрастность с тёмным текстом.
- Увеличьте размер или жирность шрифта: это позволит тексту попасть в категорию «крупный», где требования к контрастности мягче.
Кому это полезно?
Стандарты WCAG разработаны для людей с нарушениями зрения, но хорошая контрастность полезна всем. Она снижает нагрузку на глаза, облегчает чтение на мобильных устройствах в разных условиях освещения и в целом улучшает пользовательский опыт.
Интересный факт
Дальтонизмом страдают примерно 8% мужчин и 0,5% женщин в мире. Высокая контрастность помогает пользователям с дейтеранопией, протанопией и тританопией эффективно различать элементы интерфейса.
Часто задаваемые вопросы
Что такое WCAG?
WCAG (Web Content Accessibility Guidelines) — это международный стандарт, разработанный консорциумом W3C для обеспечения доступности веб-контента для людей с ограниченными возможностями.
Какой минимальный коэффициент контрастности нужен?
Для уровня AA — не менее 4.5:1 для обычного текста и 3:1 для крупного. Для уровня AAA — не менее 7:1 и 4.5:1 соответственно.
Обязательно ли соблюдать WCAG в России?
В России действует ГОСТ Р 52872-2019, который содержит требования к доступности веб-ресурсов. Требования к контрастности аналогичны WCAG 2.1 уровня AA. Государственные сайты обязаны соблюдать эти стандарты.
Как узнать коэффициент контрастности?
Введите два цвета (текст и фон) в наш калькулятор выше. Инструмент мгновенно рассчитает коэффициент контрастности и покажет, соответствует ли сочетание уровням AA и AAA.
Похожие инструменты
Калькулятор звукоизоляции: индекс Rw, Lnw, подбор материалов
Расчёт звукоизоляции стен и перекрытий по СП 51.13330. Индексы Rw и Lnw, акустический комфорт, подбор материалов.
Калькулятор стропильной системы
Расчёт стропил: шаг, сечение, длина. Снеговая и ветровая нагрузка по СП 20.13330.
Калькулятор объёма багажника
Расчёт объёма багажника по размерам и модели авто. База 40+ популярных автомобилей в России. Вместимость чемоданов, сравнение.
Калькулятор стехиометрии: балансировка и выход реакции
Балансировка химических уравнений (онлайн), расчет лимитирующего реагента и выхода реакции (теоретический/процентный).
Калькулятор физиологии
Сердечный выброс, среднее АД (MAP), ОПСС (SVR), ФВД (FEV1/FVC), фильтрационная фракция, кривая диссоциации гемоглобина.
Калькулятор молекулярной массы
Молекулярная масса любого соединения. Формула (H2O, NaCl, C6H12O6) → масса и массовые доли элементов.
Калькулятор схемы посадки растений
Расчёт расстояния между растениями, количества рассады на грядку и расхода семян. Схемы для овощей и ягод.
Калькулятор загрузки паллет/контейнера
Расчёт оптимальной загрузки контейнера или паллета. 20ft, 40ft, еврофура, газель. Количество коробок и заполняемость.
Калькулятор контроля качества
Расчёты контроля качества: контрольные карты, Cp/Cpk, выборочный контроль, Парето, GR&R, стоимость
Калькулятор размера плода по УЗИ
Оценка размера плода по данным УЗИ: БПР, ОЖ, ДБ. Нормы по неделям беременности.
Калькулятор дней (даты, рабочие дни, отпуск)
Калькулятор разницы между датами, расчет рабочих дней и выходных. Прибавить или отнять дни, рассчитать конец отпуска.
Калькулятор арматуры
Расчет веса арматуры по длине и диаметру. Таблица весов ГОСТ 5781-82. Узнайте сколько весит метр арматуры.
Калькулятор времени скачивания и скорости (bandwidth)
Рассчитайте время загрузки файла, узнайте какая скорость нужна для скачивания за определенное время. Калькулятор интернета.
Калькулятор стоимости содержания кошки
Расчёт годовых расходов на содержание кошки: корм, ветеринар, наполнитель, аксессуары.
IP калькулятор: конвертер IPv4/IPv6 и подсети
Конвертация IPv4 в IPv6, расчет подсетей (CIDR), масок и диапазонов. Инструмент для сетевых инженеров.
Лиана Арифметова
Миссия: Демократизировать сложные расчеты. Превратить страх перед числами в ясность и контроль. Девиз: «Любая повторяющаяся задача заслуживает своего калькулятора».
Был ли этот калькулятор полезен?
Отказ от ответственности
Только для информационных целей. Все расчёты, результаты и данные, предоставляемые данным инструментом, носят исключительно ознакомительный и справочный характер. Они не являются профессиональной консультацией — медицинской, юридической, финансовой, инженерной или иной.
Точность результатов. Калькулятор основан на общепринятых формулах и методиках, однако фактические результаты могут отличаться в зависимости от индивидуальных условий, исходных данных и применяемых стандартов. Мы не гарантируем полноту, точность или актуальность приведённых расчётов.
Медицинские, финансовые и профессиональные решения должны приниматься исключительно на основании консультации с квалифицированными специалистами — врачом, финансовым советником, инженером или другим профессионалом в соответствующей области. Не используйте результаты данного инструмента как единственное основание для принятия важных решений.
Ограничение ответственности. Авторы и разработчики сервиса не несут никакой ответственности за прямой или косвенный ущерб, возникший в результате использования данных расчётов. Пользователь принимает на себя всю ответственность за интерпретацию и применение полученных результатов.