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

Продвижение картинками

Не все картинки одинаково оптимизированы для продвижения

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

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

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

Рассмотрим требования к поисковой оптимизации картинок. Речь идет именно о поисковой оптимизации, а не о том, чтобы фотография сохранила при публикации резкость, цвет и при этом приемлемо “весила”.

Продвигаются только картинки в IMG

В целях продвижения картинками изображение на веб-странице должно быть представлено тэгом <IMG>. Другие варианты (CSS, JavaScript) просто не проиндексируются. Тэг IMG выглядит примерно так:

<IMG SRC=”путь к картинке” ALT=”Поясняющий текст” TITLE=”Заголовок изображения”>

У тэга <IMG> есть и еще атрибуты, но для SEO-оптимизации нам важны ALT и TITLE.

ALT и TITLE картинки

В стародавние времена не все браузеры умели отображать картинки, а те, которые не умели, выводили альтернативный текст, заданный в тэге ALT, например: “а вот если бы ваш браузер отображал картинки, вы бы увидели, какая замечательная девушка запечатлена на этой фотографии…”

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

Содержимое тэга <TITLE> пользователь может увидеть, проведя мышкой над картинкой. Да, это и есть та самая всплывающая подсказка.

Естественно, в ALT мы заносим текст, содержащий ключевые слова, под которые оптимизирована статья. Желательно не просто слова, а в составе фразы (всё должно быть естественно :) ).  TITLE для поисковиков менее значим, но и там желательно использовать ключевое слово в составе фразы. Значения TITLE и ALT не должны совпадать, иначе поисковик сочтет это ненужным дублированием. Понятное дело, что забивать в оба параметра килограмм текст не следует. Можно взять за ориентир, чтобы было одно предложение.

При вставке изображения в WordPress нам предлагается заполнить текстом следующие поля:

Поля для информации, необходимой для seo-оптимизации продвигаемой картинки

Для правильного продвижения картинки заполняйте все поля при вставке. “Заголовок” – TITLE, “Текст” – ALT, “Подпись” – текст рядом с картинкой. Заголовок на примере и имя файла заданы неправильно, имейте в виду, потому и отмечены красным. :)

Наряду с ALT и TITLE можно использовать атрибут LONGDESC. Я его почему-то никогда не использовал (надо, кстати, задуматься, почему это…), поэтому ничего про него говорить не буду. Разведайте сами.

Имя файла продвигаемой картинки

Кроме того, у картинки есть имя файла. Фотоаппараты обожают называть фотографии примерно так: P012782012. Так не пойдет. Имя файла должно иметь отношение к ключевому слову или его синониму, кириллицей или в транслите. Допустим, для этой статьи: prodvijenie-kartinkami-1.jpg. Если картинка не ваша, а добыта (не)честным путем с другого сайта, переименуйте ее (и не говорите, что я вам это посоветовал :) ).

Еще об уникальности картинки

Кстати говоря, при уменьшении изображения меняется его контрастность, а значит для поисковика картинка становится другой. То же самое с обрезкой картинки. Это способ сделать из копии в некоторой степени уникальное (для поисковика) изображение.

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

Уникальность – это важно. Именно уникальность больше всего ценят поисковики. В интернет существуют специальные сервисы, помогающие проверить уникальность картинки. Например: http://www.tineye.com. Кстати говоря, картинка, использованная мной в самом начале статьи, нашлась еще на двух сайтах. Думаю, в масштабах интернет это не много.

Формат и размер картинки

Размер изображения не должен быть слишком большим или слишком маленьким. Нормальные размеры: 640х480, 800х600, 1024х768… Слишком маленькая картинка покажется поисковику элементом графического оформления сайта, а со слишком большими он не станет связываться из лени. :)

Кстати говоря, формат файла тоже важен. Фотографии поисковикам привычнее видеть в формате jpg, а другую графику – в gif, png (но тут по разным источникам есть разночтения, так что, думаю, можно использовать jpg везде где можно). Маленькое изображение формате gif точно будет принято за элемент дизайна сайта.

Окружающий картинку текст

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

<p>Связный текст, содержащий  ключевые слова в разных словоформах. Связный текст, содержащий  ключевые слова. Связный текст, содержащий  ключевые слова. Связный текст, содержащий  ключевые слова. Связный текст, содержащий  ключевые слова.

<IMG SRC=”…kluchevoe-slovo.jpg” ALT=”Вот так выглядит схематично процесс трампампам ключевого слова при условиях других трампампам ключевых слов” TITLE=”Устройство (внимание, ключевые слова) самогонного аппарата (щелкните для увеличения)”>

Связный текст, содержащий  ключевые слова. Связный текст, содержащий  ключевые слова, но выглядящий при этом естественно.

</p>

На примере вставки картинки обтекающим текстом может служить и “Подпись”.

Оптимизация страницы с картинкой

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

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

Возможен вариант, когда картинка лежит не на вашем, а на более весомом сайте, но URL к ней все равно прописан в IMG на странице вашего сайта. ALT и TITLE тоже должны быть прописаны.

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

Еще чуть-чуть…

И совсем последнее. Блог с картинками интереснее блога без картинок. :) Все крутые блоггеры вставляю в посты картинки на тему. Потому они и крутые. Картинка поможет посетителю лучше запомнить и пост, и блог. Только не переусердствуйте. А если картинка ворованная и присутствует в интернет на каждом пятом сайте, но вы очень хотите использовать ее в данной статье, лучше вообще закрыть ее от индексации.

Кажется, всё. Вопросы – в комменты.

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

С уважением, Оружейник

Ваша оценка статьи:

Ух ты! А тут еще есть:

Комментариев: 30

  1. хорошая статья а главное вовремя спасибо

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

    • Когда вставляешь рисунок, заполняешь поля:
      «Заголовок» – то, что вылезет пользователю, когда он наведет мышку на картинку. Поисковик тоже это учтет.
      «Текст» – то, по чему поисковик судит о содержимом картинки. Пользователю обычно не видно.
      «Подпись» – текст под картинкой. Видно и пользователю, и поисковику.
      Всё это заполняем русскими буквами, если сайт рассчитан на русскоязычную аудиторию. Насчет имени файла – вроде как можно и кириллицей, но я обычно транслитом.
      В этих полях везде желательно употребить ключевые для этой страницы и картинки слова. Но стараемся дать естественный текст (а не просто набор слов через запятую). Как выбирать ключевые слова – это отдельный разговор, я об этом позже напишу.

  3. да забыл и какими буквами писать нашими или импортными ещё раз спасибо

  4. и последние я не могу загрузить фото приходится делать сканы он мне пишет что размер файла превышает для данного сайта спасибо

  5. Спасибо, в новой статье сделаю все как надо.

  6. Про картинки рассказано очень хорошо. С нетерпением жду хороших слов про ключевые слова. Я так понимаю, что “ключевые слова” это своего рода боеприпасы, а идти в атаку с незаряженным оружием недопустимое безрассудство. Во-Ору-Жить-С-Я-Бы

  7. Очень полезная информация, буду применять. Спасибо!

  8. Спасибо за ценную информацию! Теперь понятно, как надо поступать с картинками :-) .

  9. Ой, Спасибо огромное, Алексей!, А прошлась по комментам, еще больше ума набралась! Буду исправляться!

  10. алексей спасибо вам за созданный ресурс он очень полезен и информативен продолжайте в том же духе

  11. Отличная м полезная статья. Спасибо за информацию.
    Отдельное спасибо – за видеоролик: действительно, передохнул.
    Успехов Вам!

  12. Спасибо, большое Алексей! С оптимизированной картинкой мой сайт, наконец, заметил Google. Классно.
    Еще я хотела обратиться к Вам с вопросом: у меня такая проблема с комментариями на сайте: в консоли выбираю “комментарии”, отвечаю конкретно на каждый комментарий (выбираю “ответить”), но мои ответы потом размещаются все подряд, списком, в конце, после всех комментов, которые уже есть. Получается непонятно, – с кем же именно я разговариваю. Можно сделать так, чтобы мой коммент появлялся там, где надо: вставлялся после того комментария, на который я им ответила. Помогите, пожалуйста, если можно! Тема у меня стоит florange.

    • Честно говоря, не знаю, Татьяна. В инете тоже ничего нашлось. Я лично, чтобы видеть диалог в целом, перехожу на страницу записи (ссылка справа от комментария в списке) и там отвечаю. Но согласен, что это слегка неудобно.

      • Спасибо большое за рекомендацию, на самом деле мне показалось удобнее отвечать на странице записи, потому что там как раз виден диалог. Но, к сожалению, все равно комментарии “сносятся” в самый конец списка. Наверно, это свойство самой темы florang.

  13. Доброго времени суток, Алексей! Не будете ли Вы так любезны в одной из своих ближайших статей рассказать подробнее о ключевых словах, которые должны использоваться в текстах статей при написании контента? Спасибо.

  14. Я тоже начал обучение в Start-Up, смотрю что и как получилось у людей прошедших курс, да и у новичков просматриваю. Удачи в развитии !
    Заходите в гости на http://kazan-banket.ru

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

  16. Наташа:

    Спасибо за статью, буду пробовать по другому, а то я всегда тайтл и альт прописывала одинаковыми, и в основном – просто ключевая фраза…

Добавить комментарий

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

*

Пожалуйста, скопируйте этот пароль:

И вставьте его сюда (антиспам):

Кстати...

А у тебя есть бесплатная подписка на "Вестник Оружейной"?


Я буду рассказывать тебе
обо всех новостях.

Или так:

Твой e-mail: