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

Почему важна доступность HTML?

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

Кроме того, крайне важно разработать доступные веб-страницы как по юридическим, так и по этическим причинам. Во многих странах, включая США, существуют правила, требующие, чтобы веб-сайты были доступны для лиц с ограниченными возможностями. Например, веб-сайты должны быть доступны для лиц с ограниченными возможностями в соответствии с Законом об американцах-инвалидах (ADA).

Распространенные проблемы со специальными возможностями

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

  1. Слепота: у слепых людей могут возникнуть проблемы с чтением мелкого шрифта, различением цветов или навигацией по сложным макетам.
  2. Нарушения слуха. Чтобы понять аудиоконтент, люди с нарушениями слуха могут полагаться на скрытые субтитры или стенограммы.
  3. Двигательные нарушения. Людям с двигательными нарушениями может быть сложно получить доступ к веб-сайту с помощью мыши или клавиатуры.
  4. У людей с когнитивными нарушениями могут возникнуть проблемы с прохождением сложных макетов или пониманием сложного языка.

Как создать доступный веб-сайт (полное руководство)

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

1. Убедитесь, что ваша веб-страница поддерживает навигацию с помощью клавиатуры

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

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

2. Используйте цвета с высокой контрастностью

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

3. Предлагайте альтернативный текст для изображений

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

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

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

Вы можете упростить чтение информации, разделив ее на более мелкие фрагменты. По этой причине структурирование информации на ваших страницах с помощью заголовков и списков помогает улучшить доступность в Интернете. Четкие заголовки могут облегчить чтение и понимание ваших страниц программами чтения с экрана. Кроме того, это упрощает пользователям вспомогательных технологий просмотр содержимого вашей страницы и упрощает навигацию по странице. Совет WordPress следовать заранее определенной структуре заголовков, которая требует использования одного H1 на странице (обычно для заголовка) и H2 и H3 для подразделов.

5. Добавляйте стенограммы и подписи к видео

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

В WordPress 5.6 вы можете использовать функцию Web Video Test Track Format (WebVTT) для добавления титров и субтитров к видео WordPress. Просто добавьте видеоблок на свою страницу, а затем выберите кнопку «Текстовые дорожки» в горизонтальном меню навигации, чтобы получить к нему доступ.

Заключение

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