Что такое Schema org

Что такое структурированные данные?

Структурированные данные – это информация, которая представлена в единой и корректной форме с соблюдением определенного комплекса правил.

На сегодняшний день в SEO есть два распространенных типа структурированных данных это:

• Свойства, которые указываются непосредственно в HTML или с помощью инструментов Google и описывают такую информацию, как цена, адрес, телефон, email и т.д.
• Описывают тип контента на странице. Например, разметка страниц в виде статей, товарных карточек, событий, видео и т.д.

У структурированных данных есть также второе общепринятое название «Микроразметка».

Разметка данных осуществляеться непосредственно в самом HTML-коде страницы по описанным правилам в словаре schema.org. Также этот процесс может происходить опосредованно, с помощью «Google Маркера» или сервиса «Товары и цены» от Яндекса через панели веб-мастеров.

Зачем нужны структурированные данные на сайте?

Независимо от того, коммерческий у вас сайт или сайт компании, если на нем нет разметки структурированных данных (микроразметки), то следует как можно быстрее её внедрить.

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

Изображение 1. Сниппет в поисковой выдаче Яндекса интернет-магазина ТВОЕ по запросу «купить белую мужскую футболку». В данном случае размечена цена в формате «от руб.».

Расширенное описание делает ваш сайт заметным и отличает от других участников поиска, что вследствие улучшает CTR. Это вторая причина для внедрения семантической разметки. Как правило, у страниц со структурированными данными показатель кликабельности выше на 30%, чем у тех страниц, где микроразметки нет вовсе. Однако не стоит забывать, что все зависит от ниши, в которой продвигается тот или иной сайт. Если абсолютно все ваши конкуренты используют микроразметку, то отсутствие её на вашем сайте будет очевидным минусом. А если в вашей нише большинство конкурентов не используют этот инструмент, то внедрение структурированных данных на сайте пойдет только на пользу.

Изображение 2. Выдача в Google по запросу «купить айфон 7». Лишь у 2 из 10 сайтов размечены страницы (первый сайт не влез на скриншот, но там был Яндекс.Маркет).

Что нужно размечать?

Чаще всего с помощью микроразметки schema.org размечается следующие типы информации на сайте:

• Товары — schema.org/Product
• Рецепты — schema.org/Recipe
• Статьи — schema.org/Article
• Видео — schema.org/VideoObject
• Фильмы — schema.org/Movie
• Музыка — schema.org/MusicAlbum
• Отзывы и рейтинг — schema.org/Review или Google support
• Известные личности или выдуманные персонажи — schema.org/Person или People
• Организации — schema.org/Organization

Вариантов разметки по словарю schema.org на самом деле огромное количество и чуть ниже мы разберем часть из них.

В зависимости от типа страниц размечается такая информация, как:

• Цена;
• Производитель;
• Автор статьи;
• Описание;
• Дата публикации;
• Адрес;
• Телефон;
• Список;
• Жанр фильма;
• Музыкальный альбом;
• Рейтинг и т.д.

Какие есть виды словарей микроразметок?

В настоящее время лидером в описании структурированных данных по праву считается schema.org, однако это далеко не единственный словарь микроразметки. Существуют еще такие методы разметки, как:

• Json-ld
• Open Graph
• Microformats
• Data Vocabulary
• DublinCore
• GoodRelations
• FOAF

Расписывать принципы работы с каждым словарем мы не будем, разберем подробнее лишь три из них: Json-ld, Opne Graph и schema.org.

Schema.org

Начнем с популярного словаря по микроразметке schema.org. Результат коллаборации Google, Yahoo!, Microsoft и Яндекса активно развивается и регулярно обновляется и по сей день. На момент создания статьи в словаре имеются описания для 589 типов документов, 860 свойств объектов и 114 специфичных значений. Полный список всех свойств перечислен в виде разветвленной иерархии на этой странице.

Основной высший тип сущности в словаре schema.org — Thing, который, в свою очередь, делится на несколько других подтипов. Некоторые из них:

• CreativeWork – общий набор правил для описания творческой деятельности: статьи, книги, фильмы, фотографии, программное обеспечение, и т.д.;
• Event – набор правил для событий, которые произошли или произойдут в определенный период времени: встречи, концерты, выставки и т.д.;
• Intangible — сервисный класс, который включает в себя несколько нематериальных вещей, таких как размеры, рейтинги, описания рабочих вакансий, услуг и т.д.;
• Organization – набор правил для разметки организаций, полный список разных видов бизнеса перечислен на странице localBusiness. Также можно посмотреть этот список в справке Яндекса https://yandex.ru/support/webmaster/supported-schemas/address-organization.html;
• Person – сущность используется для описания живых, умерших, вымышленных личностей или персонажей;
• Place – набор правил для чего-то, что имеет фиксированное физическое положение (здание, парк, памятник и т.д.);
• Product – это все, что создается для продажи. Например, пара обуви, билет или автомобиль.

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

У большинства тегов в словаре есть варианты применения в виде примерного куска HTML-кода или JSON-LD скрипта. Ниже мы рассмотрим примеры разметок страницы со статьей (article), товаром (product) и организацией (organization).

Шаблон микроразметки статьи с помощью schema.org

Чаще всего размечаются такие микроданные как URL, datePublished, dateModified, headline, image, author, publisher и др. Рассмотрим на конкретном примере:

Подобной схемы придерживаются большинство размеченных статей. Стоит обратить внимание, что в данном примере часть тегов указываются в разделе <head> (мета-описание и ссылка на автора в g+), а остальная часть прописывается в теле HTML-документа. Некоторые теги использовать не обязательно, к примеру, статья отлично будет себя чувствовать и без разметки тегами articleBody или publisher, но тогда вряд ли пройдет проверку на валидность в инструментах Яндекса или Google.

Изображение 3. Пример страницы в выдаче с микроразметкой статьи в Google. Рядом со статьей отображается дата публикации.

Изображение 4. Пример страницы в выдаче по тому же запросу, что и на изображении 3, только в Яндексе. Дата отображается справа, сверху указывается дата публикации или создания, а ниже дата изменения.

Шаблон микроразметки товарной карточки с помощью schema.org

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

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

Изображение 5. Пример из выдачи Google с указанием цены в формате «ОТ» и «ДО». 

Шаблон микроразметки организации с помощью schema.org

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

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

 У Google есть специальный инструмент для разметки страниц по словарю schema.org. С его помощью создавать разметку страниц намного проще.

Изображение 6. Пример из Яндекса. Дополнительная информация об организации отображается под описанием страницы и может быть внедрена как вручную, с помощью разметки, так и с помощью сервиса Яндекс.Справочник.

Плюсы и минусы микроразметки schema.org

Плюсы:

• Большой словарь, который постоянно обновляется;
• Поддерживается всеми популярными поисковыми системами;
• Код не скрыт скриптами и целиком находится в контенте страницы;
• Улучшает отображение сниппетов в поисковой выдаче;
• Можно найти разметку практически для каждого сайта;
• Существуют плагины для автоматизации формирования микроразметки;
• Активно развивается и дополняется.

Минусы:

• Большое количество схем микроразметки может отпугнуть неподготовленного пользователя;
• Нужны начальные знания верстки и изменения кода страниц;
• Усложняет HTML-код, что замедляет разработку сайта;
• Вся официальная справочная документация на английском языке;
• Не для всех свойств есть примеры использования на официальном сайте.

Инструменты для работы с микроразметкой schema.org

В работе с микроразметкой schema.org пригодятся такие сервисы, как:

• Инструмент для проверки структурированных данных от Google;
• Помощник по микроразметке страниц по словарю schema.org от Google. По итогу получаем HTML-код страницы с уже внедренной микроразметкой;
• Проверка семантической разметки от Яндекса;

• Официальный сайт разметки;
• Неофициальный перевод сайта schema.org на русский язык;
• «All In One Schema.org Rich Snippets», «Wprichsnippets.com», «Schema App Structured Data» — плагины для WordPress, которые формируют семантическую разметку schema.org автоматически;
• Notepad++ — или любой другой текстовый редактор.

Open Graph

Данный протокол разработал «Facebook» для улучшения отображения сниппетов ссылок с внешних сайтов в социальных сетях. Это, наверное, один из самых простых и небольших словарей микроразметки. Начать внедрение разметки можно с четырех основных свойств:

• og:title — заголовок страницы.
• og:type — тип объекта, например, «music.album»(альбом). В зависимости от типа поддерживаются и другие свойства. Все возможные характеристики тега type перечислены на официальном сайте.
• og:image — URL изображения.
• og:url — канонический URL объекта.

 Все теги разметки «Open Graph» прописываются в контейнере <head>.

Помимо основных свойств также можно указать дополнительные, которые улучшат отображение ссылок в социальных сетях:

• og:audio – URL на аудиофайл, если при открытии страницы воспроизводится музыка.
• og:determiner — слово, которое появляется перед названием этого объекта в предложении. Тип enum (a, an, the, «», auto). Если выбрано auto, потребитель данных должен выбирать между «a» или «an». По умолчанию — » » (пусто). Тег наиболее актуален для англоязычного сегмента в связи с использованием различных артиклей вида «a», «the», «an» и т.д.
• og:description – описание страницы, разрешенное количество символов от 160 до 295 знаков.
• og:locale – язык и страна. Формат отображения language_TERRITORY, по умолчанию стоит en_US. Для русскоязычного сегмента прописывается тег ru_RU.
• og:locale:alternate – альтернативный язык или страна.
• og:site_name – название сайта.
• og:video – URL видео.

Шаблон разметки страницы Open Graph

Ниже представлен пример HTML-кода со всеми возможными свойствами, на практике часть из указанных тегов не указывается и хватает стандартных четырех свойств:

Изображение 7. Вид ссылки на Facebook с микроразметкой Open Graph.

Плюсы и минусы микроразметки Open Graph

Плюсы:

• Легкий в освоении словарь;
• Улучшает отображение ссылок во всех популярных социальных сетях;
• Поддерживается многими социальными сетями;
• Разметка совместима с приложениями и играми на платформе социальных сетей;
• Есть справочная документация на русском языке;
• Существуют плагины для автоматизации оформления данной разметки;
• Поддерживается поисковыми системами.

Минусы:

• Ограниченный функционал;
• Работает только в социальных сетях.

Инструменты для работы со словарем Open Graph

Для работы с микроразметкой «Open Graph» рекомендуются следующие сервисы:

• Официальный сайт Open Graph на русском языке с примерами разметок;
• Отладчик перепостов от Facebook показывает, какие данные указаны в Open Graph формате на web-странице;
• Плагин Open Graph для WordPress;
• Плагин Open Graph для Joomla;
• Notepad++- или любой другой текстовый редактор.

JSON-LD

Последний вид разметки и структурирования данных, который мы рассмотрим, – JSON-LD. Расшифровывается это страшное название как «JavaScript Object Notation Linked Data». За разработку формата ответственен «Консорциум Всемирной Паутины» или, другими словами, «W3C». Данный формат выполняет все ту же функцию, что и schema.org, но немного другим способом: он структурирует данные помощью JavaScript, что в несколько раз облегчает работу.

Один из плюсов этого формата в том, что для описания данных используется словарь schema.org. Таким образом, с помощью скриптов JSON-LD мы можем описать любой вид сущностей и улучшить отображение своего сайта в поисковой выдаче, затратив на это минимальное количество времени. Причем сделать это можно без внедрения HTML-тегов в тело страницы, нужно лишь указать <script type=»application/ld+json»> в контейнере <head>, а затем расписать все необходимые условия разметки и закрыть скрипт </script>.

Для наглядности сравним разметку schema.org и JSON-LD:

• Schema.org

• JSON-LD

Шаблон разметки статьи с помощью JSON-LD

Пример разметки с помощью JSON-LD я взял на основе микроразметки статьи в schema.org из этого же материала выше. Использованы все те же свойства.

Возникает закономерный вопрос: что же лучше schema.org или JSON-LD? Тут нельзя дать однозначный ответ. Работать с микроразметкой в формате JSON-LD проще и приятнее, чем все с тем же словарем schema.org в HTML-формате, но и у него есть свои минусы. Например, поисковик Google советуют использовать эту технологию для разметки своих страниц. А вот с Яндексом есть проблемы: данный вид разметки пока не отображается в результатах поиска из-за скриптов, хотя страницы с разметкой JSON-LD и проходят проверку на валидность.

 Поисковая система Яндекс не показывает в поисковой выдаче информацию, размеченную с помощью мета-языка JSON-LD.

Изображение 8. Письмо из техподдержки Яндекса по поводу планов насчет JSON-LD. За скриншот спасибо пользователю Oleh Holovkin.

В данном случае нужно правильно расставить приоритеты. Если нужны расширенные сниппеты в Яндексе и Google, то используем старую добрую разметку schema.org; если мы ориентируемся на Запад и наша основная поисковая система только Google, то разметку JSON-LD нужно брать и внедрять без промедлений.

Плюсы и минусы микроразметки JSON-LD

Плюсы:

• Формат несколько проще по сравнению с schema.org;
• Рекомендуется Google;
• Для движка WordPress есть качественные плагины для работы;
• Благодаря JavaScript разметка «невидима» для рядового пользователя в отличие от HTML;
• Скрипт помещается только в контейнер <head> без внедрения дополнительных строчек кода в тело сайта;
• Проходит валидацию в официальных инструментах проверки Яндекса и Google.

Минусы:

• Микроразметка основана на JavaScript и не во всех поисковых системах отображается в поисковой выдаче (в том числе и Яндексе);
• Помимо знаний HTML нужны также знания JavaScript;

Инструменты для работы с микроразметкой JSON-LD

Набор инструментов для работы с микроразметкой JSON-LD:

• Инструмент для проверки структурированных данных от Google;
• Проверка семантической разметки от Яндекса;
• Плагин для WordPress, который поддерживает все типы микроразметки;
• Еще один плагин для WordPress, который может указать автора статьи и издательство, подойдет для периодичных изданий и блогов;
• Модуль JSON-LD для движка Drupal;
• Документация по JSON-LD для платформы GIT;
• Официальная документация JSON+LD от W3C;
• Notepad++ — или любой другой текстовый редактор.<

Как еще можно разметить сайт?

Те способы разметки, что перечислены выше, относятся к непосредственному вмешательству в исходный код страницы, однако есть и другие методы структурирования данных.  Это Data Highlighter (Маркер) от Google и «Товары и цены» от Яндекса. С помощью этих инструментов можно напрямую из панели веб-мастеров расширить сниппеты страниц в поисковой выдаче.

Изображение 9. «Маркер» в Search Console и сервис «Товары и цены» от Яндекса.

Маркер Google

Для того, чтобы начать разметку, нужно:

1. Перейти к инструменту и выбрать тип данных для разметки. На данный момент их всего 9 штук:
   • Мероприятия
   • Местные организации
   • Обзоры книг
   • Приложения
   • Продукты
   • Рестораны
   • Статьи
   • Телесериалы
   • Фильмы

Изображение 10. Панель выбора типа информации для разметки в Search Console.

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

    Размечать можно только те страницы, которые находятся в индексе Google.

3. После выбора страницы и разметки всех необходимых элементов появится окно, в котором будут отображены документы сайта, похожие на размечаемую страницу. Можно согласиться с подбором Google или создать свою группу страниц по разделам, к примеру, разметить только страницы раздела https://site.com/articles/ (важно условие: в разделе должна находиться первоначально размечаемая страница).

   

   Изображение 11. Окно с автоматически подобранными страницами для разметки Маркером.

    Помечать Маркером от Google можно только видимые элементы сайта.

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

Изображение 12. Кнопка для удаления неверно определённой страницы для разметки в Search Console.

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

Изображение 13. Пример списка уже размеченных страниц с помощью Маркера Google.

На этом разметка с помощью Маркера Google заканчивается. В данном случае абсолютно не нужно знать HTML или JavaScript, достаточно вручную разметить каждую страницу, и Google сам обработает данные и внесет корректировки в поисковые сниппеты. Но и у Маркера есть свои плюсы и минусы.

Плюсы и минусы микроразметки с помощью Маркера от Google

Плюсы:

• Разметка без вмешательства в исходный код страниц;
• Инструмент находится непосредственно в Google Search Console;
• Страницы размечаются полуавтоматически;
• Можно группировать страницы по типам;

Минусы:

• Разметка будет отображаться только в поисковой выдаче Google;
• Инструмент не всегда корректно размечает информацию;
• При разметке крупного сайта много ручной работы.

Сервис «Товары и цены» Яндекса

Сам по себе этот инструмент не совсем относится к привычному понимаю микроразметки страниц, так как обычно в Яндексе он применяется для загрузки информации о товаре в Яндекс.Маркет в YML-формате. Как ни странно, Яша смог найти применение данному виду информации о товаре, и сейчас в органической выдаче часто встречаются сайты, размеченные с помощью этого сервиса. Главная особенность «Товаров и цен» – это отображение в поисковой выдаче Яндекса цены на товар/услугу справа от ссылки на сайт.

Изображение 14. Пример отображения цены услуги в выдаче Яндекса с подключенным сервисом «Товары и цены».

 Применять сервис «Товары и цены» могут не только интернет-магазины, но и организации, которые предоставляют услуги. В данном случае придется создавать YML-документ вручную.

Итак, для того, чтобы подключить сервис «Товары и цены» в Яндексе, нужно:

1. Добавить свой сайт в веб-мастер Яндекса и перейти в сервис «Товары и цены»;

2. Затем нужно принять условия соглашения, если ранее на сайте не был подключен данный сервис.

Изображение 15. Яндекс предлагает ознакомиться с форматом YML и руководством по подключению.

3. После согласия с условиями Яндекса появится окно для заполнения информации об организации. Обязательные пункты для заполнения в блоке «Магазин»:
   • Местонахождение магазина/организации (указывается город, где находится магазин/организация. Например, Москва. Если магазин/организация представлена в нескольких городах, укажите основной, а остальные города перечислите в поле «Регионы доставки»);

    Если поставить регон «Россия» в графе «Регионы доставки», то в сниппете будет отображаться доставка по геолокации пользователя.

   

   Изображение 16. Пример сниппета в региональной выдаче с указанием геопозиции.

   • Контактный телефон магазина/организации (в формате +7 (495) 7777777);
   • Адрес страницы (URL), где представлена информация о времени работы магазина (ссылка на страницу контактов);

   В следующем окне заполняется юридическая информация об организации. Обязательные поля:

   • Организационно-правовая форма (ООО, ЗАО, ИП и т.д.);
   • Название организации;
   • ОГРН (допускаются только цифры);
   • Почтовый адрес;
   • Адрес местонахождения, указанный в Уставе;
   • Адрес страницы (URL), где представлена информация о юридическом лице (и снова ссылка на страницу контактов);

   

   Изображение 17. Интерфейс сервиса «Товары и цены» без заполненной информации об организации.

4. Следующим шагом будет загрузка самого YML-файла. Но перед тем, как файл куда-то загружать, его нужно выгрузить из базы данных или сформировать вручную. Итак, у нас есть четыре варианта получить YML-файл:
   • Воспользоваться готовым решением в CMS. Во многих популярных движках функция выгрузки YML-файла заранее предусмотрена и сделать это можно буквально в два клика. На этом сайте перечислено большое количество движков и способы выгрузки необходимого файла;
   • Сгенерировать YML-документ вручную. Этот вариант подойдет для небольшого ассортимента товаров или услуг, так как размечать каждый товар отдельно – дело весьма трудоёмкое и неблагодарное 🙂 В данном случае можно воспользоваться генератором YML-файлов для интернет-магазина.

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

   • Если сайт ранее был представлен в Яндекс.Маркете, то у вас скорее всего уже есть этот документ и он подойдет для дальнейшей настройки сервиса «Товары и цены»;
   • Если у вас самописная CMS или просто в вашей базе данных нет функции выгрузки подобного файла, то стоит рассмотреть вариант разработки модуля. Дело трудоёмкое и затратное, однако, подобный функционал на сайте в будущем еще пригодится

5. Как только у вас на руках будет сформированный YML-документ, его нужно будет загрузить на сайт. Не имеет большого значения, в каком уровне вложенности будет находиться этот документ. Самое главное, чтобы помимо информации из файла на странице больше ничего не было.

   Примеры:

   • https://site.com/yml/doc.yml
   • https://site.com/doc.yml

   Если боитесь, что ваш YML-файл смогут найти конкуренты, то можно положить документ в папку, где требуется авторизация. Для этого нужно раскрыть блок «Дополнительная информация» во вкладке «Источники данных» в сервисе и ввести логин и пароль для доступа.

   

   Изображение 18. Меню дополнительных настроек YML-файла.

    При частом изменении цен у товаров следует настроить автамтическую генерацию документа в настройках CMS. Если из-за специфики движка невозможно настроить автоматическое генерирование файла, то следует вручную обновлять документ 1 раз в 30 дней. Сам Яндекс скачивает YML-файл с сайта 1 раз в сутки.

6. После того, как все графы заполнены и добавлен YML-файл на сайт, нажимаем кнопку «Включить магазин» в основном окне сервиса «Товары и цены». Появится сообщение о том, что сайт будет находиться на модерации и в течение 30 дней в поиске начнут появляться расширенные сниппеты.

    Как только у сайта будет включен сервис «Товары и цены» Яндекса расширенные сниппеты начнут появляться в выдаче по некоторым запросам уже через неделю с момента включения сервиса.

   

   Изображение 19. Пример выдачи в Яндексе по запросу «купить xiaomi redmi 4 pro».

Плюсы и минусы инструмента «Товары и цены» Яндекса

Плюсы:

• Сильно отличает сайт от других конкурентов в поиске, увеличивает CTR;
• Пользователь до перехода на сайт получает информацию о стоимости услуги/товара;
• Помимо цены в YML-документе указываются другие параметры, которые также учитываются при формировании сниппета;
• В большинстве популярных движков сайтов генерация файла происходит в автоматическом или полуавтоматическом режиме.

Минусы:

• Результаты с ценами будут видны только в выдаче Яндекса;
• Выгрузка YML-документа предусмотрена не во всех CMS;
• При частой смене цен на сайте требуется регулярная генерация документа;
• Трудозатратно, если нужно разметить большое количество страниц вручную.

Инструменты для работы с сервисом «Товары и цены» Яндекса

В отличие от Маркера Google для работы с YML-файлом потребуется следующие инструменты для работы:

• Список движков сайтов с возможностью выгрузки YML-документов;
• Генератор YML-документа для формирования файла вручную;

Итог

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

У каждого способа разметки данных есть свои достоинства и недостатки, перед началом внедрения следует трезво оценить свои возможности и выбрать наилучший вариант. Отдельные методы разметки можно комбинировать друг с другом, к примеру, Open Graph с schema.org и «Товарами и ценами» от Яндекса. И помните: наличие микроразметки на сайте не гарантирует изменение поискового сниппета в выдаче, в первую очередь это облегчает сканирование сайта поисковиками.

Статью подготовил: Абдуллин Константин, Технолог SEO-эксперт компании SEO.RU

seo.ru

Что такое структурированная информация

Это данные, которые вы добавляете на свой сайт, размеченные особым способом. Он помогает пс понимать, что именно находится на вашем портале. Вам понадобится так называемый словарь, который использует большинство систем — Schema.org. В нем находятся описание для разного типа материалов: продукты, обзоры, списки местных компаний… Системы Google. Bing, Яндекс и Yahoo вместе разработали этот словарь, чтобы лучше читать веб-сайты.

Если разметка правильно внедрена на сайт, системы смогут использовать структурированные данные. Результатом станет лучшее ранжирование ресурса, и получение дополнительного места в выдаче: расширенные сниппеты или карточки товаров. Гарантировать, однако, это нельзя — все зависит от самого поисковика.

Зачем нужно структурировать данные

Маркировка продуктов, статей, мероприятий в соответствии с правилами Schema.org мгновенно сделает сайт понятным поисковым системам. Это значит, что ПС могут точно определить, какая информация относится к данным о компании, к товарам. Роботам не потребуется дополнительное время на решение, что чем является на вашем сайта.

Влияет ли структура данных на SEO

Быстрый ответ: да, влияет. Shema.org для структурирования нужна для оптимизации сайта. Правильное внедрение может вам и не дать прибавки к рейтингу в выдаче, но косвенно она сделает ваш сайт лучшим в ней результатом.

Ваш сайт будет представлен расширенным образом. А значит, привлечет больше внимания пользователей. И если текстовое сопровождение несет пользу, а страница в целом соответствует тому, что нужно человеку, то ваш сайт станет лучшим результатом. Это улучшит поведенческий фактор.

Число отказов уменьшится. Google сочтет ваш сайт хорошим результатом для конкретного запроса, где пользователь находит точный ответ на волнующий его вопрос.

Кроме того, многие сайты еще не внедрили микроразметку. Для вас это шанс стать лучше конкурентов. Просто вдумайтесь. Вы разметите 300 положительных отзывов, которые оставлены на сайте вашей парикмахерской. Конкурент, который не будет также использовать комментарии о своем заведении, останется не у дел. Google соберет отзывы, покажет их в результате поиска. Какую парикмахерскую вы выберете — у которой 300 положительных отзывов или у которой нет ни одного?

Структурированные данные — больше места в выдаче

Адаптируя свой сайт под требования поисковиков, вы позволяете им делать интересные вещи с вашими материалами. Shema.org постоянно развивается и обновляется. Структурированные данные — основа для новых разработок в сфере SEO, например, голосового поиска. В будущем появится еще больше новых функций. Ниже — выборка результатов расширенного поиска, которые доступны сейчас. Вы можете найти примеры всех в Google’s Search Gallery. Здесь приведены самые важные и актуальные.

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

Расширенные результаты

Согласно заявлению Google, термин «расширенный сниппет» больше не используется. Однако суть не изменилась. Это дополнительная информация на странице выдачи, интерактивные функции. К обычному тексту из дескрипшна подтягиваются данные с информацией о продукте: цена, отзывы, рейтинг, быстрые ссылки для навигации, хлебные крошки.

Расширенные результаты на мобильных устройствах

Вот так они выглядят сейчас.

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

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

Сеть знаний

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

Расширенный сниппет

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

Как структурирование информации работает на мобильных устройствах

Результаты структурирования показываются на всех устройствах. Для мобильных Shema.org только начинает портироваться. Хотя Google давно заявляет о важности этих платформ и уже ввел специальное индексирование.

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

Разные типы структурированных данных

Посмотрите на сайт микроразметки Schema.org. Есть много разных типов данных, которые вы можете использовать для своего портала. Но не все из них будут уместны. Чтобы внедрить микроразметку, ответьте на следующие вопросы:

• у вас есть товары в интернет-магазине?
• или у вас ресторан?
• у вас региональная компания, которая оказывает услуги?
• или сайт с лучшими рецептами чизкейков?

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

Не гонитесь за микроразметкой всех данных. Начните с тех форматов, которые проще всего внедрить. Некоторые есть на миллионе сайтов. А некоторые только на тысяче. Для удобства доступные форматы разделены на две группы.

Creative works

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

Статьи

Это новостной пост, отчет об исследовании, запись из личного блога. Вы можете даже указать сферу публикации: новость, технический текст, личное.

Книги

Может быть в бумажном или электронным формате. Можно отдельно указать автора, даже его награды и премии.

Курсы

Образовательные мероприятия. Сейчас этот вариант тестируется. Скоро каждый спикер может применить микроразметку для своих курсов и улучшить внешний вид в выдаче.

Множества

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

Руководства

Скоро вы можете разметить практические гайды на своем сайте. Пользователь будет следовать пошаговому чек-листу и выполнит свою задачу. Пока для этого типа информации нет расширенного результата.

Музыка

СКРИНШОТ
Аудио тоже может попасть в расширенную выдачу. Есть несколько типов для такой информации:

• MusicRecordings;
• MusicAlbum;
• MusicEvent;
• MusicGroup.
• Рецепты

Указывая поисковику, что текст на сайте — рецепт, вы можете вывести их на главную страницу выдачи. А ранжирование для мобильных устройств позволяет сделать представление красочным — добавить на сниппет изображения блюда. Но и это не все. Голосовой бот Google может вслух зачитать этот рецепт для вас.

Фильмы и ТВ-передачи

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

Вы можете сделать собственную подборку с фильмами или телепередачами, разметить ее и таким образом загнать в выдачу. Дайте пользователю сразу то, что ему нужно — используйте ViewAction и Watch Action. Человек сможет сразу в выдаче перейти к просмотру материала.

Видеоролики

С видео можно делать интересные вещи. Прямо сейчас Google работает над новыми способами отображения в выдаче, например, над использованием AMP в каруселях роликов или списках Top Stories.

Подкасты

Записываете свои подскасты? Разметьте! Google подтянет на страницу выдачи описание к каждому выпуску, даже добавит кнопку воспроизведения.

Commerce

Вторая основная группа — это коммерческие расширения.

Мероприятия

Разметка событий в соответствии с правилами позволит им попасть на страницу выдачи. Это нужно в первую очередь владельцем площадок для организации мероприятий — ночным клубам, выставочным залам, конференц-холлам.

Организации

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

Товары

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

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

Отзывы

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

Получение рейтинга в 5 звезд может стать одной из главных задач маркетинга.

Новый расширенный результат: действия

Голосовые помощники стремительно набирают популярность — у Яндекса появилась «Алиса», а Google начал вплотную заниматься голосовым поиском. Вы можете отправить рецепт блюда со страницы выдачи в Google Home. Голосовой помощник вслух зачитывает рецепт, пока вы будете готовить еду. Этот расширенный результат называется «действия».

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

Технические аспекты

Для внедрения микроразметки данных, разберитесь, как работает Schema.org. Посмотрите на все спецификации — увидите строгую иерархию в словаре данных. Все связано между собой. Ознакомьтесь со всем списком, запишите те данные, которые вам потребуются.

Посмотрим на иерархию. Внедрение микроформатов начинается с сущности Thing — общего типа всех элементов. Элемент — более конкретная сущность: авторская работа, событие, компания, личность, место, товар.

Например, фильм — это thing и авторская работа. Он относится к категории «Кино». К нему можно добавить много свойств-атрибутов:

• аннотация;
• режиссер;
• актеры;
• плакаты — изображения;
• продолжительность;
• жанр.

Таких атрибутов очень много. Уточните как можно больше информации о сущности. Но не перегружайте выдачу. Не все свойства поисковики подтягивают в расширенную выдачу. Список участвующих атрибутов уточняйте в документации Google.

Простой пример иерархии для Schema.org

Если мы расположим всю информацию о сущности в иерархическом порядке, получим следующее:

• Сущность
  • Авторская работа
    • Фильм
      • Описание (тип: текст);
      • режиссер (тип: личность);
      • актеры (тип: личность);
      • постер (тип: изображение).

Если мы работаем с описанием компании, получим что-то такое:

• Сущность
  • Организация (или место)
    • Местная компания
      • Стоматология
        • имя;
        • адрес;
        • email-адрес;
        • логотип;
        • обзор.

Для местных организаций укажите конкретный вид бизнеса. Поисковые системы сразу поймут, чем вы занимаетесь. Иногда вы можете заниматься тем, для чего нет конкретной сущности в Schema.org. Используйте Product Types Ontology, чтобы дифференцировать вашу тематику.

Есть ряд обязательных данных, которые нужно указать. Среди них — адрес и телефон компании. Есть рекомендуемые данные:

• url сайта;
• геолокация;
• часы работы.

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

Есть интересный плагин от Yoast. Инструмент платный, но он поможет вытянуть все необходимые сущности, которые вам следует разметить.

Какие данные нужно размечать

На первый взгляд, внедрение микроразметки на сайт — дело непростое. Начните с азов. Вы же уже выбрали характеристики, которые непременно нужны в расширенной выдаче о вашей компании? С них и начните. Обратите внимание на нюансы: товары и отзывы. Они просты в разметке, а преимущества от их присутствия на сниппете неоспоримые.

Как внедрить микроразметку Schema.org на сайт

Несмотря на то, что это техническая работа, все упрощает JSON-LD. Этот формат данных основан на JavaScript. Он упрощает добавление микроформатов. Вам не нужно ничего вписывать в HTML-код страниц. Внесение данных и их обновление стали простыми. А сам инструмент отлично подходит для людей — он простой и понятный, и для поисковиков — они с легкостью распознают микроформаты.

Используем JSON-LD для микроформатов

JSON-LD сегодня — предпочтительный вариант внедрения микроразметки на ресурс. Он долго не поддерживался поисковиком Bing. Но сегодня все популярные системы распознают этот формат. Ниже — листинг для микроразметки информации для SEO-плагина от Yoast.

Для простоты используется небольшой объем информации:

• тип;
• имя;
• логотип;
• описание;
• разработчик.

<script type=»application/ld+json»>
{
«@context»: «http://schema.org/»,
«@type»: «Product»,
«name»: «Yoast SEO for WordPress»,
«image»: «https://cdn-images.yoast.com/uploads/2010/10/Yoast_SEO_WP_plugin_FB.png»,
«description»: «Yoast SEO is the most complete WordPress SEO plugin. It handles the technical optimization of your site & assists with optimizing your content.»,
«brand»: {
«@type»: «Thing»,
«name»: «Yoast»
},
«offers»: {
«@type»: «Offer»,
«priceCurrency»: «USD»,
«price»: «89.00»
}
}
</script>

В конце кода есть раздел с призывом к действию купить плагин, который стоит 86 долларов.

Другие способы: RFDa и Microdata

Традиционный метод внедрения — это включение микроразметки в код страницы. Делать это было долго, сложно и муторно. Поэтому Schema.org не сразу стала популярной.

Написание микроформата и поддержка через RDFa или Microdata — боль. Старайтесь как можно чаще использовать JSON-LD.

Тем более, Microdata нуждается в функции itempops. Любой микроформат придется прописывать в HTML-коде. Читать и редактировать это крайне неудобно.

Структурированные данные и AMP

Суть технологии AMP — ускорить загрузку страниц на мобильных устройствах. Google продвигает AMP, в том числе и для структурированных данных. Хотите внедрить AMP? Добавьте структурированные данные. Система использует несколько элементов Schema.org, чтобы сохранить интерактивность в выдаче.

Инструменты для работы со структурированными данными

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

Генераторы

• Google Data Highlighter.
• Google Structured Data Markup Helper.
• JSON-LD Schema Generator by Merkle.

Валидаторы

• Yandex Structured data markup.
• Yandex Structured data validator API.
• Structured Data Testing Tool.
• Google Search Console Rich Cards.
• Google Rich Results Tester.

Плагины для WordPress

• Yoast SEO local.
• Yoast SEO.

Полезные ссылки

Большинство поисковиков имеют собственные консоли для управления сайтами. В руководствах вы найдете конкретные советы для каждой поисковой системы.

Всегда проверяйте код в разных валидаторах микроразметок. Поддерживайте работоспособное состояние.

• Руководство от Google.
• Руководство от Яндекс.
• Руководство от Bing.

Итоги

От микроформатов больше нельзя отказываться. Изучите разметку данных и подумайте, как вы можете ее применить. Правильно размеченная информация — шанс получить больше места в выдаче. Поисковые системы постоянно разрабатывают новые способы предоставления расширенных результатов поиска при помощи Schema.org.

semantica.in

Что такое семантическая разметка?

Подходящего определения на просторах Интернета мне найти не удалось, поэтому я его решил составить его из 4 наиболее подходящих определений.

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

Получилось немного замудрено… Однако из данного определения мы понимаем, что семантическая разметка – это некие правила, подчиняющиеся определенным стандартам или словарям. Которые, в свою очередь, призваны помочь поисковым системам (и не только) понимать содержимое страниц сайтов.

Давайте перечислим наиболее известные стандарты (словари) и остановимся более подробно только на двух из них, но об этом чуть позже.

Виды разметки данных

1. Data Vocabulary – стандарт разметки данных, которая разрабатывала компания Google до июня 2011 года.

   Официальный сайт: http://www.data-vocabulary.org/

   Развитие стандарта приостановлено в связи с созданием словаря Schema.org. Поисковый робот Google может использовать данные, полученные с помощью данной разметки, но рекомендации сводятся к смене стандарта на Schema.org.

2. Dublin Core, или Дублинское ядро – стандарт, разработанный в 1995 году. Семантика Дублинского ядра была создана международной междисциплинарной группой профессионалов библиотечного и музейного дела, компьютерных наук. Представляет собой набор из метатегов, 15 основных и 3-х дополнительных свойств.

   Официальный сайт: http://dublincore.org/

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

3. FOAF, или Friend of a Friend – «друг друга» – стандарт, созданный Либби Миллером и Дэном Брикли в 2000 году. Используется в основном для домашних страниц и социальных сетей. Решает задачу построения связей между людьми и объединению их.

   Официальный сайт: http://www.foaf-project.org/

4. Microformats, или же микроформаты – стандарт, созданный в 2005 году сообществом заинтересованных энтузиастов из WC3.

   Официальный сайт: http://microformats.org/

   Данный стандарт был очень популярным до появления Schema.org и на многих сайтах используется до сих пор. На момент написания статьи Яндекс поддерживает следующие Microformats: hCard – формат разметки контактов (адресов, телефонов и т.д.); hRecipe – формат описания кулинарных рецептов; hReview – формат разметки отзывов.

На следующих двух стандартах рекомендую заострить ваше внимание. Они учитываются поисковыми системами в полной мере и их использование целесообразно.

5. Open Graph – стандарт семантической разметки веб-документов, разработанный компанией Фейсбук с первоначальной целью контроля превью при размещении в социальных сетях.

   Официальный сайт: http://ogp.me/

   Русскоязычный сайт: http://ruogp.me/

   Данная разметка представляет собой набор метатегов, находящихся между элементами <head> и </head>.

   Также хочется отметить, что в стандарте Open Graph одна страница описывает только один объект – человека, продукт, фильм или другую сущность.

   Давайте рассмотрим основные теги более подробно.

   <meta property=»og:title» content=»Заголовок»/>
   <meta property=»og:description» content=»Описание страницы»/>
   <meta property=»og:image» content=»изображение.jpg»>
   <meta property=»og:type» content=»Тип обьекта»/>
   <meta property=»og:url» content= «Идентификатор адреса страницы» />

   Пример использования:

   <meta property=»og:type» content=»article» />
   <meta property=»og:title» content=»Яйца фаршированные тунцом — ********- Как готовить вкусно!» />
   <meta property=»og:description» content=»Если вам хочется порадовать себя и своих родных чем-то вкусным, легким и несложным в приготовлении блюдом, то воспользуйтесь нашим чудесным рецептом. Яйца, фаршированные тунцом, выглядят потрясающе аппетитными, на вкус – удовлетворят любого гурмана, плюс – полезны и калорий не так, чтобы много. Зато удовольствия будет с избытком. Особенно, если к готовке подключить свою «вторую половинку»,…Подробнее» />
   <meta property=»og:url» content=»http://****/recipe/yajca-farshirovannye-tuncom/»/>
   <meta property=»og:image» content=»http://***/wp-content/uploads/2016/11/Tuna-Deviled-Eggs-1-15.jpg»/>

   Получаем при шаринге в соцсетях следующее:

   

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

6. И вот, наконец, мы подобрались, на мой взгляд, к основному стандарту shema.org, который поисковые системы рекомендуют использовать (но не стоит думать, что вы можете использовать только данный формат – не забывайте, что всё зависит от целей).

   Shema.org – стандарт, разработанный 2 июня 2011 года при совместном участии ведущих поисковых систем мира (Google, Yahoo, Microsoft), а 1 ноября 2011 года к ним присоединился и Яндекс.

   Официальный сайт: https://schema.org/

   Русскоязычный сайт: http://ruschema.org/ (на данный момент содержит не все сущности).

   Прежде чем перейти дальше, рассмотрим, что такое синтаксис микроразметки.

   Синтаксис микроразметки (формат) — способ использования стандарта (словаря). Формат устанавливает, при помощи каких тегов и как будут описываться сущности и их свойства на веб-документах.

   Для shema.org на данный момент описано 3 основных синтаксиса: Microdata, RDFa и JSON-LD (рекомендуемый компанией Google).

   Но в данном случае советом от Google мы всё же рекомендуем пренебречь и использовать синтаксис Microdata. Это связано с тем, что синтаксис JSON-LD (офицальный сайт http://json-ld.org/) на данный момент используется Яндекс.Почтой, но пока не отображается в результатах поиска Яндекса (то есть сформировать расширенный сниппет в Яндексе при использовании JSON-LD у вас не получится).

Вроде со стандартом определились, с синтаксисом тоже.

Для начала определимся, какая основная цель разметки. Если вы прочитали статью о том, что с разметкой вам гарантировано место в топ-10, то это не так. Цель микроразметки – улучшить понимание сайта в глазах робота, отправить в базы знаний поисковых систем информацию, повысить CTR вашего сниппета (что косвенно может увеличить и ваш трафик и позиции). Но надо понимать, что это всё косвенные показатели. Сайты с использованием микроразметки и без неё ранжируются одинаково.

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

Более подробно разберем три наиболее встречаемых примера:

Разметка карточки товаров schema.org

Товарные карточки – размечаем по сущности Product. Реализация данного вида поможет получить нам следующий сниппет в Яндексе:

Не путать с товарным сниппетом в выдаче Яндекса, полученным при использовании .yml файла из Яндекс.Маркета или сервиса «Товары и цены» вебмастера Яндекса.

В Google:

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

Используя словарь schema.org и синтаксис Microdata, добавляем к существующему html-коду следующее.

<!—Указывается схема Product.—>
<div itemscope itemtype=»http://schema.org/Product»>
<!—В поле name указывается наименование товара.—>
<h1 itemprop=»name»>COTTON DREAMS Наволочки </h1>
<!—В поле image указывается ссылка на картинку товара.—>
<a itemprop=»image» class=»fancyboxitem» href=»/userfiles/cotton-dreams.jpeg» title=»COTTON DREAMS Наволочки » ><img src=»/userfiles/cotton-dreams.jpeg» alt=»Наволочка COTTON DREAMS «></a>
<!—В поле description дается описание товара.—>
<p itemprop=»description»>Добавьте еще больше уюта в доме с наволочками «Cotton Dreams»! …<
<!—Указывается схема Offer.—>
<div itemprop=»offers» itemscope itemtype=»http://schema.org/Offer» class=»addtocartsuc»>
<!—В поле price указывается цена товара.—>
<span itemprop=»price» content=»929.00″ class=»strong»>929,00 <small>р.</small>
<!—В поле priceCurrency указывается валюта данные выводим мета информацией так как на странице она не где не присутствует.—>
<meta itemprop=»priceCurrency» content=»RUB»>
<!—Указывается свойство InStock, которое свидетельствует о том, что товар в наличии, данные выводим также метаинформацией —>
<meta itemprop=»availability» content=»http://schema.org/InStock»/>

Разметка отзывов в товарной карточке schema.org

Отзывы о товаре или услуге размечаем по сущности Review.

<!—Указывается схема Review.—>
<div class=»comment» itemprop=»review» itemscope itemtype=»http://schema.org/Review»>
<!—В поле date указывается дата публикации отзыва.—>
<span class=»date» itemprop=»datePublished» content=»2017-03-21T08:27:00″>21.03.2017 08:27
<div class=»rating-person»>
<input type=»hidden» name=»val» value=»5″/>
<input type=»hidden» name=»vote-id» value=»Array»/>
</div>
</span>
<!—Указывается схема Rating.—>
<span itemprop=»reviewRating» itemscope itemtype=»http://schema.org/Rating»>
<!—В поле worstRating метаинформацией указываем минимально возможный рейтинг.—>
<meta itemprop=»worstRating» content = «1»/>
<!—В поле ratingValue мета информацией указываем текущий рейтинг.—>
<meta itemprop=»ratingValue» content = «5»/>
<!—В поле bestRating метаинформацией указываем максимально возможный рейтинг.—>
<meta itemprop=»bestRating» content = «5»/>
</span>
<!—Указывается схема Person.—>
<span itemprop=»author» itemscope itemtype=»http://schema.org/Person»>
<!—В поле name указываем имя автора.—>
<span itemprop=»name» class=»name»>Наталья</span>
</span>
<!—В поле reviewBody указываем сам отзыв на товар.—>
<p itemprop=»reviewBody»>Супер вещь!) Эффект сразу и налицо)</p>
</div>
</div>

Без разметки наш сниппет выглядел в Google так:

С использованием разметки по сущности Person и Review сниппет выглядит так:

Согласитесь, сниппет стал намного привлекательней. С таким сниппетом гарантированно повышение CTR.

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

Разметка рецептов по schema.org

Отойдем от коммерческой тематики и попробуем разметить сущность Recipe.

Сперва немного отвлечемся от темы и опишем историю, которая произошла с сайтом нашего клиента. Клиент обратился к нам с просьбой разметить информацию на его сайте, а именно рецепты. В соответствии со стандартом schema.org и сущностью Recipe мы это и сделали. Начали ждать положенных две недели для переиндексации ресурса. Через две недели Google сайт переиндексировал практически полностью. И отображал вот такой вот красивый сниппет:

А в Яндексе как было, так и осталось. При том, что сайт чист, без санкций, дизайн шикарный, сайт посещаем, разметка выполнена верно, в валидаторе ошибок не наблюдалось. Поискав причину ещё пару дней, решили отписать Платону.

На вопрос, почему такая ситуация с данным сайтом, мы получили следующий ответ.

У кого есть подобная проблема на кулинарных сайтах, возможно, у вас такая же причина. Каждый раз убеждаюсь, что справка – наше всё.)) Также хочется отметить качество саппорта Яндекса, выразить благодарность за оперативные ответы – переписка происходила практически в реальном времени.

Теперь перейдем к реализации разметки кулинарных сайтов.

<!—Указывается схема Recipe.—>
<div class=»single-panel» itemscope itemtype=»http://schema.org/Recipe»>
<!—В поле totalTime указывается время приготовления в формате ISO 8601.—>
</i><meta itemprop=»totalTime» content=»PT40M»/><span> 40 мин.</span></li>
<!—В поле name название рецепта или блюда.—>
<h1 itemprop=»name»>Название рецепта</h1>
<!—В поле recipeYield количество порций на выходе—>
<span itemprop=»recipeYield»>Порций 6</span>
<!—В поле ingredients количество ингредиентов рецепта (как правило, несколько) —>
<div class=»print-ingredient» itemprop=»ingredients»>
<span class=»ingredient-amount»>6шт.</span>
<span class=»ingredient-name»>Яйца</span>br> </div> <div class=»print-ingredient» itemprop=»ingredients»>
<span class=»ingredient-amount»>400гр.</span>
<span class=»ingredient-name»>Сахарный песок</span>
</div>
……………………И т.д ингредиенты……………………………
<div class=»print-ingredient» itemprop=»ingredients»>
<span class=»ingredient-amount»>100гр.</span>
<span class=»ingredient-name»>Какао</span>
</div>
<!—В поле description дается описание рецепта.—>
<div class=»single-content-self» itemprop=»description»>
<p>Торт Черепаха готовится не трудно, к тому же он бесспорно станет любимым тортом для ваших детей, поскольку выглядит он как симпатичная черепашка.</p>
</div>
<!—В поле recipeInstructions инструкция по приготовлению.—>
<table class=»recipe-steps-table» itemprop=»recipeInstructions»>
<!—В поле image изображение процесса приготовления, может быть несколько. Рекомендуем указать данное поле для формирования улучшенного сниппета.—>
<img itemprop=»image» src=»/адрес изображения.jpg» alt=»»>
<p>…….</p>
</table>
<!—В схема nutrition описывается энергетическая или пищевая ценность блюда—>
<div class=»single-nutritions-list» itemprop=»nutrition» itemscope itemtype=»http://schema.org/NutritionInformation»>
<!—В поле calories указывается калорийность блюда—>
<div class=»single-nutrition-value» itemprop=»calories»>2100</div>
</div>
<!—В поле author указывается указывается автор, написавший данный рецепт—>
<h3 class=»author-name» itemprop=»author»><a rel=»nofollow» href=»****/»>Victory</a></h3>
…..
</div>
</p>
<p><a class=»photos p-zoom» href=»/files/blog/2017/social-partners_13.jpg» rel=»imgs»>
<img class=»shadowed» src=»/files/blog/2017/social-partners_13-mini.jpg» alt=»Формат опенграф шаринг в Фейсбук»>
<span class=»zoom»></span> </a>

В Гугле наш красивый сниппет:

Мы разместим скриншот снипетта в Яндексе, когда информация обновится (ориентировочно через две недели).

UPD от 05.06.2017: Как и обещали, добавляем скрин из Яндекса:

1ps.ru