Поисковые роботы с каждым апдейтом все лучше и лучше понимают содержимое страниц в интернете, но без микроразметки они делают это менее эффективно. В статье разберем, как сделать микроразметку в микроданных и 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.
Читайте также:
Самые популярные CMS в Рунете
Готовая микроразметка в шапку страницы внутри тегов <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.
Как проверять код? Загрузите сайт или код, нажмите тест и проверьте результат. В случае обнаружение ошибки валидатор подскажет, в чем проблема и на какой строчке. Например, на скриншоте ниже не указан тип данных, чтобы это исправить, нужно поставить сущность «отель» или «организация».
Проверка микроразметки с помощью валидатора
Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.
Заполнить заявку
12335 тендеров
проведено за восемь лет работы нашего сайта.
Разберем основные типы сущностей и код.
Микроразметка указывает на адрес и контактную информацию организации. Посмотреть полный список можно на стра разметку для комнаты в отеле на странице 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.
Проверяйте микроразметку через валидаторы перед публикацией. Наличие одной ошибки делает нечитабельным весь код для поисковых роботов.
