Наши книги

  • Как запустить таргетированную рекламу на VK.com?
  • Как сократить бюджет контекстной рекламы
  • Готов ли Ваш сайт к рекламе в Интернете?
  • Как запустить таргетированную рекламу на Facebook?

Последние записи в блоге

SEO-оптимизация изображений

Комментарии10 Августа 2017
 

Очень часто в процессе продвижения сайта картинкам уделяется мало внимания. И напрасно, ведь их оптимизация помогает повысить релевантность и поднять трафик с сервисов Яндекс и Гугл Картинки. Безусловно, речь идет об уникальном контенте, чужие фото вряд ли дадут хороший эффект, а вот наказать за их использование вас могут легко. Если своих у вас нет, можно купить их в фотобанке и обязательно поставить водяной знак – логотип своей компании, он не должен закрывать важные места, но и вырезать или затереть его должно быть сложно – так вы обезопасите себя от воровства.

seo оптимизация картинок

Cео-оптимизация картинок поэтапно

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

Пара слов о формате – используйте jpg или png. Другие – более тяжеловесны и не всегда корректно отображаются. Анимированные картинки часто определяются как баннеры или элементы верстки.

Теперь зададим размер изображения. Оно не должно быть меньше 150 пикселей. Крупные изображения должны отображаться в превью и открываться в отдельном окне. При помощи стилей такие картинки уменьшать не стоит, иначе замедлится скорость загрузки сайта. Маленькая хитрость: загружайте на сайт немного сжатые изображения, и если их у вас украдут, то вы сможете выложить оригинал. Таким образом, для поисковых систем станет ясно, у кого больше прав на картинку.

Далее нужно прописать название картинки. Оно должно быть понятным и отображать суть изображения: например, не «99458754DSCIM», а «optimizacija-izobrazhenij» - обязательно транслитом. Впоследствии из этого названия формируется ссылка на картинку.

На сайте нужно заполнить атрибуты alt и title тэга img (русским текстом). Альтернативный текст (alt) должен быть понятным и содержать вхождение ключевого слова. Он не должен быть слишком длинным – 3-8 слов вполне достаточно. Alt нужно заполнять обязательно, по нему поисковые системы распознают, что изображено на картинке. А в title можно добавить дополнительное описание для картинки, оно не должно совпадать с содержимым alt, но частично включать в себя слова из этого атрибута. Также можно заполнить Description изображения, но если данные тэг уже заполнен для страницы, то можно это не делать.

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

Если времени в обрез – сделайте подпись для людей на 150-200 зн., тогда поисковый робот сможет использовать её. Это, конечно, не то, но лучше чем ничего.

Роботу поможет найти ваши картинки атрибуты «HEIGHT» и «WIDTH» (высота и ширина), поскольку в сервисах картинок пользователи могут искать информацию по этим параметрам.

Маленькая хитрость: расположите картинки рядом с заголовками h1-h6 – поисковые системы придают им больше веса.

В итоге получится так:

<img title="как сделать SEO-оптимизацию картинок пошагово" src="http://site.ru/optimizacia-kartinok.jpg" alt="SEO оптимизация картинок" width="ширина в пикселях" height="высота в пикселях" />

Оптимизация картинок для улучшения скорости загрузки

Теперь поговорим о технической оптимизации изображений, что не менее важно для СЕО.

  • Очевидно, что большие картинки «утяжеляют» сайт и он будет долго грузиться. Чтобы понять, сколько у вас на странице картинок, требующих сжатия, воспользуйтесь Google Pagespeed Insights:

скорость загрузки картинок

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

  • Старайтесь не использовать формат gif и заменять его на png. А png, в свою очередь, можно сжать при помощи различных онлайн-сервисов, которые вы легко сможете найти сами. Большие изображения следует перевести в jpg и тоже сжать с максимальным сохранением качества.

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

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

  • Вместо того чтобы использовать масштабирование (когда для большой картинки в административной панели сайта задается намного меньший размер), загружайте сразу небольшие и средние фото.
  • При работе в Фотошопе у вас может сохраниться ненужная информация в слоях. И там, где с виду прозрачно, на самом деле может быть занято и объем изображения от этого увеличится. Перед добавлением на сайт проверьте картинку и удалите лишнее.
  • Также советуем уменьшить количество изображений. Это не значит, что нужно удалить картинки, просто скомпонуйте несколько картинок в одну. Что это дает, ведь суммарный объем остается таким же? Да, но при загрузке каждого изображения поступает запрос к серверу и на его обработку уходит некоторое время. Когда картинка одна – получается быстрее.

При выполнении всех этих рекомендаций вам помогут различные онлайн-сервисы и программы, в них несложно будет разобраться даже новичку. В общем, ничего сложного, только придется потратить время, но это того стоит – в результате страницы будут грузиться быстро, и вы получите дополнительный трафик с Яндекс и Гугл Картинок.

Читайте также

 

Как составить семантическое ядро сайта?

Построение семантического ядра для SEO-продвижения – советы новичкам. Разбираем типичные ошибки при подборе запросов, рассказываем секреты составления ядра сайта.

12 ошибок заказчиков сайта на этапах разработки и эксплуатации

Статья подойдет не только для тех кто планирует создать свой сайт, но и для тех у кого он уже есть. Следует сказать, что в зависимости от целей сайта, некоторые пункты могут подойти не для всех, но 90% из них подойдут и для простого сайта-визитки и для крупного Интернет-магазина.

comments powered by Disqus