Блог / Статьи20 июля 2020

Как добавить картинку в мобильную поисковую выдачу для своего сайта

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

В Google понимают, что мобильная выдача – это не совсем то же самое, что десктопная, поэтому время от времени дополняют ее особыми функциями, которые отсутствуют на настольных компьютерах. Одной из них стали картинки в сниппетах: после длительного тестирования в 2016 году они окончательно закрепились в мобильном поиске. Качественное, яркое и тематическое изображение, без сомнения, помогает повысить кликабельность (CTR) сайта в выдаче.

Картинки в мобильной поисковой выдаче

Так выглядят картинки в мобильной поисковой выдаче Google

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

Найдите свой сайт и аналогичные страницы конкурентов в мобильной выдачи Google. Увидели, что хотя бы у одного конкурента картинка появляется, а у вас она отсутствует? Тогда время действовать!

Каким требованиям должно соответствовать изображение?

Мы в Arto Web Agency столкнулись с ситуацией, когда у нашего клиента (сайт аренды автомобилей) картинка в мобильной выдаче для главной страницы не отображалась, хотя на странице присутствовали некоторые изображения. Мы заинтересовались, что же влияет на показ картинок в сниппетах для тех или иных сайтов, и провели небольшое исследование: проанализировали как страницы конкурентов, так и некоторые сайты из других тематик. Вот что удалось выяснить.

Размер изображения

Первое, на что мы обратили внимание – соотношение сторон картинки. Как выяснилось, в тематике аренды авто в поисковую выдачу попадали преимущественно изображения, у которых соотношение ширина/высота составляло от 1,4 до 1,9 (не очень широкие горизонтальные). Гораздо реже появлялись квадратные или вертикальные картинки (соотношение от 0,7 до 1). В среднем этот показатель составил 1,7.

Похожую картину можно увидеть и для информационных сайтов. А вот в тематике интернет-магазинов чаще всего встречаются именно квадратные изображения (соотношение около 1).

Узкие вертикальные изображения (отношение ширины к высоте менее 0,6) и очень широкие горизонтальные (отношение более 2) практически не были замечены.

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

Обратите внимание! Каким бы ни был размер изображения, в выдаче оно обрезается до квадратного. Поэтому следите за тем, чтобы самое важное на картинке было расположено по центру.

Вывод: чтобы «протолкнуть» картинку в выдачу, как ориентиры отношения сторон (ширина к высоте) можно взять 1 для интернет-магазинов, 1,7 – для информационных ресурсов и сайтов услуг. Вряд ли сработают: слишком широкие (соотношение больше 2), узкие (менее 0,6) или очень мелкие изображения (меньше 150 пикселей).

Формат файла

Здесь все просто: равноценные «шансы на успех» имеют изображения в форматах JPEG и PNG. Также изредка встречается современный формат WEBP (возможно, он уступает первым двум только из-за своей низкой популярности).

Расположение на странице

Чаще всего Google выбирает для поисковой выдачи те изображения, которые расположены ближе к верхней части страницы. Если в сниппет попала картинка, которая находится ниже других, то это обычно означает, что предыдущие изображения «не устроили» поисковую систему по другим параметрам.

Расположение в коде

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

Тематичность и понятность

Вполне вероятно, что Google предпочитает картинки, на которых изображено то, что соответствует тематике страницы. Объект на фотографии должен быть хорошо заметен, даже если размер изображения сильно уменьшить.

У интернет-магазинов редко возникают с этим проблемы (фотографий товара на страницах предостаточно), а вот сайтам услуг стоит об этом позаботиться. Предлагаете аренду авто? Разместите изображения, где четко виден автомобиль. Предоставляете услуги салоны красоты? Добавьте на целевую страницу понятные фото вашего зала, процесса обслуживания клиентов и т.д.

Другие рекомендации

  • Оптимизируйте «вес» изображения. Даже если поисковая система обработает ваш файл размером в несколько мегабайт, он все равно замедлит загрузку страницы. А это может негативно повлиять не только на пользовательский опыт, но и на ранжирование в поиске.

Интересно знать! Хотите узнать больше об оптимизации скорости загрузки страниц? Читайте в нашем блоге о том, как проверить этот показатель и сделать правильные выводы.

  • Добавьте атрибут alt. Таким образом вы не только поможете поисковой системе понять, что именно изображено на фотографии, но и получите больше шансов на дополнительный показ в поиске по картинкам. Текст атрибута должен быть кратким, но емким и точным.
  • По возможности используйте уникальные изображения. Фото, сделанные именно в вашей компании, хотя и не являются обязательным условием, но станут отличным бонусом и повысят доверие пользователей.

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

Наш кейс

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

Картинки на странице сайта до изменений

  • баннеры в слайдере (вверху), встроенные через тег img (соотношение сторон около 2,7);
  • картинки-превью услуг (в центре), встроенные с помощью стилей (соотношение около 1,6);
  • инфографика (внизу, тег img, соотношение 1,7) – громоздкая и малопонятная без текста, который не является частью изображения.

Как видим, каждый из этих файлов имел некоторые несоответствия требованиям, которые мы привели выше. Поэтому мы добавили еще одно изображение, которое соответствовало всем критериям:

Фото, добавленное на веб-страницу

Картинка одновременно послужила и в качестве превью для видеоролика, который дополнительно повысил информативность страницы. Уже через несколько дней увидели результат:

Картинка в мобильном сниппете в Google

Выводы

Хотите, чтобы изображение с вашей страницы было показано в сниппете мобильного поиска? Тогда разместите картинку:

  • в верхней части страницы;
  • с соотношением ширина/высота от 1 до 1,7;
  • в формате JPEG или PNG;
  • с помощью тега img с атрибутом alt;
  • в оптимизированном размере, но не меньше 150 пикселей;
  • тематическую, понятную даже в уменьшенных размерах и по возможности – уникальную.

А еще – помните о том, что ваши фото пользователь увидит не только в поиске, но и на самой странице. Соответствие изображений дизайну и UX сайта не менее важно, чем приведенные выше критерии!

Николай Ашпин
SEO, редактор блога
Занимаюсь копирайтингом с 2014 года, SEO – с 2017. Интересуюсь современными тенденциями интернет-маркетинга и поисковой оптимизации, а также возможностями инструмента Google My Business, опытом использования которого делюсь на семинарах и конференциях. Если у вас есть вопрос по этой статье, пожалуйста, напишите на почту nikolay@arto.agency.

Узнавайте о важном первыми!

Учебные материалы, важные новости, обзоры. Мы пишем вам тогда, когда действительно есть что сказать
КОММЕНТАРИИ
КОММЕНТИРОВАТЬ
ВОЙТИ
  • Facebook
  • Twitter
ЭТОТ САЙТ ИСПОЛЬЗУЕТ COOKIES
Мы используем cookies для анализа трафика, обеспечения функций социальных сетей и работы системы комментирования на сайте. Список устанавливаемых cookies находится на этой странице. Согласны ли вы на установку cookie?