Альтернативный текст изображения и Доступность в Интернете
Доступность веб-сайта является таким важным фактором для владельцев веб-сайтов, потому что вы можете неосознанно создавать препятствия на своем сайте для людей с ограниченными возможностями.
Добавление альтернативного текста к изображениям вашего веб-сайта является важной частью веб-доступности и помогает пользователям с нарушениями зрения перемещаться по вашему сайту. Отсутствие альтернативного текста на изображениях также является распространенной жалобой в судебных процессах ADA. Хотя это может показаться техническим шагом, на самом деле добавить альтернативный текст в WordPress очень просто.
Что такое альтернативный текст изображения?
Альтернативный текст или “альтернативный текст” (также неправильно называемый “альтернативными тегами”) - это письменный текст, описывающий внешний вид и функции изображения на веб-странице.
Инструменты чтения с экрана полагаются на альтернативный текст для описания изображений на веб-сайте для слабовидящих посетителей. Вы также можете услышать термины “альтернативный текст” или “альтернативные теги”, упомянутые в связи с оптимизацией поисковой системы, но их основная цель-доступность в Интернете.
Почему важен Альтернативный текст?
Понимание и добавление альтернативного текста к изображениям на вашем веб-сайте так важно по нескольким причинам:
- Изображения широко используются на всех веб-сайтах, поэтому они могут стать серьезным препятствием, когда они недоступны.
- Добавление альтернативного текста к изображениям является требованием WCAG 2.1. WCAG расшифровывается как Руководство по обеспечению доступности веб-контента и считается глобальным правовым стандартом для обеспечения доступности веб-контента.
- Неспособность предоставить альтернативный текст на изображениях является наиболее распространенной причиной для подачи иска ADA против предприятий за недоступные веб-сайты
Как Вы Пишете Хороший Альтернативный Текст?
Ваш сайт состоит из различных типов изображений. Некоторые из них могут быть декоративными и графическими, в то время как другие передают важную информацию.
Инициатива веб-доступности W3C предоставляет один из лучших ресурсов по написанию альтернативного текста здесь: https://www.w3.org/WAI/tutorials/images/
Вот несколько рекомендаций для распространенных типов изображений на вашем сайте:
- Информативный: часто это изображения и иллюстрации, которые представляют информацию и добавляют контекст к сообщениям на странице. Для этих изображений текстовой альтернативой должно быть краткое описание изображения.
Например, стоковое изображение на странице сервиса или изображение товара в каталоге товаров.
- Функциональная: если изображение также является ссылкой, то текстовая альтернатива должна описывать функциональность ссылки, а не визуальное изображение.
Например, изображение, представляющее тематическое исследование или рекомендуемый продукт, который ссылается на определенную страницу.
- Декоративные: если единственной целью изображения является добавление визуального оформления на страницу и оно не передает никакой информации, вы можете пропустить альтернативный текст. Например, фоновое изображение геометрических фигур, используемое на панели на веб-странице.
В дополнение к рассмотрению роли изображения на веб-сайте, вот несколько советов по написанию точного альтернативного текста:
- Опишите изображение как можно более конкретно
- Держите его относительно коротким. (Большинство программ для чтения с экрана отсекают альтернативный текст после 125 символов)
- Не включайте “изображение” или “изображение” в свой текст alt.
- Избегайте вставлять ключевые слова в свой альтернативный текст
Как добавить альтернативный текст в WordPress?
Как система управления контентом, WordPress позволяет очень легко добавлять текст alt к каждому изображению.
Когда вы загружаете изображение в медиатеку, есть поле для ввода альтернативного текста для изображения (см. Ниже). WordPress недавно добавил ссылку на Инициативу веб-доступности руководство по альтернативному тексту это дает дополнительные советы по написанию хорошего альтернативного текста.
Если вы используете визуальный редактор или конструктор страниц и уже загрузили изображение и вставили его в сообщение, вы можете выбрать опцию редактирования и добавить альтернативный текст в интерфейсе редактирования изображений.
Когда вы загружаете изображение на свой сайт WordPress, вы заметите, что заголовок автоматически заполнится и примет имя файла изображения. Вы также можете отредактировать заголовок в этих областях.
Однако заголовок изображения не влияет на доступность в Интернете и не помогает в этом. Вам нужно будет ввести альтернативный текст для изображения, если оно не является исключительно декоративным.
Если у вас есть какие-либо вопросы по добавлению альтернативного текста к изображениям, не стесняйтесь обращаться к нашей команде.
