Доступная среда в вебе. Как мы должны заботиться о других

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

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

Интернет — окно в мир. Он помогает людям открывать новое, получать доступ к невероятному количеству информационных ресурсов.

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

В этом разработчикам помогает Консорциум Всемирной паутины — организация, разрабатывающая и внедряющая единые принципы и стандарты для всего Интернета.

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

Основа доступности строится на четырёх пунктах: воспринимаемость, управляемость, понятность и надёжность.

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

Кратко разберём принципы.


Здесь использовано изображение, которое, по мнению автора, отражает понятие Воспринимаемость
Воспринимаемость

Первый Принцип: Воспринимаемость

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

Текстовая версия

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

Это правило расширяется следующим пунктом.

Медиаконтент

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

Адаптируемость

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

Старайтесь визуально отобразить структуру и взаимосвязи.

Не забывайте о последовательности чтения.

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

Избирательность

Упрощайте восприятие контента, отделяя важные части от второстепенных.

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


Здесь использовано изображение, которое, по мнению автора, отражает понятие Управляемость
Управляемость

Второй Принцип: Управляемость

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

Доступность управления с клавиатуры

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

Достаточное время

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

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

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

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

Не используйте элементы дизайна опасные для здоровья

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

Навигация

Помогите пользователям в навигации по сайту и поиске контента. Давайте возможность посетителю чётко понять его текущее положение на сайте.

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

«Хлебные крошки» очень помогут определить положение пользователя в структуре сайта.


Здесь использовано изображение, которое, по мнению автора, отражает понятие Понятность
Понятность

Третий Принцип: Понятность

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

Удобочитаемость

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

Помните про аббревиатуры.

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

Предсказуемость

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

Помощь при вводе

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

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


Здесь использовано изображение, которое, по мнению автора, отражает понятие Надёжность
Надёжность

Четвёртый Принцип: Надёжность

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


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

К тому же наше правительство подаёт отличный пример: с 1 января 2016 года государственные органы и органы местного самоуправления должны иметь версию сайта для слабовидящих.

Frontend разработчик mit
Дмитрий Ефремов

Дата: 23.01.2018

Поделитесь статьей со своими друзьями в социальных сетях.


Назад к списку статей