Что поможет сделать ваш сайт более веб-доступным?

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

 

Что подразумевается под вебдоступностью (Web accessibility, или eAccessibility)?

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

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

 

Современные инструменты, повышающие уровень веб-доступности сайта

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

• Программы считывания с экрана: программные приложения, которые считывают отображаемый на экране текст (т.е., экранные дикторы). Они используются преимущественно незрячими или слабовидящими людьми (с нарушениями зрения), что позволяет им «слушать» текст с экрана девайсов.
• Преобразование текста в речь (TTS, Text to Speech): это программное обеспечение преобразует цифровой текст в разговорные слова, подобно программам считывания с экрана. Синтез речи используется не только людьми с нарушениями зрения, но и людьми с трудностями (расстройствами) в обучении (например, такими как дислексия).
• Программное обеспечение для распознавания речи (Voice to Text): оно позволяет пользователям произносить команды компьютера или диктовать текст. Такое ПО может быть полезно для людей с ограниченными возможностями передвижения или ловкости.
• ПО для увеличения экрана: позволяет увеличивать текст и графику на экране компьютера (или другого девайса), помогая пользователям с нарушениями зрения.
• Дисплей Брайля: это устройство может преобразовывать текст на экране в символы Брайля, которые можно читать на ощупь.
• Субтитры и субтитрование: эти технологии предоставляют текстовую версию аудио/видео, помогая людям с нарушениями слуха.
• Службы перевода жестового языка: переводчики ЖЯ позволяют переводить разговорный и письменный язык на жестовый язык.
• Службы транскрипции: данные сервисы могут превращать разговорный язык (с аудио/видео) в письменный текст (или текстовый документ), который может быть полезен людям с нарушениями слуха.
• Анализаторы цветового контраста: с помощью этих инструментов проще определить, достаточен ли контраст между текстом и фоном. Позволяют измерять и оценить контрастность цвета, что может быть полезно для пользователей с нарушениями цветового зрения (дальтонизм, цветовая слепота).
• Голосовые браузеры (Voice Browsers): с помощью этих приложений люди, которые в этом нуждаются, могут перемещаться по Интернету с помощью голосовых команд вместо клавиатуры или мыши.
• Настраиваемые интерфейсы: эти кастомизированные интерфейсы могут быть размещены на веб-сайтах и/или приложениях, которые хотят помочь пользователям реализовать потребность в настройке размера шрифта, цвета и других свойств отображения в соответствии с их потребностями.

 

Обратите внимание, что этот список инструментов не является конечным, ведь постоянно появляется новое обеспечение, которое помогает людям в доступе в Интернет и во Всемирную паутину. Эти инструменты важны для обеспечения того, чтобы Интернет оставался инклюзивным пространством. Большинство современных ОС (операционных систем) и веб-браузеров уже имеют встроенные функции доступности, которые можно включить или настроить в соответствии с индивидуальными потребностями.

 

Как с помощью программного кода можно повысить веб-доступность?

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

Давайте рассмотрим некоторые примеры HTML кода, элементы и атрибуты, которые могут улучшить веб-доступность:

1. Заголовки: продуманное использование тегов заголовков (<h1> — <h6>) создает иерархию контента, которая помогает программам считывания с экрана лучше ориентироваться в контенте вашей веб-страницы.
2. Тег <strong> указывает на то, что текст внутри этого тэга имеет высокую важность. Использование тега strong указывает программе считывания с экрана выделить этот текст и сделать на нем акцент. Напротив, тег <b> только визуально форматирует текст.
3. Тег <em> указывает на то, что текст внутри этого тега следует выделить с большей экспрессивностью. Использование тега <em> указывает программе считывания с экрана выделить этот текст с большей эмоциональностью (с эмфатическим ударением). Напротив, тег <i> только визуально форматирует данный текст.
4. Элементы списка: продуманное использование тегов упорядоченного (нумерованного) списка (<ol>) и неупорядоченного (маркированного, ненумерованного) списка (<ul>) для структурированного представления информации об определенном списке чего-либо, а также тегов списка описания (<dl>, <dt> и <dd>) для терминов и описаний помогает программам считывания с экрана в навигации по контенту вашей веб-страницы.
5. Атрибут title в HTML используется для предоставления дополнительной информации об элементе, которая отображается как всплывающая подсказка, когда мышь наводится на этот элемент.
6. Атрибут lang используется в теге <html> для обозначения основного языка веб-страницы. Его также можно использовать в других тегах для обозначения мест сайта, где используется другой язык (например, параграф на иностранном языке).
7. Атрибут alt для изображений (тег <img>) предоставляет альтернативный текст, который могут читать программы считывания с экрана, а также отображаться на странице, когда изображение будет недоступно (не загрузится).

 

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

А на сегодня я благодарю вас за внимание!