Как создать доступный интерфейс для пользователей с дальтонизмом?

Несколько рекомендаций, которые помогут создать доступный интерфейс для пользователей с дальтонизмом:

• Использовать больше контраста. gb.ru Контент должен хорошо контрастировать с фоном. gb.ru Идеальное решение — тёмный текст или фото на светлом фоне. gb.ru Не стоит накладывать цвета из одного цветового спектра друг на друга. gb.ru
• Упор на визуал, а не на цвет. gb.ru Не использовать цвет как единственное средство для передачи информации. gb.ru Маркировать элементы интерфейса фигурами и иллюстрациями, или сочетать цвет с текстурами. gb.ru
• Больше синего и серого. gb.ru Эти цвета, как правило, нейтральны для дальтоников. gb.ru
• Меньше градиентных фонов. gb.ru Дальтоники искажённо видят переходы цветов и оттенков. gb.ru Для фотографий использовать изображения с чёткими контурами, на которых явно виден переход. gb.ru
• Избегать определённых цветовых сочетаний. tproger.ru Люди с нарушением цветового восприятия не различают некоторые цвета. tproger.ru Стоит избегать сочетаний зелёного и коричневого, зелёного и оранжевого/жёлтого, синего и фиолетового. tproger.ru
• Использовать текстовые подсказки в обозначении цветов. tproger.ru Например, если цвет в интерфейсе несёт какую-то важную информацию, нужно явно написать, что именно пошло не так. skillbox.ru
• Проверять, что интерфейс различим и контрастен в черно-белом варианте. tproger.ru Обесцвечивая интерфейс, можно увидеть, насколько элементы контрастны между собой безотносительно их цвета. tproger.ru

Для проверки макетов можно использовать, например, расширение для браузера NoCoffee Vision Simulator, симулятор дальтонизма Sim Daltonism для iOS и macOS и другие инструменты. gb.ru molinos.ru