А вы знаете, что 15% людей с тяжелой формой инвалидности пользуются интернетом ежедневно? Среди них самый высокий процент людей в возрасте от 15 до 29 лет. Хотите узнать, как выглядит интернет для них? Установите на свой компьютер приложение VoiceOver и попытайтесь найти что-нибудь, написать письмо или заказать товар.

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

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

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

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

20 лет назад независимое федеральное американское агентство ADA создало Руководство по обеспечению доступности web-контента WCAG. Это руководство регулярно обновляется и является нерушимым сводом правил для создания инклюзивного дизайна.

Основные правила WCAG

Начнем с цвета

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

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

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

Очень важно предоставить пользователю настраивать стиль страницы самостоятельно. Самое простое, что вы можете делать - дать три варианта такой цветовой настройки. Более сложные вариации - кастомная настройка цвета кнопок, фона, цвета и даже - ссылок.

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

Медиафайлы

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


Текст

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


Ну и еще пару очевидных моментов, избегайте курсива, длинных слов, переноса и сложных предложений.

 

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

Управление

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


Навигация

Забудьте об использовании скрытых элементов навигации.

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

Еще один момент: не забывайте про теги перед заголовками, списками, таблицами и прочими важными моментами при верстке страниц.

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

О том, как создавать по-настоящему сложные дизайны, даже с нулевым опытом, мы рассказываем на нашем курсе “Веб-дизайнер: Счастливый Билет в Таиланд”.