Микроразметка товаров с примерами и инструкцией
1247
25 Июня 2020
Микроразметка товаров – набор дополнительных тегов, благодаря которым поисковики могут корректно понимать содержимое страницы. Простое внедрение структурных элементов HTML-кода, позволит выделиться на фоне конкурентов, но обо всем по порядку.
Зачем нужна микроразметка для товаров?
В поисковой выдаче, страница представляется в виде сниппета – заголовка, описания товара и т.д. Также в него могут входить другие элементы:
- Изображение,
- Рейтинг,
- Цена,
- Общая информация о товаре (наличие, бренд, модель, способы доставки и т.д.).
Но чтобы поисковый робот смог правильно отделить ту или иную информацию на странице, используется микроразметка товаров. В последующем, на основе классификации данных, поисковая машина формирует сниппет страницы, который положительно влияет на CTR.
Сниппет каждой страницы сайта имеет свой показатель кликабельности (CTR), который рассчитывается как соотношение показов к кликам.
Глядя на эту схему, становится ясным, что привлекательность сниппета – один из ключевых факторов, влияющих на посещаемость сайта (при условии, что он попал в выдачу). Оформить карточку страницы в поисковой выдаче можно с помощью микроразметки, указав роботу на основные элементы товара. Таким образом, CTR можно существенно увеличить, замотивировав пользователя перейти на сайт. В некоторых случаях это может положительно повлиять на SEO ранжирование сайта (при условии, что страница, на которую ведет карточка, полностью релевантна запросу пользователя).
На сегодняшний день, когда большинство коммерческих ниш перегреты и ведется нешуточная борьба за поисковый ТОП, красиво оформленный сниппет является больше необходимостью, чем излишним перфекционизмом.
Основные виды микроразметки
Каждый вид имеет свой синтаксис, а также предназначается для решения определенных задач.
- Schema.org – популярный стандарт семантической разметки, который понимают все основные поисковики. Именно о нем пойдет речь в этой статье.
- Open Graph – технология от Facebook, позволяет публиковать ссылки с расширенной информацией о странице. Преимущественно, это нужно для красивого отображения ссылки в социальных сетях. На сегодняшний день эту микроразметку поддерживают все крупные соц. сети: ВКонтакте, Twitter, Facebook, Telegram и т.д.
Внедряем микроразметку для интернет-магазина
Настраивать микроразметку Schema.org нужно непосредственно в HTML-коде сайта. Сделать это можно либо вручную, установив код, либо используя специальные плагины, если сайт работает на готовой CMS.
Код разметки устанавливается внутри тегов <body>, а во внутрь каждого из свойств подставляется динамический параметр товара. Готовые же плагины, особенно для популярных движков сайтов, автоматически генерируют код для каждой страницы.
Как отмечалось выше, в сниппет можно поместить: название товара, категорию, цену, изображение, отзывы и его рейтинг. Согласно инструкции Яндекса, рекомендуется придерживаться следующих схематических связок:
- Product и Offer – в первом случае речь идет о самом товаре, во втором о предложение. Например, параметры смартфона, и его ценовые характеристики. Оба этих варианта используются, когда предлагается на одной странице единичный товар или услуга.
- Product и AggregateOffer – подходит для агрегаторов, сайтов, которые собирают несколько предложений из разных источников. К примеру, продажа телефона, но по факту его можно приобрести в разных местах. Агрегатор для удобства собирает цены и характеристики товара в одном месте. Хочется отметить, что на странице может быть размещен один товар, если это условие игнорируется, то сниппет по микроразметке не будет формироваться.
Примеры контейнеров
Сюда вставляется код с информацией о товаре
Код, связанный с ценой товара
Разметка для страницы товаров
В микроразметке у карточки товара есть несколько свойств:
- Name (Text) – название, присваивается к схеме Product.
- Description (Text) – описание, также присваивается к Product.
- Price (Number) – цена, относится к Offer.
- LowPrice (Number) – наименьшая цена со страницы агрегатора, относится к схеме AggregateOffer. В сниппете это значение будет отображаться как «от N руб.» (или другая валюта).
- PriceCurrency (Text) – валюта, может использоваться как в Offer, так и в AggregateOffer. Допускается использование кодов валют в соответствии с ISO 4217.
- Availability – свойство Offer, сигнализирует о наличии или отсутствии товара. При этом если товара нет в наличии, то цена автоматически скрывается из сниппета.
- Image (Text) – адрес, по которому находится картинка товара (URL).
Список дополнительных свойств, которые можно применить к товару:
- Brand (Text) – бренд.
- Model (Text) – модель товара.
- Seller (Text) – продавец.
- AvailableDeliveryMethod (Text) – метод доставки.
XIAOMI Mi 9t 64Gb
XIAOMI Mi 9t 64Gb – красивый и стильный смартфон, с топовой начинкой и современными функциями безопасности.
24990 RUBВ наличии
Микроразметка и «хлебные крошки»
Хлебные крошки показывают вложенность товара в общей структуре сайта. Например, «Адрес сайта>Смартфоны>Xiaomi> Xiaomi Mi9t», эту конструкцию можно вынести в сниппет, тем самым улучшив его вид. Для этого применяется свойство «BreadcrumbList» (дочерний элемент ItemList):
Разметка каталога товаров
Не рекомендуется использовать схемы Product и AggregateOffer для разметки категорий. Некоторые вебмастера злоупотребляют этими свойствами, но в случае обнаружения, могут последовать санкции со стороны поисковых систем.
Но все же расскажем, как это делается на примере.
Отзывы и рейтинг
Если страница товара содержит в себе рейтинг и отзывы пользователей, то рекомендуется отобразить эту информацию в микроразметке. Google охотно показывает в сниппетах, частично или полностью, текст отзыва, и рейтинг в виде цифровых значений (например, 4,7 из 5) и количества звезд.
Пример микроразметки в выдаче Google
Для разметки отзывов, используем свойство Review, для него существуют следующие параметры:
- Name – заголовок отзыва.
- Author – имя автора.
- ReviewBody – текст отзыва
- DatePublished – когда был опубликован.
- ReviewRating – рейтинг (оценка).
Убийца флагманов! Алексей4,8 5Телефон быстрый, красивый, есть все необходимое.
Проверка валидности кода микроразметки
После внедрения микроразметки, ее обязательно необходимо проверить на валидность. Делается это через специальные сервисы самих поисковых систем:
Валидатор Яндекса
На выбор можно проверить по URL интересующей страницы, либо отдельный кусок HTML-кода. В первом случае валидатор покажет всю разметку, а во втором, соответственно, из выбранного фрагмента кода.
Валидатор микроразметки
Проверка микроразметки в валидаторе Яндекса
Валидатор Google
Аналогично валидатору Яндекса, вставляем URL сайта или фрагмент кода. Однако, окно просмотра результата удобнее: оно делится на два экрана, где на первом отображается код, а на втором разметка по вкладкам.
Валидатор Google
Примеры ошибок в микроразметке
Как видно на примере, были обнаружены ошибки, которые необходимо исправить, в противном случае поисковик может не корректно прочитать разметку или не прочитать вовсе.
1 место
SEO для e-commerce
RatingRuneta.ru
9 место
В топ-100 SEO-
компаний России
11 место
В топ-100 SEO-
агентств Рунета
Золотая сотня
Российского Digital
В ТОП-10
«SEO глазами клиентов»
Читайте также:
Нам доверяют
