Микроразметка страниц. Полное руководство по работе со структурированными данными. Что такое itemscope и itemtype и для чего они нужны

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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


{
"@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"
}
}

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

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

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

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

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

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

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

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

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

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

Итоги

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

Привет, дорогие читатели блога!

Хочу вам рассказать, еще об одном эффективном способе вашего сайта. Речь в сегодняшней статье пойдет о том, что такое микроразметка Shema.org, как ею пользоваться и каким образом она влияет на продвижение сайта.

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

Что такое микроразметка сайта?

Несколько лет назад, самые крупные компании Яндекс, Google, Yahoo и Bing заявили о внедрении новых технологий в свои поисковые системы. С тех пор семантическая разметка Shema.org помогает роботам наиболее точно обработать, распределить и понять информацию на интернет-ресурсах, чтобы потом выдать эти данные пользователям в поисковой выдаче.

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

Вот один из примеров, который приводит Яндекс:

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

Для чего нужна микроразметка сайта?

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

Проверка микроразметки Яндекс и Гугл

Для того чтобы проверить микроразметку в Яндексе вам потребуется зайти в панель Яндекс Вебмастер и перейти по ссылке «Проверить микроразметку», либо «Валидатор микроразметки».

Для того чтоб провести валидацию микроразметки (проверку), нужно ввести в отведенное для этого поле url страницы сайта. Чтобы проверка была доступной, нужно зарегестрироваться в Яндекс Вебмастере.

Google микроразметка проверяется по адресу: google.com/webmasters/tools/richsnippets .

Проверка здесь проходит по тому же принципу, что и в Яндекс.

Для начала вам нужно просто проверить, не была ли установлена на вашем блоге микроразметка автоматически. Обычно такое бывает при использовании бесплатных шаблонов WordPress. Такие разметки нужно будет удалять перед внедрением разметки Shema.org.

Микроразметка WordPress с плагином и без

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

Обычно микроразметка WordPress осуществляется путём внедрения специальных атрибутов в начальный HTML-код.

На примере ниже можно увидеть отличие кодов с разметкой и без:

На сайте ruschema.org/docs/gs приведен пока неполный список стандартов Shema на русском языке. В этой статье я приведу примеры только начальных атрибутов для разметки контактов, картинок, комментариев, статьи.

Как сделать микроразметку сайта? Атрибуты для header

Начнем с файла header.php, который отвечает за обзор информации в шапке сайта.

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

Выглядит он так: itemscope itemtype="https://schema.org/WPHeader"

Очень важно его правильно вставить в код файла, иначе шаблон может перестать работать.

Находим тег, отвечающий за вывод шапки сайта. У меня это

После вставки атрибута, он должен выглядеть так:

Затем в файле шапки сайта нужно найти строки, которые выдают описание и название сайта.

Они могут выглядеть так:

1 2