1. Главная
  2. Блог
  3. Альтернативный текст изображения и Доступность в Интернете

Альтернативный текст изображения и Доступность в Интернете

Альтернативный текст изображения и Доступность в Интернете
Автор
Анатолий Ахматов
На чтение
1:49 мин
Обновлено
06.08.2021

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

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

Что такое альтернативный текст изображения?

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

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

Почему важен Альтернативный текст?

Понимание и добавление альтернативного текста к изображениям на вашем веб-сайте так важно по нескольким причинам:

  • Изображения широко используются на всех веб-сайтах, поэтому они могут стать серьезным препятствием, когда они недоступны.
  • Добавление альтернативного текста к изображениям является требованием WCAG 2.1. WCAG расшифровывается как Руководство по обеспечению доступности веб-контента и считается глобальным правовым стандартом для обеспечения доступности веб-контента.
  • Неспособность предоставить альтернативный текст на изображениях является наиболее распространенной причиной для подачи иска ADA против предприятий за недоступные веб-сайты

Как Вы Пишете Хороший Альтернативный Текст?

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

Инициатива веб-доступности W3C предоставляет один из лучших ресурсов по написанию альтернативного текста здесь: https://www.w3.org/WAI/tutorials/images/

Вот несколько рекомендаций для распространенных типов изображений на вашем сайте:

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

В дополнение к рассмотрению роли изображения на веб-сайте, вот несколько советов по написанию точного альтернативного текста:

  • Опишите изображение как можно более конкретно
  • Держите его относительно коротким. (Большинство программ для чтения с экрана отсекают альтернативный текст после 125 символов)
  • Не включайте “изображение” или “изображение” в свой текст alt.
  • Избегайте вставлять ключевые слова в свой альтернативный текст

Как добавить альтернативный текст в WordPress?

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

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

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

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

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

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

Также может понравится

Как Видео Может Повлиять На Скорость Сайта

Соблюдаете ли вы рекомендации при добавлении видео на свой сайт? Наш владелец Ми
Показать полностью...

Мусор на входе, мусор на выходе – влияние качества данных на анализ данных

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

Приводите к конверсии, понимая Намерения Посетителей

Стимулируйте конверсию, понимая намерения посетителей. Создайте свой веб-сайт та
Показать полностью...

15 интеграций mailchimp, которые опытные пользователи рекомендуют больше всего

Мы подключили несколько десятков пользователей MailChimp, чтобы они поделились с
Показать полностью...

Как использовать Страницы благодарности для отслеживания

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