Вообще, Лиза Шарлотта Мут из Датавраппер справедливо
указывает, что WCAG не вполне применим к визуализации данных. И рассказывает о том, что Эндрю Сомерс разрабатывает собственный стандарт — APCA, который даёт более адекватные результаты по контрасту цветов, в применении к визуализации данных.
Кроме того, на различимость цветов влияет не только яркость фона и основного цвета, но и размер цветового элемента, характер фона (на темном фоне светлые оттенки более различимы, чем наоборот), качество экрана, конкретные оттенки, освещенность окружающей среды, отступ до краев фона и другие.
В качестве примера, я хочу показать инфографику, которая использовалась в рекламе Экономист про города, наиболее пригодные для жизни. Я проверил их через
WCAG — и результаты получились катастрофические. 3 цвета из 5 имели недостаточный уровень контраста по WCAG — 1,02, 1,44, 1,87, а еще один — 2.22 — тоже ниже нормы по контрасту. (Норма — 3:1 и более для крупных элементов и 7:1 и более для мелких)
Эндрю Соммерс предлагает свой
инструмент для стандарта APCA. Я проверил картинку от Экономист там... и результаты оказались теми же самыми :))
45% — это минимум для крупного текста (аналог 3:1 для WCAG). 60% — норма для среднего размера объектов. И для мелких объектов контраст должен быть не меньше 75%. Этот тест также прошел лишь один цвет. Добавим, что еще и точки очень маленькие.
(Вообще, я обратил внимание на эту картинку именно потому, что засомневался, что бледно-желтый проходит по читаемости, потому что на телефоне эти точки было не видно вовсе)
Сложно понять, чем руководствовались дизайнеры Экономист, возможно это просто картинка для промо, и она и не должна была быть 100% читаемой, но очевидно, что бледно-голубой и бледно-желтый на этом сером имеют катастрофически низкий контраст.
Пожалуйста, продумывая цвета для датавиз, учитывайте не только их функциональность с точки зрения выполнения датавиз-функций, эстетику, но также не забывайте про различимость их между собой и с фоном.