Хочу сайт

Наши Статьи

Делимся своим опытом и размышлениями.

Проверка дизайна на доступность

«Агенты перемен» - главные адепты доступного дизайна в Украине. В своем блоге они поделились лайфхак, как проверять и создавать максимально доступный дизайн.

А еще развенчали миф о узнаваемости текста и контраста цветов.

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

Дальтонизм

Около 8% мужчин и 0,5% женщин рождаются с одним из видов дальтонизма. Поэтому любые макеты надо проверять на доступность при цветной слепоте, особенно, когда одновременно используются красный и зеленый цвета.

Adobe

В Adobe Photoshop, Illustrator и InDesign есть встроенная функция проверки макетов на два самых распространенных вида цветной слепоты: View / Proof Setup / Color Blindness Protanopia и Deuteranopia type. Для комфортной работы можете добавить горячую клавишу для включения этих режимов в Edit / Keyboard Shortcuts.

Color Oracle

Если не привязываться только к программам Adode, можно обратиться к более универсальной программы - Color Oracle. Есть версии для MacOS, Windows и Linux. Она запускается независимо от других программ и переводит в режим проверки дальтонизмом все, что отображается на экране.

Контраст цветов

Есть такой распространенный стереотип: «Всем давно известно, что желтый текст на черном фоне - максимально доступный и читабельный» (или желтый на синем, или любая другая пара цветов. Но те, кто пишет «всем известно ...» чаще всего вспоминают желтый) . Но это все бред, обратимся к науке.

Light Reflectance Value

Light reflectance value (LRV) - способность поверхности определенного цвета отражать свет. Чем больше LRV, тем больше света отражает поверхность, тем ярче цвет. Читабельность текста напрямую зависит от разницы LRV двух цветов: фона и текста. Большая разница - больший контраст и распознаваемость (legibility) текста.

Нюансы восприятия шрифтов

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

Например, шрифт FS Millbank имеет две версии: для светлого фона и для темных (с учетом внутренней подсветки знаков).

P.S. Еще один ненаучный метод определения контраста цветов

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

Другие публикации

Наш блог

WordPress. Автогенерация заголовка при создании записи

Автоматическое создание заголовка при сохранении или обновлении записи на CMS WordPress

Как начать плодотворный год с вашей командой

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

Главные законы и порядки UX дизайна

«Законы UX»  - это причинно-следственные связи, когда одно событие (причина) вызывает другую (эффект).
Facebook YouTube Instagram Viber Telegram
Please wait