Как сделать сайт доступным для каждого


Как сделать доступный сайт

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

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

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



Что такое доступный сайт

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


  • Люди с ограниченными возможностями зрения

  • Люди с ограниченными возможностями слуха

  • Люди с ограниченными двигательными способностями

  • Люди с ограниченными когнитивными способностями

  • Люди с временными ограничениями


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



Мастер специальных возможностей Wix


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

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

Таким решением стал Мастер специальных возможностей — инструмент, который позволяет сделать сайт более доступным прямо в редакторе Wix. Объясняем принцип его работы.



1. Автоматическое сканирование

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


Пример работы Мастера специальных возможностей Wix: автоматическое сканирование


2. Практические решения


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

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

Практические решения Мастера специальных возможностей Wix


3. Продвинутые настройки

Для еще более тщательной настройки доступности сайта изучите следующие функции:


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


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


Инструменты разработчика для специальных возможностей. Здесь вы можете сделать более доступными приложения и компоненты, которые вы создаете в Velo, а также настроить метки ARIA и tabindex.

Как использовать Мастер специальных возможностей


1. Перейдите в редактор Wix

2. В верхнем меню нажмите «Настройки»

3. Выберите «Мастер спецвозможностей»

4. Нажмите «Сканировать сайт» Подробная инструкция здесь.


Почему важно сделать сайт доступным


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

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

Позитивное восприятие бренда


Доступный сайт показывает, что вы заботитесь о своих посетителях,улучшает пользовательский опыт и повышает уровень вовлеченности.



Соответствие требованиям закона


В России пользователей с ограниченными возможностями защищает сразу несколько законов: ФЗ №419-ФЗ, ФЗ №8-ФЗ и приказ Министерства связи и массовых коммуникаций России №483. Согласно им, отсутствие на сайте версии для слепых и слабовидящих — это дискриминация по признаку инвалидности. Создание доступного сайта помогает избежать штрафа или даже административной и уголовной ответственности.

Что ждет доступные сайты в будущем?


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

Если у вас есть идеи, как сделать сайт доступным для людей с ограниченными возможностями еще лучше, мы будем рады их услышать. Напишите нам на accessibility@wix.com.



Сергей Букринский

Контент-менеджер Wix.



ru03n.png