Что такое микроразметка

Что такое микроразметка

Микроразметка — это специальные теги и атрибуты в HTML-коде страницы, которые помогают поисковым системам распознавать и структурировать информацию. То есть микроразметка делает контент понятным как для людей, так и для алгоритмов поисковиков.

Рассмотрим подробнее на примере интернет-магазина. Если вы просто разместите информацию на странице, поисковик увидит текст, но не поймет, где название товара, где цена, а где отзывы. А при внедрении микроразметки система сможет:

• выделить и показать цену в поисковой выдаче;
• определить рейтинг товара и вывести его в сниппете;
• разместить быстрые ссылки на разделы, например, “Характеристики” или “Отзывы”.

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

Обработка данных поисковыми системами

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

Поисковые системы отдают предпочтение страницам, которые содержат четко структурированные данные, поскольку такие сайты удобнее для пользователей. Например, если у интернет-магазина на карточке товара есть разметка Product с атрибутами Review и AggregateRating, поисковик сможет понять, что на странице размещены отзывы, и автоматически выведет средний рейтинг товара в поисковые результаты.

Создание расширенных сниппетов

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

Повышение видимости сайта

Прямого влияния на позиции в поиске микроразметка не оказывает, но косвенно она улучшает поведенческие факторы, которые поисковики учитывают при ранжировании. Например, один из ключевых преимуществ микроразметки — повышение кликабельности (CTR). По данным Google, сайты, использующие структурированные данные, могут увеличивать CTR на 25-35%. Частично это как раз связано с расширенными сниппетами, которые выглядят привлекательнее стандартных описаний. Если пользователь сразу найдет в выдаче полезную информацию, то с большей вероятностью кликнет именно на этот сайт. Благодаря этому в перспективе у сайта будет низкий показатель отказов, а время, проводимое читателями на сайте, увеличится.

Словари микроразметки

Добавляя микроразметку на сайт, необходимо указать поисковым системам, что именно размечается: статья, товар, отзывы или другая информация. Для этого существуют словари — наборы специальных классов и свойств, которые структурируют данные и определяют, как именно описывать содержимое страницы. Это своего рода язык, понятный только поисковым роботам. Им можно обозначить ключевые элементы страницы: название, описание, цену, контакты, рейтинги, время работы и многое другое. Словарь задает тип объекта (статья или товар) и его свойства (цена товара или имя автора статьи). Использование словарей помогает алгоритмам точно понимать информацию и корректно отображать ее в поисковой выдаче. Главное — определить подходящий для сайта вид словаря.

Schema.Org

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

• Article — статьи, новости, блоги;
• Product — товары и карточки в интернет-магазинах;
• Review — отзывы и рейтинги;
• Recipe — рецепты с ингредиентами и временем приготовления;
• Event — мероприятия с датами, адресами и билетами;
• Organization — информация о компании с контактными данными и ссылками на соцсети.

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

OpenGraph

Словарь разработали в Facebook*, чтобы улучшить демонстрацию контента при его расшаривании в социальных сетях. Сегодня этот стандарт также поддерживают ВКонтакте, Telegram, Pinterest и другие площадки. Основная цель OpenGraph — сделать контент более привлекательным и корректно его отобразить для пользователей. Например, когда вы делитесь ссылкой в соцсетях, инструмент показывает правильные заголовок, описание, изображения и другие данные, собирая информацию в пост с эстетичным визуальным оформлением. Также словарь используют для публикации статей в блогах и СМИ, размещения карточек в интернет-магазинах, создания лендингов и так далее.

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

Микроформаты

Один из самых старых стандартов микроразметки, разработанный для использования с базовыми элементами HTML. Инструмент сочетает в себе не только словарь, но и синтаксис, что делает разметку максимально удобной для интеграции. Однако микроформаты постепенно теряют популярность, поскольку в сравнении со Shema.org и OpenGraph имеют ограниченные возможности. Например, вы не сможете разметить сложные объекты, а еще при внедрении микроформатов нельзя использовать другие словари. Однако стандарт подходит для небольших сайтов, поскольку не требует долгой настройки.

Инструмент применяет базовые HTML-теги, добавляя в них специальные классы, чтобы обозначить определенную информацию. Например, атрибут hCard используется для разметки контактной информации в виде адреса, телефона, электронной почты и других данных. А если нужно просто разместить информацию о компании, достаточно атрибута class=”vcard:

Виды синтаксиса

Синтаксис микроразметки — это способ ее внедрения в HTML-код страницы. Он определяет, как именно следует добавлять структурированные данные, чтобы поисковые системы могли корректно их интерпретировать. В зависимости от целей, удобства разработки и предпочтений поисковиков используются различные виды синтаксиса:

• JSON-LD. Подходит для разметки в словаре Schema.org и позволяет добавлять информацию в виде объекта JSON внутри тега <script> в <head> или <body> страницы. Этот синтаксис используют Google для поиска и “Яндекс” для “Почты” и мобильного поиска. Формат не перегружает HTML-код и легко обновляется, а также не требует внесения изменений в структуру сайта, что делает его удобным для веб-разработчиков.
• RDFa. Применяют в рамках словаря Open Graph, чтобы сформировать привлекательный сниппет для социальных сетей.
• Микроданные. Встраивает структурированные данные непосредственно в HTML-код с помощью специальных атрибутов, а также позволяет помечать конкретные элементы страницы, добавляя к ним специальные теги: itemscope, itemtype и itemprop.

Реализация микроразметки

Микроразметка статей

В этом случае используются атрибуты структурированных данных типа Article:

• author — указывает автора материала;
• datePublished — отображает дату публикации;
• headline — указывает роботам на заголовок статьи;
• image — показывает изображения, связанные с текстом статьи.

Хлебные крошки

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

Микроразметка карточек товаров

Структурированные данные со стоимостью и описанием товара будут отображаться в выдаче при корректном размещении нужных блоков. Карточка должна содержать разметку Product со свойством Offer для одного предложения или AggregateOffer для нескольких предложений.

Микроразметка отзывов

Для размещения отзывов на сайте используют атрибуты и теги типа Review:

• author — имя автора;
• reviewRating — оценка, которая содержится в отзыве;
• datePublished — дата публикации;
• reviewBody — сам текст.

Как проверить корректность микроразметки

Валидатор структурированных данных от Google

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

Инструмент проверки микроразметки от “Яндекс”

Валидатор проверяет, как “Яндекс” обрабатывает микроразметку: анализирует страницу и показывает, какие структурированные данные видит поисковик, а также отображает возможные ошибки.

Сервис проверки разметки Schema.org

Официальный инструмент от разработчиков микроразметки проверяет корректность разметки JSON-LD, Microdata и RDFa, но при этом не показывает, как данные будут выглядеть в поисковой выдаче. Однако если в коде используются устаревшие атрибуты, валидатор предложит обновить их до актуальных стандартов.

Внедрение микроразметки в структуру страниц имеет множество преимуществ: от улучшения поведенческих факторов до роста поискового трафика и доверия пользователей к сайту. Однако создать правильную разметку и повысить привлекательность веб-ресурса для поисковых систем под силу только SEO-специалистам. Чтобы не тратить ресурсы и бюджет на исправление ошибок, лучше сразу обращаться к профессионалам. Команда “Пользы” разработает грамотную микроразметку для сайта любого типа. Поэтому если вы планируете продвигать бизнес в интернете — обращайтесь к нам, в том числе, и за SEO.

* — Компания Meta (Instagram и Facebook) признана экстремистской и запрещена на территории России с 21.03.2022