База знаний

Атрибуты картинок Alt и Title

Атрибуты картинок Alt и Title

При добавлении картинки в HTML-код сайта существует возможность указать дополнительные атрибуты для нее, а именно Alt и Title. Во многих CMS функция заполнения атрибутов к картинкам реализована в интерфейсе редактора изображений. В HTML-коде это выглядит так:

<img src="Путь-к-картинке" alt="Текст-1" title="Текст-2" />

Атрибут Alt

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

Атрибут Alt у картинки оказывает прямое влияние на SEO — помогает поисковику понять, что изображено на фото. Т.е. правильное заполнение Alt-атрибутов для фотографий поможет им лучше ранжироваться при поиске по картинкам.

Правила заполнения Alt:

  1. Текст Alt должен кратко и правильно описывать содержание картинки
  2. Состоять из 3–5 слов, но не больше 250 символов
  3. Может содержать ключевой запрос, если он соответствует картинке
  4. Не должен быть спамным (перечисление ключевых слов в Alt ничего не даст с точки зрения SEO)

Атрибут Title

Title — данный атрибут дает дополнительную информацию пользователю о картинке, при наведении курсора на нее.

Атрибут Title не оказывает прямого влияния на SEO, но может быть полезен для пользователей, т.к. улучшает удобство пользования сайтом (влияет на поведенческий фактор).

Правила заполнения Title:

  1. Содержит поясняющую информацию о картинке
  2. Ограничений по длине нет, но слишком длинный текст может быть неудобным пользователям для восприятия
  3. Содержание ключевого запроса не окажет прямого влияния на SEO, но будет полезным для лучшего ориентирования пользователя на сайте
  4. Важно помнить, что Title у картинок отображаются только в десктопной версии сайта и при условии наведения курсора на картинку. Т.е. важную информацию не стоит размещать в Title — ее следует разместить рядом в описании картинки, которое видно пользователю постоянно

Description (Caption) для картинок

Description или Caption — описание картинки. Не является HTML-атрибутом для картинки, т.к. это текстовое поле, которое реализовано в интерфейсе редакторов изображений во многих CMS и содержимое которого выводится рядом с изображением на страницах сайта.

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

Данное поле может называться по-разному, например в CMS WordPress для ввода описания изображений есть 2 поля: Caption и Description. Отличие состоит в том, что Caption выводится на странице, где расположена картинка, а Description выводится как содержание страницы вложения картинки.

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

  • Alt — атрибут, который в большинстве случаев не виден пользователю, но влияет SEO;
  • Title — атрибут, который в некоторых случаях виден пользователю и косвенно влияет на SEO;
  • Description — поле, содержимое которого всегда видно пользователю и прямо влияет на SEO, т.к. является частью контента.