5 способов улучшить UX интерфейс для пользователей с ограниченными возможностями

От автора: Способности пространственного мышления широко распространены от человека к человеку. Однако стоит сказать, что у дизайнеров, обычно, навык визуализации и понимания принципов работы сайта выше среднего. Именно поэтому зачастую дизайн рисуется в первую очередь. Но делает ли это нас идеальными кандидатами в дизайнеры? На самом деле нет.

Чтобы предложить всем пользователям хороший опыт взаимодействия с сайтом, необходимо побывать в его шкуре. А это может быть немного сложно, если вы здравомыслящий и продвинутый пользователь.

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

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

Недостаток цветового зрения

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

Люди с цветовой слепотой не слепы к определенным цветам – они просто по-разному воспринимают цвета. Наиболее распространены проблемы с красным и зеленым цветами. Это называется дейтеранопия.

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

Урок 1: не все видят одинаково

Общее нарушение зрения

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

Вы должны были использовать атрибут alt для описания изображения, подчеркивание ссылок и, скорее всего, вы правильно записываете сокращения (“C.V.D” а не “CVD”). Я не буду утомлять вас какими-то общими советами, которые вы и раньше уже читали.

Если кратко: Чтобы скрин ридеры могли правильно диктовать текст пользователю, им необходимы теги alt и правильно оформленные сокращения.

Общее у всех этих техник и советов то, что еще лучше они работают в контрастном режиме. Увеличить контрастность можно не только с помощью двух резко различающихся цветов, но и с помощью других шрифтов, чтобы лучше отличать заголовки от основного текста, а также можно добавить пробелы, чтобы лучше понимать, когда заканчивается одна часть и начинается другая.
Ниже представлен пример Ingram – обратите внимание на разборчивый шрифт (как serif так и sans-serif), большой текст, умное использование пространства – все это не жертвуя широко известным трендом и привлекательными изображениями. В общем и целом, делать вещи больше, контрастнее это шаг вперед.

Урок 2: дефекты более распространены, чем ты думаешь

Дислексия

Дислексия также известна как «расстройство при чтении», которому подвержены до 7% населения Земли, что делает его самым распространенным дефектом влияющем на обучение. Несмотря на нормальное развитие, людям с дислексией трудно произносить слова, звуки или быстро читать.

Люди с дислексией почти не могут читать сайты с низкой контрастностью или неразборчивым шрифтом. И как это исправить?
На самом деле решение одно и то же – контраст. У людей, страдающих дислексией, переворачиваются буквы. Т.е. буква b может превратиться в d, а буква p – в q.

Люди с дислексией легко могут читать тексты с увеличенными заглавными буквами, дополнительным расстоянием между символами, разной высотой строки, наклонные символы и идеально, если каждый символ в шрифте будет спроектирован вручную. Christian Boer, создатель Dyslexie font (сам страдает дислексией) в подробностях объясняет, как его исследования помогли ему улучшить свое чтение. Любой, кто работает со шрифтами, скажет ему спасибо за это.

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

Урок 3: эстетика бесполезна, если текст неразборчив

Глухота

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

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

Урок 4: веб-дизайн не должен полностью полагаться на звук и видео

Нарушения двигательных функций

У людей с нарушенной моторикой (пожилые люди или нет) возникают проблемы при работе с мышкой и клавиатурой. Скажу за себя, мне было трудно нажать «сохранить для Web» в фотошопе, а у меня даже нет нарушений с моторикой рук. В Sketch такой тип взаимодействия обрабатывается намного эффективнее. К примеру, создать прямоугольник это «R» на клавиатуре. В веб-дизайне полно клавиатурных сокращений, их использует как Atomic.io так и Dribbble.

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

Урок 5: уменьшив количество взаимодействий, вы всех сделаете счастливее.

Заключение

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

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

Автор: Daniel Schwarz

Источник: //www.sitepoint.com/

Редакция: Команда webformyself.

Комментарии Вконтакте: