
Что поможет сделать ваш сайт более веб-доступным?
Основная цель создания сайта – это поделиться своим контентом со всем миром. Вы хотите, чтобы как можно больше людей могли получить доступ к вашему сайту и взаимодействовать с ним. То есть, нужно достичь максимальной доступности вашего веб-сайта для людей с самыми разными возможностями, чтобы они могли не только получать доступ к вашему контенту, но и взаимодействовать с ним. Проектирование сайтов с учетом веб-доступности гарантирует, что Интернет будет инклюзивным пространством, где у каждого будет возможность доступа к информации, общаться и участвовать в жизни общества.
Что подразумевается под вебдоступностью (Web accessibility, или eAccessibility)?
Для многих людей наличие доступа к Интернету и ко Всемирной паутине (WWW) не означает, что они могут воспользоваться всеми его преимуществами и/или получить полный доступ к контенту. Люди с определенными ограниченными возможностями (например, с нарушениями зрения) хотя и способны посещать веб-сайты, но могут столкнуться с некоторыми проблемами при обработке информации. И часто в таких случаях им могут помочь только дополнительные инструменты (например, программы считывания с экрана).
Проектирование сайта с соблюдением принципов доступности в веб-дизайне (вебдоступность) означает разработку своего веб-сайта таким образом, чтобы люди с различными возможностями могли не только заходить на ваш сайт, но и обрабатывать информацию на вашем сайте и взаимодействовать с его элементами, такими как меню (элементы навигации), ссылками, списками и т.д.
Современные инструменты, повышающие уровень веб-доступности сайта
Очень важно еще на этапе разработки сайта заложить возможность использования программных и аппаратных средств и служб, которые люди с ограниченными возможностями смогут использовать для лучшего взаимодействия с Интернетом и со Всемирной паутиной. Ниже вы найдете некоторые примеры используемых сегодня инструментов вебдоступности:
- Программы считывания с экрана: программные приложения, которые считывают отображаемый на экране текст (т.е., экранные дикторы). Они используются преимущественно незрячими или слабовидящими людьми (с нарушениями зрения), что позволяет им «слушать» текст с экрана девайсов.
- Преобразование текста в речь (TTS, Text to Speech): это программное обеспечение преобразует цифровой текст в разговорные слова, подобно программам считывания с экрана. Синтез речи используется не только людьми с нарушениями зрения, но и людьми с трудностями (расстройствами) в обучении (например, такими как дислексия).
- Программное обеспечение для распознавания речи (Voice to Text): оно позволяет пользователям произносить команды компьютера или диктовать текст. Такое ПО может быть полезно для людей с ограниченными возможностями передвижения или ловкости.
- ПО для увеличения экрана: позволяет увеличивать текст и графику на экране компьютера (или другого девайса), помогая пользователям с нарушениями зрения.
- Дисплей Брайля: это устройство может преобразовывать текст на экране в символы Брайля, которые можно читать на ощупь.
- Субтитры и субтитрование: эти технологии предоставляют текстовую версию аудио/видео, помогая людям с нарушениями слуха.
- Службы перевода жестового языка: переводчики ЖЯ позволяют переводить разговорный и письменный язык на жестовый язык.
- Службы транскрипции: данные сервисы могут превращать разговорный язык (с аудио/видео) в письменный текст (или текстовый документ), который может быть полезен людям с нарушениями слуха.
- Анализаторы цветового контраста: с помощью этих инструментов проще определить, достаточен ли контраст между текстом и фоном. Позволяют измерять и оценить контрастность цвета, что может быть полезно для пользователей с нарушениями цветового зрения (дальтонизм, цветовая слепота).
- Голосовые браузеры (Voice Browsers): с помощью этих приложений люди, которые в этом нуждаются, могут перемещаться по Интернету с помощью голосовых команд вместо клавиатуры или мыши.
- Настраиваемые интерфейсы: эти кастомизированные интерфейсы могут быть размещены на веб-сайтах и/или приложениях, которые хотят помочь пользователям реализовать потребность в настройке размера шрифта, цвета и других свойств отображения в соответствии с их потребностями.
Обратите внимание, что этот список инструментов не является конечным, ведь постоянно появляется новое обеспечение, которое помогает людям в доступе в Интернет и во Всемирную паутину. Эти инструменты важны для обеспечения того, чтобы Интернет оставался инклюзивным пространством. Большинство современных ОС (операционных систем) и веб-браузеров уже имеют встроенные функции доступности, которые можно включить или настроить в соответствии с индивидуальными потребностями.
Как с помощью программного кода можно повысить веб-доступность?
Важно знать об инструментах доступности. Также, когда вы создаете (проектируете) сайт, важно учесть и создать доступный веб-интерфейс для людей с визуальными или информационными особенностями. В случае программного кода это означает продуманное использование элементов HTML.
Давайте рассмотрим некоторые примеры HTML кода, элементы и атрибуты, которые могут улучшить веб-доступность:
- Заголовки: продуманное использование тегов заголовков (
<h1>
—<h6>
) создает иерархию контента, которая помогает программам считывания с экрана лучше ориентироваться в контенте вашей веб-страницы. - Тег
<strong>
указывает на то, что текст внутри этого тэга имеет высокую важность. Использование тегаstrong
указывает программе считывания с экрана выделить этот текст и сделать на нем акцент. Напротив, тег<b>
только визуально форматирует текст. - Тег
<em>
указывает на то, что текст внутри этого тега следует выделить с большей экспрессивностью. Использование тега<em>
указывает программе считывания с экрана выделить этот текст с большей эмоциональностью (с эмфатическим ударением). Напротив, тег<i>
только визуально форматирует данный текст. - Элементы списка: продуманное использование тегов упорядоченного (нумерованного) списка (
<ol>
) и неупорядоченного (маркированного, ненумерованного) списка (<ul>
) для структурированного представления информации об определенном списке чего-либо, а также тегов списка описания (<dl>
,<dt>
и<dd>
) для терминов и описаний помогает программам считывания с экрана в навигации по контенту вашей веб-страницы. - Атрибут
title
в HTML используется для предоставления дополнительной информации об элементе, которая отображается как всплывающая подсказка, когда мышь наводится на этот элемент. - Атрибут
lang
используется в теге<html>
для обозначения основного языка веб-страницы. Его также можно использовать в других тегах для обозначения мест сайта, где используется другой язык (например, параграф на иностранном языке). - Атрибут
alt
для изображений (тег<img>
) предоставляет альтернативный текст, который могут читать программы считывания с экрана, а также отображаться на странице, когда изображение будет недоступно (не загрузится).
Здесь я навел пример наиболее часто используемых элементов HTML, которые сделают ваш сайт более веб-доступным. Обратите внимание, что для этой цели постоянно появляются новые элементы и инструменты, поэтому вам нужно «держать руку на пульсе», чтобы постоянно быть в курсе дела.
А на сегодня я благодарю вас за внимание!