Вы здесь

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

Использование микроразметки на сайте – это полезная практика, которая позволяет сделать его содержание более структурированным и понятным для поисковых машин. СтандартSchema.org был введен в 2011 году гигантом поиска Google при поддержке Yahoo! и Bing и ныне учитывается, в том числе, и Яндексом. Посредством специальных тегов HTML-кода поисковые роботы получают четкое представление о характере контента ресурса, что позволяет строить более релевантную выдачу и повышать качество поиска. Сайт, в свою очередь, получает расширенный привлекательный сниппет и, следовательно, рост числа поискового трафика.

Создаем товарный сниппет

Информацию о товарах и их стоимости, представленную в карточках интернет-магазина или на страницах корпоративного сайта компании, можно транслировать в сниппет для выдачи Google и Яндекса. Чтобы сформировать такое полезное дополнение в описании ссылки, необходимо разметить соответствующие страницы ресурса при помощи стандарта Schema.org.

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

Для формирования товарного сниппета необходимо использовать соответствующие схемы (ProductOfferAggregateOffer) и их свойства, описанные в иерархии на сайте Schema.org (прим.: англоязычный ресурс). Следует отметить, что Яндекс учитывает далеко не весь список свойств (к примеру, нет возможности указать информацию о рейтинге продукта), поэтому товарный сниппет в данной поисковой системе выглядит более скромным, нежели в Google.

Рассмотрим пример семантической разметки для карточки товара Iphone 6 интернет-магазина Евросеть. Сниппет данной страницы в Google выглядит следующим образом (Рис.1):

snippet_evroset_google.pngРис. 1

 

Заглянем в HTML-код страницы, чтобы увидеть правила, посредством которых в сниппет карточки товара транслируются его название, стоимость и рейтинг на основании отзывов покупателей. Атрибут itemscope дает указание поисковому роботу на то, что описывается определенный объект, itemtype называет тип объекта (в нашем случае – Product):

<span itemscope itemtype="http://schema.org/Product">

 

Атрибут itemprop описывает свойства объекта, в данном примере – это название (name):

<meta content="Apple iPhone 6 16 Гб Space Grey" itemprop="name">

 

Следует подчеркнуть, что весьма кстати здесь можно было бы использовать и свойство объекта «описание» (description) с размещением ключевой информации о товаре.

Следующее правило позволяет отобразить стоимость товара в сниппете:

<span itemscope itemtype="http://schema.org/Offer" itemprop="offers">

<meta content="RUR" itemprop="priceCurrency">

<span class="sum" itemprop="price">46 990</span>

 

И, наконец, указывается тип объекта, обозначающий рейтинг на основании отзывов:

<span itemscope itemtype="http://schema.org/AggregateRating" itemprop="aggregateRating">

<meta content="5" itemprop="ratingValue">

<meta content="2/" itemprop="reviewCount">

</span>

 

В результате несложных преобразований исходного кода страницы удалось получить расширенный товарный сниппет, который визуально выделяется на странице поиска. Аналогичный пример можно привести и для выдачи Яндекса, но с тем отличием, что сниппет здесь содержит более ограниченный набор данных о товаре (Рис.2).

snippet_eldorado_ya1.pngРис. 2

 

Подробная информация о правилах синтаксиса стандарта Schema.org на русском языке и примеры построения кода представлены в справочной документации Яндекса и в оригинале (прим.: на английском языке) на официальном сайте Schema.org.

Дополняем сниппет данными о компании

При помощи семантической разметки существует возможность добавить в сниппет информацию об адресах и организациях, в том числе передать данные о компании в Яндекс.Справочник и Граф знаний Google. Впоследствии они могут быть использованы в различных сервисах поисковых систем или в поиске для предоставления пользователям наиболее важных параметров организации. К примеру, в описание ресторана могут быть включены адрес, телефон, часы его работы и отзывы посетителей. Ниже вы можете видеть расширенный сниппет сайта стоматологии в поисковой выдаче Яндекса (Рис.3).

snippet_organization1.jpgРис. 3

 

За разметку контента страницы контактов компании отвечают схемы Organization и Place. В поисковой системе Google к тому же реализована возможность размещения логотипа или другого графического элемента, который будет отображаться, к примеру, в сети знаний(справа от результатов поиска) (Рис.4).

knowledge_google1.jpgРис. 4

 

Другие области применения

Стандарт Schema.org также очень популярен среди владельцев информационных сайтов и блогов. Неудивительно, что для движка WordPress создан ряд плагинов для автоматической генерации и встраивания микроданных в код страницы. Довольно часто в сниппете можно увидеть графические элементы (фотографии, картинки, видео) или, например, описание искомого фильма, которые привлекают внимание и невольно мотивируют пройти по предлагаемой ссылке.

Такой прием расширения сниппета применяется для следующих ресурсов:

  • сайты рецептов (Recipe) (Рис.5);

snippet_recipe.pngРис. 5

 

  • сайты с видеопубликациями, видеохостинги (VideoObject);

  • новостные порталы, блоги (NewsArticleBlogPosting);

  • сайты вопросов и ответов (Question и Answer);

  • сайты мобильных и веб-приложений (SoftwareApplication);

  • сайты с каталогами фильмов, книг, рефератов и т.д. (MovieCreativeWork);

  • энциклопедические, словарные ресурсы (ScholarlyArticle);

  • сайты-афиши с публикацией событий (Event).

И это лишь малая часть примеров применения семантической разметки. Количество доступных наборов классов Schema.org для описания разного рода объектов и их свойств насчитывает несколько сотен вариантов. Ведущие поисковые системы на текущий момент поддерживают не все доступные типы микроданных, однако постоянно работают над областью их расширения.

Выводы 

При оптимизации сайта следует уделить пристальное внимание семантической разметке Schema.org, которая имеет большое значение для повышения качества ресурса и его представления в результатах поиска. Внедряя ее, обязательно проверьте корректность кода при помощи валидаторов Google или Яндекса.

 

Рассылка SEOPult-a