Привлекательные сниппеты в поисковой выдаче и как их получить
Что такое сниппет
Сниппет – это небольшой информационный блок, который вы видите в результатах поисковой выдачи. Он показывает, какую информацию пользователь получит на сайте еще до его посещения, тем самым привлекая пользователей на ресурс. Из этого следует правило: чем ярче и больше сниппет, тем больше кликов.
Самый простой сниппет состоит из заголовка (Title), описания (Description), url и фавиконки:
В расширенной версии сниппета добавляются: быстрые ссылки, рейтинг, картинки, цены, галерея статей или товаров:
Быстрые ссылки
Блок «Быстрые ссылки» формируется автоматически и показывает популярные разделы сайта. Редактировать список можно в интерфейсе Яндекс Вебмастера в разделе «Представление в поиске → Быстрые ссылки». В Google Быстрые ссылки полностью формируются автоматически и вручную их редактировать нельзя.
Пример быстрых ссылок в Яндексе:
Рейтинг
В Яндексе и Google рейтинг отображается в виде звездочек. В Яндексе он добавляется с помощью Яндекс Маркета или Яндекс Бизнеса. Для этого необходимо полноценно разместить товары на сервисах, после чего в выдачу будет подтягиваться информация об отзывах в формате рейтинга:
В Google рейтинг можно добавить с помощью микроразметки AggregateRating.
Пример разметки:
< itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating" >
< meta itemprop="bestRating" content="5" >
< meta itemprop="ratingValue" content="4.2" >
< a href="/film/564577/votes/" class="continue rating_link rating_ball_green" >
< span class="rating_ball" >4.3< /span >
< span class="ratingCount" itemprop="ratingCount" >356< /span >
Расшифровка:
-
itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating"
Этот тег указывает поисковику, что перед ним рейтинг
-
meta itemprop="bestRating"
Шкала оценок. В данном случае материал оценивается по 5-бальной шкале.
-
meta itemprop="ratingValue"
Рейтинг статьи. В нашем случае он равен 4.2
-
itemprop="ratingCount"
Общее количество оценок. Свои оценки поставили 356 пользователей.
Цена товара
Информация о цене товара – она может использоваться в сниппетах на страницах поисковой выдачи Яндекса и Google.
Пример сниппета с ценой товара:
Чтобы получить такой сниппет, нужно сделать микроразметку Product, а для Яндекса дополнительно сформировать фид в формате YML и загрузить его в Вебмастер Яндекса.
Примеры реализации микроразметки Product для товаров:
< div itemscope itemtype="http://schema.org/Product" >
< h1 itemprop="name" >Название товара< /h1 >
< link itemprop="url" href="https://site.ru/product/sandalii" >
< img src="https://site.ru/upload/resize_cache/iblock/20e/500_600_1/20e1991c947d1812f1301777c010ada2.jpg" itemprop="image" >
< div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" >
< span itemprop="ratingValue" >5< /span >
< span itemprop="reviewCount" >10< /span >
< /div >
< div itemprop="offers" itemscope itemtype="http://schema.org/Offer" >
< link itemprop="availability" href="http://schema.org/InStock" >
< meta itemprop="price" content="629" >
< meta itemprop="priceCurrency" content="RUB" >руб.< /span >
< /div >
< div itemprop="description" >Купить в интернет-магазине: Сандалии. Большой выбор одежды и обуви по выгодным ценам с доставкой по России.< /div >
< div >Производитель: < span itemprop="brand" >Название производителя< /span >< /div >
< /div >
По аналогии нужно разметить все товарные страницы. Важно учесть: если на странице несколько изображений, то в разметку нужно включить все изображения основного товара.
Изображения и видео
Микроразметка изображений и видео добавляет картинку/видео в сниппет (как в Яндексе, так и в Google):
Шаблон микроразметки для изображений:
< div itemscope itemtype="http://schema.org/ImageObject" >
< h2 itemprop="name">Название изображения
< img src="ССЫЛКА НА ИЗОБРАЖЕНИЕ" itemprop="contentUrl" / >
< span itemprop="description">Описание изображения (можно взять с Alt)
< /div >
Шаблон микроразметки для видео:
< div itemscope itemprop="VideoObject" itemtype="https://schema.org/VideoObject" >
< h1 itemprop="name">Introducing the self-driving bicycle in the Netherlands< /h1 >
< meta itemprop="uploadDate" content="2016-03-31T08:00:00+08:00" / >
< meta itemprop="duration" content="PT1M54S" / >
< p itemprop="description">This spring, Google is introducing the self-driving bicycle in Amsterdam, the world's premier cycling city. The Dutch cycle more than any other nation in the world, almost 900 kilometres per year per person, amounting to over 15 billion kilometres annually. The self-driving bicycle enables safe navigation through the city for Amsterdam residents, and furthers Google's ambition to improve urban mobility with technology. Google Netherlands takes enormous pride in the fact that a Dutch team worked on this innovation that will have great impact in their home country.
< div itemprop="interactionStatistic" itemtype="https://schema.org/InteractionCounter" itemscope >
< meta itemprop="userInteractionCount" content="5647018" / >
< meta itemprop="interactionType" itemtype="https://schema.org/WatchAction" / >
< /div >
< link itemprop="embedUrl" href="https://www.example.com/embed/123" / >
< meta itemprop="contentUrl" content="https://www.example.com/video/123/file.mp4" / >
< meta itemprop="regionsAllowed" content="US,NL" / >
< meta itemprop="thumbnailUrl" content="https://example.com/photos/1x1/photo.jpg" / >
< /div >
Галерея товаров
Товарный сниппет с галереей изображений формируется только в Яндексе, если подключены «Турбо-страницы для интернет-магазина». Он показывается по запросам конкретного товара или услуги и содержит галерею картинок, опции доставки, цены и скидки, описание или характеристики.
Чтобы сформировалась галерея товаров, необходимо подключить «Турбо-страницы для интернет-магазина» или разместить товары на Яндекс Маркете. О том, как создать турбо-страницы для интернет-магазина, я рассказывала в статье «Как настроить турбо-страницы на сайте».
Пример турбо-сниппета с галереей для товаров:
Галерея статей
Галерея ссылок на популярные материалы сайта формируется в сниппете, если подключены «Турбо-страницы для контентных сайтов». О том, как создать турбо-страницы для контентных сайтов, я рассказывала в статье «Как настроить турбо-страницы на сайте».
Пример сниппета с галереей статей:
Дополнительные элементы
Верстка элементов характеристик в табличном варианте
Если на сайте есть дополнительные характеристики товара, то необходимо переверстать их в таблицы через тег < /td >:
Пример вывода характеристик в сниппетах Google при табличной верстке:
Google выведет в сниппет то, что сам посчитает наиболее полезным – то есть наиболее важные характеристики.
Emoji в метатегах и хлебных крошках
Чтобы привлечь еще больше внимания к сниппету и сайту, можно добавить Emoji в описание, заголовок и хлебные крошки.
Пример выдачи с emoji:
Чтобы добавить Emoji в хлебные крошки, необходимо использовать микроразметку Json ld. Метод подходит только для Google.
Пример разметки с Emoji:
< script type="application/ld+json" >
{
"@context": "https://schema.org/",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"name": "Интернет-магазин",
"item": "https://site.ru/"
},{
"@type": "ListItem",
"position": 2,
"name": "Каталог ",
"item": "https://site.ru/catalog/"
}]
},{
"@type": "ListItem",
"position": 3,
"name": "Каталог товаров для девочек ",
"item": "https://site.ru/catalog/devochki/"
}]
}
< /script >
Заключение
Большой и яркий сниппет несомненно привлечет внимание пользователя и подтолкнет его к переходу на сайт — но это не самое важное. В первую очередь сниппет должен быть релевантным и соответствовать запросам пользователей, должен давать подробную информацию, что они получат на странице сайта. Тогда сниппет будет получать не только высокий CTR и трафик, но и улучшит поведенческие факторы.
Подписывайся!
ВКонтакте
Есть о чем рассказать? Тогда присылайте свои материалы Марине Ибушевой
