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

  1. Визуальная
  2. Слуховая
  3. Кинестетическая
  4. Дигитальная (логическая)

Не зря визуальную систему ставят на первое место. По статистике 35% пользователей интернета используют визуальный канал, как основной для получения информации. Этим как раз и объясняется популярность Инстаграмм, инфографики и различных графических форматов подачи материала.

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

Что такое атрибут alt?

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

Видимость картинки в браузере пользователя с атрибутом alt

Зачем заполнять атрибут alt?

Поисковые системы Яндекс и Google индексирует не только текст, но и рисунки. Изображения — это один из источников дополнительного трафика на сайтЧтобы в результатах поиска показывать изображения, релевантные запросу пользователя, поисковые системы ориентируются на теги к рисункам. В тегах как раз и написано, что представлено на рисунках.

Более того, как пишет Яндекс: «Картинки, у которых отсутствуют содержательные описания, не попадают в поиск, так как не могут быть найдены по запросам».

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

Можно также почитать:  Как убрать копирайт темы Extra в футере

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

Атрибут alt дает понять, что изображено на картинке, когда пользователь не может ее увидеть. При стандартных настройках браузера этот текст по мере загрузки замещается картинкой.

 Правила заполнения атрибута alt

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

  • Длина alt до 5–8 слов, но не более 75-80 символов 
  • Alt должен соответствовать содержимому изображения 
  • Желательно использовать ключевые слова, если они подходят по смыслу к изображению
  • Для каждого изображения  — свой alt. Если, к примеру, товар в магазине имеет несколько изображений в разных ракурсах, то можно прописать одинаковый alt с добавлением цифр alt1, alt2, alt3 
  • Не надо прописывать alt к изображениям фона и меню сайта
  • На одной странице не желательно использовать одни и те же атрибуты alt
  • Alt не должен состоять из одного ключевого слова или ключевой фразы 

Когда и как заполнять атрибут alt?

Рассмотрим когда и как заполнять атрибут alt на разных стадиях работы с изображениями.

1. ручное Заполнение атрибута alt при загрузке изображения в библиотеку медиафайлов

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

Как заполнить атрибут alt к рисунку?

При загрузке изображения в библиотеку медиафайлов необходимо вручную внести значения атрибута alt и title изображения

Можно также почитать:  Как убрать копирайт темы Extra в футере
Как вручную заполнить alt и title изображения

2. автоматическое Заполнение атрибута alt при загрузке изображения в библиотеку медиафайлов

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

Чтобы автоматизировать процесс запись атрибута alt надо в файл functions.php дочерней темы Divi прописать следующий код:

/**
 * Заполняет поле для атрибута alt на основе заголовка изображения  при его вставке в контент поста.
 *
 * @param array $response
 *
 * @return array
 */
 function change_empty_alt_to_title( $response ) {
 if ( ! $response['alt'] ) {
 $response['alt'] = sanitize_text_field( $response['title'] );
 }

return $response;
}

add_filter( ‘wp_prepare_attachment_for_js’, ‘change_empty_alt_to_title’ );

Сам код впервые был опубликован на сайте WordPress как на ладони.

Значение атрибута alt берется из поля title. В свою очередь поле title это название загружаемого изображения. Как назовешь изображение, такой и получишь alt.