Микроразметка помогает поисковикам лучше понимать содержимое страниц сайта, повышать их информативность в поисковой выдаче, легче находить ресурс при голосовом поиске. В этой статье длинную историю зарождения разных форматов затрагивать не будем. Рассмотрим, какие технологии поддерживаются поиском Google и Яндекс, способы создания микроразметок, конструкторы и плагины для CMS.
Расширенный сниппет с рейтингом
Содержание:
что важно знать;
- синтаксис JSON-LD;
- Schema.org;
как создать и установить микроразметку;
- генератор Webcode tool;
- генераторы Microdata + Schema.org;
- мастер разметки структурированных данных Google;
- плагины и модули для CMS;
заключение.
Что важно знать
С помощью микроразметки можно указать в сниппете:
- контакты;
- раздел вопросов и ответов;
- цену товара, наличие, отзывы;
- список событий;
- видео;
- строка поиска по сайту;
- рейтинг;
- навигацию «хлебные крошки».
Микроразметка — это синтаксис и словарь. Вместе они диктуют, какие классы, свойства и теги использовать для расширенных сниппетов. Структурированные данные не участвуют в отрисовке веб-страницы в пользовательских браузерах. Они добавляются на страницу в виде дополнительных тегов и атрибутов или отдельным блоком в тег <head>.
Популярные словари:
- Schema.org совместим с большинством синтаксисов, учитывается всеми поисковиками;
- Open Graph продукт Facebook, основанный на синтаксисе RDFa.
Популярные синтаксисы:
- микроданные описывают содержимое страниц используя HTML-разметку и словарь Schema.org. Microdata поддерживается Google и Яндекс, но делает код громоздким и объемным;
- микроформаты являются одним из синтаксисов микроразметки с собственным словарем. Они тоже внедряются на уровне HTML-кода. При составлении сниппета Google учитывает все форматы, Яндекс только hCard и hRecipe;
- RDFa используются вместе с Open graph для разметки сайта в социальных сетях. Благодаря разметке репосты с сайта в соцсети отображаются с корректным форматированием. С помощью RDFa задается изображение, заголовок и другие параметры;
- JSON-LD рекомендуется к использованию компанией Google и лишен недостатков предыдущих синтаксисов: он компактный, его легче редактировать, нет необходимости добавлять дополнительные теги и атрибуты. Яндекс поддерживает только навигационные цепочки.
Раньше часто использовали словарь Data vocabulary, но он устарел и с 29 января 2021 года не поддерживается Google.
Синтаксис JSON-LD
JSON — JavaScript объект, который размещается между открывающим и закрывающим тегом <script type="application/ld+json" >… </script>. При отрисовке страницы браузер проигнорирует этот тег, но его заметит поисковой бот Google. Объект состоит из пар ключей и значений, перечисляемых через запятую. И ключ, и значение оборачиваются в кавычки, между ключом и значением стоит знак двоеточия.
{"name": "Tor Odinson", "spouse": "http://test.ru/resource/Jane_Foster"}
Schema.org
С помощью этого словаря поисковым ботам сообщаются какие данные использовать для отображения сниппетов. Схема поддерживается Google, Яндекс, Yahoo и Bing. Официальная документация словаря на английском языке. Перевод на русский можно найти на ruschema.org. Документация рекомендует использовать схему в связке с микроданными.
Этот словарь разметки использует три основных атрибута:
- itemscope — обозначает ботам, что дальше идет описание сущности;
- itemtype — указывает тип сущности из официального словаря;
- itemprop — добавляет свойство, которое необходимо описать.
Пример разметки для статьи Schema.org + Microdata
Как создать микроразметку
Писать разметку вручную трудоемкая задача. Проще и надежнее воспользоваться онлайн-инструментами. Если сайт на CMS — можно подобрать плагин.
Генератор Webcode tools
Генератор web code tools
С помощью этого инструмента можно создать микроразметку в формате JSON-LD и Open Graph. Достаточно выбрать тип разметки, который необходимо внедрить и заполнить поля. Система выдаст готовую разметку, ее необходимо проверить в валидаторах и поместить на HTML-страницу между открывающим и закрывающим тегом <head>.
Слева пустая страница, справа вставлена разметка для статьи
Генераторы Microdata + Schema.org
Searchbloom
Генераторы микроданных:
- Microdatagenerator — подходит для микроразметки локального бизнеса;
- HTML Strip — для разметки бизнеса, информации о веб-сайте и человеке;
- Searchbloom — используется для разметки хлебных крошек, информации о человеке, организации, статей и видео.
Все три инструмента выдают результат в формате Microdata и JSON-LD. Searchbloom превосходит остальные инструменты по функционалу, но он способен создавать микроразметку не для всех форматов, поэтому приходится дополнять другими инструментами. Полученные микроданные необходимо скопировать, найти на сайте размеченный участок и заменить содержимым из генератора.
Мастер разметки структурированных данных Google
Составление структурированных данных Google
Мастер разметки полезен, когда стоит задача создать структурированные данные только для Google. Доступно 12 типов данных, включая продукты, статьи, приложения и отзывы. Необходимо выбрать тип, задать ссылку на страницу или скопировать HTML-файл. После этого в том же окне откроется сайт, где можно выделять элементы следуя подсказкам. После того, как все обязательные элементы выделены, необходимо нажать на «Создать HTML».
Получение структурированных данных
Система по умолчанию создает разметку в формате JSON-LD и Microdata. Первый вариант компактнее и легче добавляется на страницы сайта. Если переключиться на микроданные, придется скопировать код из окна и заменить содержимое страницы на сайте.
Плагины и модули для CMS:
- WordPress: All in one SEO размечает в формате микроданных, поэтому подходит как для Google, так и для Яндекс. Schema.org размечает в формате JSON-LD. Open Graph для одноименного словаря;
- Opencart 3: Oc3x extensions поддерживает синтаксисы Microdata и JSON-LD, Open Graph Meta для микроразметки соцсетей;
- Joomla: WT Schema.org for JoomShopping для разметки категорий товаров в JSON-LD. JFBConnect для соцсетей;
- Drupal: LD JSON добавляет структурированные данные в формате JSON-LD, Metatag используется для создания метатегов и микроразметки Open Graph;
- PrestaShop: Schema Markup устанавливает структурированные данные в формате JSON-LD, Tags Social Networks создает микроразметку в Open Graph.
Заключение
Микроразметка с помощью синтаксиса JSON-LD позволяет не редактировать существующую HTML-разметку страницы, но Яндекс пока не начал поддерживать этот формат и понимает только «хлебные крошки». Микроданные поддерживаются поисковыми роботами Google, и Яндекс. RDFa необходим для соцсетей. Полученную из генераторов разметку желательно проверять до и после публикации через валидаторы микроразметки Google, Яндекс.
