Как использовать удобные палитры для дальтоников, чтобы сделать ваши диаграммы доступными

Цвета играют центральную роль в визуализации данных. Но что, если ваши читатели дальтоники?

По данным Color Blind Awareness, дальтонизмом страдают 1 из 12 мужчин (8%) и 1 из 200 женщин (0,5%). По оценкам, во всем мире насчитывается около 300 миллионов дальтоников, включая Марка Цукерберга, Билла Клинтона и принца Уильяма!

Оптимизация графики может помочь сделать ее более доступной — и это не означает, что цвет будет удален из ваших диаграмм и графиков. Это означает, что люди с нарушениями зрения могут понять ваши проекты с помощью средства проверки контрастности WCAG — к счастью для вас, эта функция встроена прямо в редактор дизайна Venngage со специальными возможностями.

Вопреки распространенному мнению, более 99% дальтоников на самом деле могут видеть цвета, но не так, как люди, не страдающие дальтонизмом. В этом руководстве мы разберем различные типы дальтонизма и их особенности в отношении визуализации данных. Мы также покажем вам, как эффективно использовать удобные для дальтоников палитры, чтобы сделать вашу графику доступной для более широкого круга людей.

Мы собрали несколько готовых палитр для дальтоников, чтобы вдохновить вас. Для этого прокрутите вниз до раздела 4.

Содержание

1. Что такое дальтонизм?
2. Какие бывают 3 типа дальтонизма?
3. Почему цвет важен для визуализации данных
4. Как создавать диаграммы с помощью палитры, удобной для дальтоников
5. Ключевые блюда на вынос

Первым делом…

Что такое дальтонизм?

Дальтонизм — также известный как дефицит цветового зрения (CVD) — это нарушение способности различать разные цвета. Это происходит, когда светочувствительная ткань в задней части глаза — сетчатка — не может правильно реагировать на изменения длины волны света, которые позволяют людям видеть разные цвета.

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Хотя дальтонизм является преимущественно наследственным заболеванием, он также может быть результатом катаракты или травмы глаза, а также ряда заболеваний, включая болезнь Паркинсона, синдром Каллмана и диабет. Повреждение сетчатки, вызванное старением, может дополнительно вызвать дальтонизм.

Какие существуют 3 типа дальтонизма?

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Существует три различных типа дальтонизма:

Слепота на красный/зеленый цвет

По словам Колблиндора, 99% всех дальтоников страдают от слепоты на красный/зеленый цвет. Это далее разбито на две отдельные категории:

• Протанопия : Также называемая «красной слабостью», люди, которые страдают этим вариантом красно-зеленой дальтонизма, неспособны воспринимать красный свет.

Слева: нормальное зрение, справа: протанопия
ИСТОЧНИК ИЗОБРАЖЕНИЯ

Цветовой спектр протанопии выглядит следующим образом:

ИСТОЧНИК

• Дейтеранопия/дейтераномалия ) или вообще не воспринимает зеленый свет (дейтеранопия).

Слева: нормальное зрение, справа: дейтеранопия

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Цветовой спектр дейтеранопии выглядит следующим образом:

ИСТОЧНИК

Дальтонизм к красному/зеленому цвету передается по наследству и чаще встречается у мужчин, чем у женщин. Причина этого в том, что гены, ответственные за это состояние, содержатся в Х-хромосоме.

Поскольку у женщин две Х-хромосомы, недостаток одной обычно компенсируется другой. У мужчин, однако, есть только одна Х-хромосома, и у них нет «запасной», на которую можно было бы опереться.

Слепота к синему/желтому цвету

Люди, страдающие слепотой к синему/желтому дальтонизму, с трудом различают синий и желтый цвета.

Эта особая форма дальтонизма, также известная как Tritanopia , встречается гораздо реже, чем ее красный/зеленый аналог. На самом деле, по данным Национальной медицинской библиотеки США, сине-желтая цветовая слепота затрагивает менее 1 из 10 000 человек во всем мире.

Поскольку тританопия не вызвана генетическим признаком, связанным с Х-хромосомой, она в равной степени присутствует как у мужчин, так и у женщин.

Слева: нормальное зрение, справа: Тританопия
ИСТОЧНИК ИЗОБРАЖЕНИЯ

Цветовой спектр Тританопии выглядит следующим образом:

ИСТОЧНИК

9 0018 Полная цветовая слепота

Люди, страдающие полной цветовой слепотой — также известные как Monochromacy — вообще не различают цвета. По данным Color Blind Awareness, монохромия встречается крайне редко: у 1 из 33 000 человек.

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Почему цвет так важен для визуализации данных?

Цвет играет важную роль в визуализации данных. Во-первых, цвета используются для выделения важной информации, а также для иллюстрации отношений между различными типами данных. Цвет также играет важную роль в направлении взгляда зрителя. Его можно даже использовать для стимуляции эмоций с помощью цветовой психологии.

Можно даже утверждать, что цвета, используемые в диаграммах и инфографике, на самом деле рассказать историю данных, которые они представляют. Как пишет Ева Мюррей в Forbes:

В визуализации данных цвет задает тон и усиливает сообщение для основного визуального дисплея. Это создает определенную атмосферу и может превратить непритязательную визуализацию в наполненную эмоциями историю данных.

СМОТРЕТЬ: все, что вам нужно знать о ЦВЕТЕ… менее чем за 3 минуты

Знание того, как выбирать цвета, важно, но когда вы оптимизируете доступность, нужно учитывать больше, чем теорию цвета и композицию дизайна .

Связанный: 8 передовых методов проектирования для разнообразия и инклюзивности

Вы также можете использовать инструмент выбора цвета Venngage, чтобы легко переключать разные цвета, особенно полезный инструмент для работы с палитрами, удобными для дальтоников.

Как создавать диаграммы с помощью палитры, удобной для дальтоников

1.) Заранее спланируйте свою цветовую схему цвет из ваших диаграмм. Планируя заранее, вы можете убедиться, что палитра, подходящая для дальтоников, дополняет ваш дизайн, а не конфликтует.

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Даже с таким инструментом, как Venngage, который может значительно сократить количество часов, необходимых для создания инфографики, по-прежнему идеально конкретизировать свою цветовую схему, прежде чем погрузиться и начать новый проект.

.

Если у вас нет заранее запланированной доступной цветовой схемы, вы можете создать ее бесплатно с помощью генератора доступных цветовых палитр Venngage:

красивая, доступная цветовая палитра. Теперь вы можете использовать этот простой инструмент для создания инклюзивных цветовых пар за считанные секунды — бесплатно.

Как это работает? Двумя способами: 

• Рандомизировать . Не думайте дважды — бросайте кости и создавайте палитры на основе случайного цвета.

• Создать из HEX . Введите шестнадцатеричный код, чтобы открыть доступные палитры на основе выбранного вами цвета.

Независимо от того, какой маршрут вы выберете, вы увидите коэффициент контрастности каждого цвета по сравнению с черным или белым текстом. И каждая сгенерированная палитра придерживается коэффициента контрастности 4,5: 1 в соответствии с последними рекомендациями по доступности веб-контента (WCAG) 2.

1 AA.

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

Найдя понравившуюся палитру, просто нажмите Загрузить . Вы получите текстовый файл с шестнадцатеричными кодами для этой палитры и цвета текста, который с ней связан (#ffffff для белого текста и #000000 для черного текста).

Попробуйте бесплатный генератор цветовых палитр Venngage! После того, как вы сузили свою цветовую палитру, вы можете загрузить свои данные. Это просто с виджетами графиков Venngage. Откройте виджет диаграммы, нажмите зеленую кнопку ИМПОРТ на вкладке ДАННЫЕ и загрузите файл CSV. Ваша диаграмма будет визуализировать данные автоматически.

Мы также упростили настройку ваших таблиц. Вы можете представлять данные и выделять важную информацию без ущерба для доступности вашего дизайна.

При редактировании таблицы вы можете выбрать стиль и цвет шрифта, а также цвет фона ячеек. Вы найдете эти параметры на вкладке данных.

Вы также можете упорядочить текст, чтобы улучшить его читаемость, на вкладке настроек. Здесь вы можете выбрать способ выравнивания текста по горизонтали и вертикали в каждой ячейке.

Воспользуйтесь преимуществами подобных функций стилизации! В конце концов, если окажется, что ваши цвета не особенно подходят для дальтоников — а доступность важна для вас — лучше выяснить это до того, как вы потратите значительное время и усилия на свою дизайнерскую композицию.

Если вы не знаете, с чего начать, эти цветовые круги для дальтоников могут быть полезными для быстрого определения того, как ваши цвета будут транслироваться при различных формах дальтонизма:

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Более того, мы собрали несколько универсальных палитр для дальтоников:

9001 8 ГОРЯЧИЙ СОВЕТ: Если вы застряли, попробуйте использовать такой инструмент, как Coblis , бесплатный симулятор дальтоников, который даст вам лучшее представление о том, как ваши изображения будут выглядеть для людей с дальтонизмом.

Связанный: Полное руководство по доступным цветам [включая палитры и шаблоны]

2.) Избегайте проблемных цветовых комбинаций

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

Цветовые комбинации, которых следует избегать людям с дальтонизмом, включают:

• Красный и зеленый
• Зеленый и коричневый
• Зеленый и синий
• Синий и серый
• Синий и фиолетовый
• Зеленый и серый
• Зеленый и черный

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

3.) Используйте высококонтрастные цвета

Как упоминалось ранее, контрастность не является проблемой для большинства людей с дальтонизмом. Затемняйте и осветляйте цвета соответственно, чтобы сделать контраст более выраженным. Вы также можете играть с различными оттенками, а также уровнями яркости и насыщенности.

4.) Использование узоров и текстур

Использование узоров и текстур в дизайне — отличный способ включить в дизайн визуальные элементы, не зависящие от цвета.

ИСТОЧНИК ИЗОБРАЖЕНИЯ

Редактор дизайна Venngage с возможностью перетаскивания содержит библиотеку шаблонов, которые можно использовать для улучшения дизайна и повышения доступности.

Связано: Руководство по дизайну для дальтоников: как донести смысл до всех [с примерами и шаблонами]

5.) Используйте символы

Символы и значки — отличный способ сделать ваш дизайн более доступным, поскольку они могут визуально акцентировать сообщение, не полагаясь на цвет.

Подсказка : библиотека Venngage включает более 4000 значков, которые можно использовать, чтобы сделать инфографику и диаграммы более доступными.

6.) Сделайте вашу диаграмму монохромной

Поскольку дальтонизм не влияет на способность различать разные оттенки, подумайте о том, чтобы сделать ваши диаграммы монохромными. Использование ограниченной цветовой палитры, естественно, означает меньше возможностей для использования проблемных цветов или комбинаций.

7.) Сделайте дизайн чистым и простым

инфографика максимально проста и упорядочена. Принятие минималистского подхода поможет сделать ваши презентации более понятными, независимо от того, является ли ваша аудитория дальтоником.

Основные выводы по использованию палитр, удобных для дальтоников

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

Следующие меры могут помочь дальтоникам действительно взаимодействовать с вашим дизайном:

• Выбор палитр, удобных для дальтоников
• Избегайте проблемных сочетаний цветов
• Использование различных текстур и узоров для выделения важной информации, а не только цветом
• Использование символов и значков для дополнения цветных сообщений, предупреждений и предупреждений
• Использование высококонтрастных цветовых комбинаций
• Принятие минималистического дизайна, чтобы избежать ненужной путаницы.

Сочетание всех этих элементов поможет сделать ваши проекты более доступными для дальтоников. В конце концов, чем больше людей вы сможете привлечь, тем более эффективной будет ваша работа.

Связано: Стандарты ADA для доступного дизайна: как им соответствовать

НОВИНКА! Представляем: Отчет о статистике маркетинга за 2022 год

Уже 2022 год.