Что такое инклюзивный веб-дизайн?

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

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

Рекомендации, предоставленные Консорциумом World Wide Web, а также местными органами власти, помогли дизайнерам устранить пробелы, когда речь идет об удобстве использования и доступности. Однако это не обязательно делает веб-сайт полностью инклюзивным.

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

Узнайте, как проектировать для веб-доступности

Что такое инклюзивный дизайн?

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

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

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

Таким образом, веб-дизайнеры должны учитывать следующие факторы:

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

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

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

Однако инклюзивный дизайн требует более глубокого понимания ограничений, с которыми пользователи могут столкнуться в Интернете. Не существует инструмента, который просканирует ваш веб-сайт и подтвердит, что вы создали максимально разнообразный и равноправный опыт. Это то, что вам придется научиться реализовывать и проверять самостоятельно.

Почему инклюзивный веб-дизайн важен

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

Обратная сторона неинклюзивности

В 2021 году WebAIM опубликовала результаты опроса пользователей программ чтения с экрана № 9. 7,7% респондентов опроса сказали, что им приходится использовать программу чтения с экрана, когда они в сети.

На вопрос, что они думают о состоянии доступности Интернета сегодня, только 39,3% ответили, что он стал более доступным, чем в предыдущие годы. 42,3% считают, что ничего не изменилось, а 18,5% сказали, что стало хуже.

По словам Майка Гиффорда из CivicActions, более 7,7% населения испытывают недоступность и разделяют эти чувства:

«Сочетание инвалидности и способов, с помощью которых люди преодолевают барьеры, чрезвычайно разнообразны. С этической точки зрения создание для наших наименее обеспеченных пользователей должно иметь наивысший приоритет. К сожалению, с нашим постоянным стремлением к новому и яркому мы регулярно исключаем 10-20% наших сограждан».

По данным Американской ассоциации юристов, в период с 2017 по 2020 год в федеральные суды было подано 8000 исков об американцах-инвалидах в соответствии с разделом III Закона. По данным Accessibility.com, только в 2021 году это число подскочило на 14,3% до 2352 исков.

Есть и другие, которые могут чувствовать себя исключенными из веб-сайта, но не могут обратиться в суд. Например, World Data Lab сообщает, что 1,1 миллиарда человек не имеют доступа к интернету. В некоторых случаях это означает, что они не могут позволить себе тарифные планы для мобильных данных. В других случаях они могут, но у них недостаточно данных для использования, поэтому они не могут позволить себе тратить время на ресурсоемкие веб-сайты.

Есть также пожилое население, чтобы рассмотреть. Исследовательский центр Pew Research Center обнаружил, что число пожилых людей, пользующихся Интернетом, за последние годы выросло. Тем не менее, TechCrunch сообщает, что примерно 50% пожилых людей нуждаются в ком-то, кто помог бы им настроить и использовать новые цифровые технологии. Кроме того, 40% пожилых людей неграмотны в цифровом плане в городе Сан-Франциско — рядом с Силиконовой долиной, из всех мест.

Даже если ваш веб-сайт не подвергается судебным искам, подумайте, как потеря 20% или более посетителей из-за неинклюзивного дизайна повлияет на долгосрочную жизнеспособность бренда. Это огромный сегмент аудитории, который уйдет просто потому, что веб-сайт неприятен или непригоден для использования.

Положительная сторона инклюзивности

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

Инклюзивный веб-дизайн ведет к лучшему дизайну продукта.

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

Бренды охватывают большую аудиторию.

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

Пользователи чувствуют себя лучше, взаимодействуя с инклюзивными веб-сайтами.

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

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

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

Как создать инклюзивные персонажи веб-дизайна

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

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

• Имя
• Демографические данные (например, возраст, пол, род занятий и т. д.)
• Личность
• Голос
• Цели
• Мотивы
• Разочарования
• Боится

Инклюзивные персонажи пользователей также должны включать:

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

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

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

Доступ: пользователи не обязательно должны иметь ограниченный доступ к Интернету. Например, по данным ЮНЕСКО, чуть более половины населения земного шара имеет домашний доступ в Интернет. Это не означает, что они не могут выйти в интернет, это просто означает, что они должны найти другие способы получить его — например, пойти в библиотеку или интернет-кафе. Таким образом, подключение, оборудование, программное обеспечение и даже местоположение могут влиять на доступ.

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

7 принципов инклюзивного дизайна

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

1. Гибкость

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

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

2. Простота

Минимализм — устойчивая тенденция веб-дизайна, и на то есть веские причины. Это не только потому, что он создает более визуально приятные интерфейсы, а потому, что минимализм и простота прокладывают путь к более интуитивно понятному дизайну.

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

3. Консистенция

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

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

4. Восприятие

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

Когда вы собираете контент для веб-сайта, убедитесь, что он сбалансирован. Если есть только один тип контента (например, только текст и отсутствие изображений), некоторые из ваших посетителей, вероятно, будут в невыгодном положении, когда дело доходит до понимания или простоты использования.

5. Справедливость

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

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

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

6. Профилактика

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

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

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

7. Размещение

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

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

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

Вывод

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

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

Лучший способ интегрировать инклюзивность в ваш процесс веб-дизайна — сначала убедиться, что вы работаете с инструментами, которые помогут вам реализовать ее, такими как функции доступности WordPress и Elementor. Затем обновите шаблоны персонажей пользователей, включив в них такие факторы, как способности, способности и доступ. Наконец, обновляйте свой процесс по мере того, как вы узнаете больше об опыте пользователей и общих проблемах, с которыми они сталкиваются при использовании Интернета.