Как правильно заполнять атрибуты ALT и TITLE для картинок?

В личном общении с заказчиками и коллегами по цеху я часто слышу вопрос: «Что бы еще такого сделать для оптимизации сайта, чтобы продвинуть его повыше в поисковой выдаче?». Вопрос, конечно, интересный, да и отвечать на него, казалось бы, должен сео-оптимизатор. Однако есть некоторые вещи, которые контент-менеджер может (и должен) делать без подсказок сеошников.

Скажите, для чего вы используете картинки на страницах ресурса? Привлечь внимание, удержать интерес, украсить статью? Все верно! Но эти же картинки могут использоваться и для поисковой оптимизации сайта. Главное, нужно внимательно прописать атрибуты ALT и TITLE для каждого значимого изображения.

По статистике, этот простой ход использует только 30% сайтовладельцев. А кто нам мешает воспользоваться ситуацией и на шаг опередить сразу две трети конкурентов?

Для начала давайте познакомимся с «неведомыми зверушками»

ALT и TITLE часто называют тегами, но это неверно. На самом деле это атрибуты тега <img>.

Атрибут ALT

ALT обозначает «alternative text» («альтернативный текст»). По сути, это краткое описание картинки. Вы же понимаете, что поисковые системы не видят изображений, а распознают их именно по такому альтернативному тексту. ALT помогает поисковым роботам правильно «понять» и проиндексировать картинку.

Обратите внимание, что ALT является обязательным элементом для всех изображений! Его отсутствие при валидации расценивается, как ошибка кода.

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

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

И теперь главный вопрос.

Как правильно прописать атрибут ALT?

В некоторых CMS для прописывания атрибута нужно лишь заполнить соответствующее поле, которое может называться ALT или «Альтернативный текст». Но если вы пишете HTML-код вручную (честно, порой, это проще, чем искать окошко для атрибута в настройках), то строка будет выглядеть примерно так:

<img src=”scopywriter.ru/wp-content/kot.jpg” alt=” Кот донской сфинкс ”>

Что же касается непосредственно написания текста для этого атрибута, то есть несколько простых правил:

1. Текст должен правдиво описывать картинку.
2. Оптимальный объем – словосочетание из 2-4 слов или такое же короткое предложение. Хорошо, если это будут разбавленные и дополненные ключевые слова.
3. Картинки на одной странице должны иметь разный ALT. Если вы используете в атрибуте одни и те же ключевые слова для всех изображений, то это отрицательно скажется на ранжировании сайта в выдаче.
4. Не заполняйте ALT для смайликов и маленьких декоративных рисунков.

Некоторые браузеры не поддерживают атрибут ALT (например, текстовый Lynx). И тогда уж точно не обойтись без атрибута TITLE.

Атрибут TITLE

С английского слово TITLE переводится как «заголовок» - собственно, это и есть основная функция данного атрибута. Если навести курсор на изображение, размещенное на сайте, то всплывает надпись – название рисунка. Это означает, что атрибут TITLE прописан.

Считается, что TITLE можно не заполнять – мол, у поисковых систем требований по этому поводу нет. Однако опытные сеошники настоятельно советуют прописывать этот атрибут.

Как и в случае с ALT, необходимо просто заполнить поле с надписью TITLE в настройках рисунка или прописать HTML-код. Например:

<img src=”http://www. scopywriter.ru/wp-content/kot.jpg ” alt=”Кот донской сфинкс” title=”Донской сфинкс на кресле”>

Вы заметили, что тексты для атрибутов ALT и TITLE отличаются между собой? Это обязательное правило: они никогда не должны совпадать для одной картинки!

Вот ещё несколько рекомендаций касательно текста для TITLE:

1. Соответствие картинки и подписи – обязательны.
2. Сделайте TITLE чуть более развернутым, чем ALT. Лучше всего – короткое предложение с участием ключевых слов.
3. Не используйте пустые эмоциональные слова или метафоры. Например, писать TITLE «Какое чудо!» не имеет никакого смысла. Пусть это будет банальная фраза типа «Красивый ребенок с соской», зато подпись соответствует картинке (требование пункта 1).

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

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

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

А вы прописываете атрибуты ALT и TITLE картинкам?

Автор: Наталья Нестеренко, источник: http://www.scopywriter.ru/kak-pravilno-zapolnyat-atributy-alt-i-title-dlya-kartinok/

 

@Lana, спасибо! Знала об этом, но некоторые моменты открыла сегодня благодаря Вам.

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