Оптимизация картинок с помощью тегов «alt» и «title»

О важности использования тегов «alt» и «title» для оптимизации поиска по картинкам написано немало и пренебрегать ими не стоит. Если кратко, то использование данных тегов позволит увеличить трафик за счёт поиска по картинкам. Если Вы вводите поисковик какое-то поисковое слово, то чаще всего среди результатов поиска будут и картинки. Вот пример:

пример оптимизации поиска по картинкам

Кликнув по такой картинке посетитель попадёт прямо на сайт.  Как же этого добиться?

Оптимизация сайта обязательно должна включать прописывание для каждого изображения тегов «alt» и «title». В html-коде эти теги для картинки изображающей Арнольда Шварценеггера выглядят так:

< img title="Арнольд Шварценеггер" src="http://z-force.info/arnold.jpg" alt="Шварценеггер" / >

 А вот собственно и он:

Шварценеггер

 Наведите на картинку курсор. Что вы видите? Правильно "Арнольд Шварценеггер". Вот сразу пример применения тега «title» . Разберём подробнее.

Рассмотрим как на wordpress блоге добавлять такие теги к картинкам. Итак, мы стандартным способом через админпанель загружаем изображения. Важно сразу, не откладывая прописать заголовок и описание картинки. Смотрим на рисунок. Для удобства я каждое поле пронумеровал.

редактирование медиафайлов в wordpress

1. Теги «title» - это названия ваших изображений. Автоматически  wordpress  вписывает туда название закачанного файла. Данный текст становится видимым на веб-сайте лишь при наведении курсора на картинки. Прописываем.

2. Тег или атрибут «alt» служит для отображения текста (“alternative text”) вместо картинки. Это её словесное описание. Данный текст на веб-сайте не виден. Его можно увидеть в двух случаях. Если из соображений экономии трафика в браузере отключено отображение картинок. Тогда на месте изображений будут пустые квадраты с текстом. И в случае использования  специализированного ПО для незрячих, выполняющих навигацию в Интернет по звуковым сигналам. Прописываем. Важное замечание. Для правильного восприятия поисковыми машинами, теги alt и title должны быть разными.

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

Шварценеггер

Голливудская кинозвезда

4. Description. Описание. Это  информация, которая прикрепляется к изображению и поясняет что  же на нём. Эта информация влияет на ранжирование картинки в Яндекс картинках и Google картинках. Однако информация из этого поля не попадает в исходный html код статьи, в чём легко убедиться просмотрев её в HTML-редакторе. Увидеть данный текст можно только кликнув по картинке и перейдя по адресу вида httр://ВАШ САЙТ/?attachment_id=3923.

Важно сразу при загрузке прописать теги   «alt» и «title», потому что потом придётся добавлять их вручную уже в тексте записи. А если Вы одно и то же  изображение вставляли несколько раз, то и работы прибавится.

Удачи!

Один комментарий к “Оптимизация картинок с помощью тегов «alt» и «title»”

Оставьте ответ

Ваш Email не будет опубликован. Обязательные поля отмечены*