Поисковые роботы с каждым апдейтом все лучше и лучше понимают содержимое страниц в интернете, но без микроразметки они делают это менее эффективно. В статье разберем, как сделать микроразметку в микроданных и JSON-LD самостоятельно.
Микроразметка нужна для поисковиков. Google и «Яндекс», которые лучше понимают содержание сайтов, если указать им куда «смотреть». Например, что на странице находится товар определенного бренда, у которого есть характеристики, cтоимость, рейтинг.
Пример микроразметки. Сущность «AggregateRating» указывает на наличие рейтинга у компании
Стандарт семантической разметки данных называется Schema.org. Он появился более в 2011 году с подачи поисковиков Google, Yahoo и Microsoft. Все современные поисковики ее поддерживают, включая «Яндекс».
Одно из преимущество микроразметки — расширенный сниппет. Она делает карточку сайта более заметной, что в теории может повысить количество кликов. Правда, не факт, что поисковик выдаст сниппет, но робот в любом случае считает его данные. Подробнее — в статье «Как сделать расширенные сниппеты в выдаче „Яндекса“ и Google».
Карточки, которые получили расширенный сниппет в выдаче Google из-за наличия разметки
Микроразметка прямо не влияет на выдачу, но более структурированные описания сайтов могут подниматься выше. Например, вот как «Яндекс» использует данные из разметки:
Для товаров, медиа, рецептов, организаций формируются специальные сниппеты.
Для вопросов и ответов поиск выделяет лучшие ответы.
Изображения и видео с разметкой лучше предоставляются в поиске.
В Google разметка позволяет более точнее анализировать данные сайта и открывает особые функции.
Читайте также: Поведенческие факторы: накрутить или улучшить сайтSchema.org — не единственный стандарт микроразметки. Кроме него, существует другие:
Microformats. Открытый стандарт, который появился в 2007 году. Изначально был простым, но сейчас с ним взаимодействовать не так эффективно, как с Schema.org.
The Open Graph protocol. Разметка для соцсетей, чтобы правильно считывать данные из шапок статей во время репоста в ленту.
«Дублинское ядро». Разметка для электронных библиотек и документов.
FOAF. Используется для нетворкинга в интернете и поиске связей между людьми.
Далее будем только Schema.org, как наиболее популярный. У него четыре вида синтаксиса (микроданные, RDF, микроформаты, JSON-LD), но нас интересуют только два:
Микроданные. Работает на HTML. Принцип строится на создании «контейнеров» и помещении в них данных.
JSON-LD. Работает на JavaScript. Принцип написания — давать команды словарю. Содержит меньше строчек кода, рекомендован Google и виден только поисковым роботам.
Важно: Schema.org — это словарь, а, например, JSON-LD — это ситаксис. Синтаксис — это набор тегов и правил для обращения к словарю. У каждого синтаксиса он свой.
Google рекомендует использовать JSON-LD, но «Яндекс» его не поддерживает. Валидацию в обоих поисковиках проходят оба, поэтому для сайтов лучше ставить .
Микроразметка создается тегами с помощью дополнительных атрибутов. Чтобы использовать микроразметку знать код не обязательно. В помощь — маркеры, сервисы и плагины.
У Google есть «Мастер разметки структурированных данных». В нем вы указываете сайт или HTML-код, выбираете сущность и прописываете данные. После — выгружаете готовый код и вставляете в шапку сайта.
Плюсы:
Можно загрузить ссылку на сайт и разметить теги прямо на ней.
Простая визуализация и интуитивно понятный интерфейс.
Код можно выгрузить в микроданных или JSON-LD.
Минусы:
Ограниченное число сущностей.
Микроразметка статьи в «Маркере данных»
Кроме «Мастера» существует инструмент «Маркер» с расширенным функционалом. Для его использование нужно подключить свой сайт к сервису Google Search Console, внедрение кода будет происходить автоматически.
Если ваш сайт работает на WordPress, «Битриксе» или «Тильде», то для вас уже подготовлены удобные плагины или инструкции:
All In One Schema Rich Snippets — бесплатный плагин для WordPress, размечает Schema в семантике микроданных (microdata).
Schema — плагин для WordPress, размечает в JSON-LD. Есть бесплатная версия с ограниченными функциями.
Микроразметка Schema.org — плагин для ресурсов, созданых на «1С-Битрикс».
Инструкция — для сайтов на Tilda.
Готовая микроразметка в шапку страницы внутри тегов <head> </head>. Полный список всех атрибутов и сущностей есть на сайте Schema.org. В JSON-LD для сущностей используют команды @contex, @type, а свойства указывается через кавычки.
Каркас для микроразметки JSON-LD
Набирать код в JSON-LD вручную не обязательно, есть генераторы:
Schema Markup Generator. Бесплатный конструктор, набор сущностей ограничен.
Schema App. Платный конструктор, поддерживает все сущности.
Конструктор микроразметки в JSON-LD
В микроданных (microdata) сущности указывают через команду itemscope, а itemtype и itemprop помогают определить тип и значение.
Каркас для микроданных (microdata) в Schema
Если в случае JSON-LD прописывать вручную код не обязательно, то для микроданных (microdata) нормальных конструкторов и сервисов нет — вам придется писать код самостоятельно, либо обратиться к верстальщику. Найти специалиста поможет сервис Workspace — сделайте техническое задание, бесплатно разместите его в разделе «Задачи» и выбирайте исполнителей по откликам.
Перед тем, как вставлять код на сайт, его нужно проверить. Если будет даже одна ошибка, то поисковый робот не считает всю разметку.
Используйте валидаторы:
Schema Markup Validator. Рекомендованный сервис от Google для проверки кода или сайта с микроданными (microdata) или JSON-LD. Показывает структурность данных.
Валидатор микроразметки. Сервис от «Яндекса» для проверки кода или сайта с микроданными (microdata). Умеет показывать структуру списком.
Онлайн валидатор JSON. Простой сервис для быстрой проверки кода на JSON-LD.
Как проверять код? Загрузите сайт или код, нажмите тест и проверьте результат. В случае обнаружение ошибки валидатор подскажет, в чем проблема и на какой строчке. Например, на скриншоте ниже не указан тип данных, чтобы это исправить, нужно поставить сущность «отель» или «организация».
Проверка микроразметки с помощью валидатора
Разберем основные типы сущностей и код.
Микроразметка указывает на адрес и контактную информацию организации. Посмотреть полный список можно на стра разметку для комнаты в отеле на странице Hotel и в подробном гайде Markup for Hotels.
Пример в микроданных (microdata) Schema.org. Можно использовать общий тип «Organization», либо указать точную сферу деятельности. Используем, например, отель. Обратите внимание на атрибут address и его вариации — это может быть Locality (город), Region (область), Country (страна). Также можно добавить координаты с помощью атрибута «geo».
Микроразметка в микроданных (microdata) Schema.org для организаций
Микроразметка в JSON-LD для организаций
Для разметки используют тип данных Product. Это может быть телефон, билет на концерт, запись в салон красоты или цифровой товар.
Пример в микроданных (microdata) Schema.org. Полезные атрибуты:
aggregateRating — указывает рейтинг товара
offers — указывает на продажу товара
priceCurrency и price — показывает тип валюты и стоимость
availability — говорит о наличии товара. Например, In Stock (в наличии), Out Of Stock (нет в наличии). Есть еще другие варианты: Online Only, Pre-order, Sold out и т. д.
Разметка в микроданных (microdata) Schema.org для товара
Разметка в JSON-LD для товара
Разметка по shema.org помогает поисковым работам выделиль ключую информацию о рецепте — ингредиенты, количество калорий, время приготовления.
Пример в микроданных (microdata) Schema.org. Атрибуты prepTime, cookTime и totalTime покажут время на готовку — данные ставятся в формате AM и PT. Описание можно сделать через recipeInstructions или HowToStep.
Микроразметка для рецепта в микроданных (microdata)
Микроразметка для рецепта в JSON-LD
Атрибуты указывают на название статьи, автора статьи, дату публикации. Подробнее об этой разметке и полный список атрибутов смотрите в разделе Article.
Пример в микроданных (microdata) Schema.org. Наиболее часто используют Article, как универсальный тип данных. Кроме него существует:
NewsArticle. Для новостных и обновляемых публикаций.
BlogPosting. Для публикаций в блог.
Пример разметки статей в микроданных Schema.org
Пример разметки статей в JSON-LD
Эта сущность помогает указать подразделы сайта — будет актуально для маркетплейсов, онлайн-магазинов и сайтов-каталогов.
Выдача «хлебных крошек» с микроразметкой и без нее
Посмотреть атрибуты можно на странице BreadcrumbList, а в нашей статье «Все о „хлебных крошках“» рассказываем, как их делать.
Пример в микроданных (microdata) Schema.org.
Указываем тип «BreadcrumbList» и далее через ListItem ставим позицию, название и ссылку на подраздел сайта.
Микроразметка (microdata) хлебных крошек в Schema.org
Микроразметка хлебных крошек в JSON-LD
Наличие отзывов и их содержание часто напрямую влияет на решение о покупке. Исследование AliExpress показало, что каждая пятая покупка в интернете была совершенно именно из-за отзывов. Микроразметка поможет поисковым роботам найти рейтинги, дату публикации и авторов отзывов. Полный список атрибутов — в разделе Review на сайте schema.org.
Пример в микроданных (microdata) Schema.org. На примере ниже размечен автор, дата публикации и «тело» комментария. Обратите внимание на атрибут reviewRating (Rating): он позволяет выставить оценку, указов диапазон и общее колличество отзывов.
Микрораазметка (microdata) отзыва в Schema.org
Микроразметка отзыва в JSON-LD
Посмотреть все атрибуты можно в разделе FAQPage. Также существует QAPage, где ответы или отзывы опубликованы от лица пользователей. Также обратите внимание на HowTo — ее атрибуты позволяют разметить шаги в инструкции.
Пример в микроданных (microdata) Schema.org. Количество ответов может быть любым, но вряд-ли стоит добавлять более десяти. За формирование вопросов и ответов отвечает связка mainEntity + acceptedAnswer.
FAQ-микроразметка может выводиться как расширенный сниппет в Google
Микроразметка вопросов и ответов в Schema.org
Разметка FAQ в JSON-LD
Микроразметка события поможет показать поисковым роботам где будет проходить мероприятие, сколько оно стоит и как купить билеты.
Разметка показывает дату, место и цену мероприятия, выводится первой в сниппете
Пример в микроданных (microdata) Schema.org. Уникальная черта микроразметки для событий — указание даты начала и конца мероприятия. В остальном используются атрибута Place и Offers, которые мы приводили в примерах для организаций и товаров. Полный список атрибутов — в Event.
Микроразметка (microdata) для сайта мероприятия
Микроразметка для сайта мероприятия в JSON-LD
Помогает проиндексировать картинки, изображения и иллюстрации.
Пример в микроданных (microdata) Schema.org. За разметку картинок отвечает ImageObject. Он позволяет быстрее выводить их в поиске, а еще добавлять спецификацию фотографий по выдержке, формату, дате, локации и т.д.
Микроразметка (microdata) картинок в Schema.org
Микроразметка изображений в JSON-LD
За разметку видеороликов отвечает VideoObject. В Google микроразметка может дать расширенный сниппет, если указать ключевые моменты ролика через атрибуты Clip или SeekToAction.
Микроразметка видеоролика с ключевыми моментами
В «Яндексе» есть возможность выводить плеер в поиск атрибутом embedUrl. Правда, он доступен только для хостингов, у которых более 500 роликов.
Пример в микроданных (microdata) Schema.org.
Микрразметка видео в Schema.org
Микроразметка видео в JSON-LD
Основные тезисы материала:
Микроразметка позволяет поисковым роботам эффективней проверять страницы и создавать расширенные сниппеты.
Schema.org — это словарь, который содержит описание всех сущностей в микроразметке.
Существует несколько видов синтаксиса Schema.org, самые популярные — микроданные (microdata) и JSON-LD.
Google и «Яндекс» поддерживают любой синтаксис Schema.org, но для Google лучше размечать через JSON-LD, а для «Яндекс» — через микроданные (microdata).
Используйте сервисы и плагины для автоматического создания кода в JSON-LD.
Для создания кода в микроданных (microdata) используйте ручной метод или ищете специалистов через сервис Workspace.
Проверяйте микроразметку через валидаторы перед публикацией. Наличие одной ошибки делает нечитабельным весь код для поисковых роботов.
Подпишитесь на ежемесячную рассылку Workspace
Отлично! Мы отправили письмо на указанный вами электронный ящик с инструкцией по подтверждению.
Если письмо с подтвержением вашего e-mail не будет получено в течение 10 минут, пожалуйста, проверьте папку СПАМ в соответствующем почтовом ящике.