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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Стратегия конверсии № 2 – Контактные формы

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

Конвертируйте потенциальных клиентов с помощью страницы финансового CTA

Высококачественная страница финансового CTA с уникальным предложением может помо
Показать полностью...

Wordpress это сложно, быстро и эффективно (пост для программистов)

Многие «знающие программисты» говорят о том, что wordpress это просто, эта систе
Показать полностью...

Подготовка к капитальному ремонту веб-сайта

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

ЧТО ЕСЛИ САЙТ НЕ БУДЕТ ДАВАТЬ РЕЗУЛЬТАТ?

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

Веб-сайты для ИТ-компаний

Лилли Гаремани, веб-стратег компании Webresult, делится полезными советами о том
Показать полностью...