Микроразметка Json-ld

Разметка получила свое название от языка JSON (англ. JavaScript Object Notation) – данный формат хорош, как для подачи информации людям, так и машинам.

JSON-LD (англ. Linked Data) – передача связанных данных с помощью текстового формата JSON. Особенностью JSON-LD является теговость, он внедряется как отдельный тег, а не встраивается в код страницы. Так что с данной задачей может справиться человек, далекий от программирования.

json-ld пример внедрения в страницу

Пример разметки с помощью формата JSON-LD:

Как видно, такой «тег» удобно размещать в коде страницы, не волнуясь о нарушении ее работоспособности. Однако у JSON-LD есть весомый минус.  Данная микроразметка  не будет видна пользователю (имеются ввиду не будет заметны её параметры на элементах), что противоречит требованиям поиска – не использовать скрытый контент. Стоит отметить, что этот формат в 2013 году был рекомендован Schema.org для разметки страниц, а в середине 2014 всемирно известный поисковик Google посоветовал использовать JSON-LD.

 

Микроразметка Json-ld

Синтаксис микроразметки JSON-LD

  • @context - Используется для определения коротких имен, используемых во всем документе JSON-LD.
  • @id - Используется для уникальной идентификации вещей.
  • @value - Используется для указания данных, связанных с определенным.
  • @language - Используется для указания языка.
  • @type - Используется для установки типа данных.
  • @container - Используется для установки типа контейнера.
  • @list - Используется для выражения упорядоченного набора данных.
  • @set - Используется для выражения неупорядоченного набора данных и обеспечения того, что значения всегда представлены как массивы.
  • @reverse - Используется для выражения обратных свойств.
  • @index - Используется для указания того, что контейнер используется для индексирования информации.
  • @base - Используется для установки базового IRI.
  • @vocab - Используется для расширения свойств и значений @typeс помощью общего префикса IRI.
  • @graph - Используется для выражения графика.
  • : - Сепаратор для ключей JSON и значений.

 

Используя данный формат, вы можете создать разметку:

  • организации;
  • товара;
  • отзыва;
  • определенного человека;
  • фотографии.

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

 

Пример микроразметки JSON-LD товаров

<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Product",
"url": "https://microdata.pro/demo/index.php?route=product/product&amp;product_id=28",
"category": "Телефоны и PDA",
"image": "https://microdata.pro/demo/image/catalog/demo/htc_touch_hd_1.jpg",
"brand": "HTC",
"manufacturer": "HTC",
"model": "Товар 1",
"gtin12": "upc",
"gtin8": "ean",
"productID": "isbn",
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.5",
"reviewCount": "2"
},"description": "Описание товара",
"name": "HTC Touch HD",
"offers": {
"@type": "Offer",
"availability": "https://schema.org/InStock",
"price": "122.00",
"priceCurrency": "RUB"
},
"review": [
{
"@type": "Review",
"author": "Тест 2",
"datePublished": "2016-06-06",
"description": "Текст отзыв",
"reviewRating": {
"@type": "Rating",
"bestRating": "5",
"ratingValue": "5",
"worstRating": "1"
}
},{
"@type": "Review",
"author": "Тест имени для отзыва",
"datePublished": "2016-06-06",
"description": "Текст отзыва",
"reviewRating": {
"@type": "Rating",
"bestRating": "5",
"ratingValue": "4",
"worstRating": "1"
}
}],"isRelatedTo": [
{
"@type": "Product",
"image": "https://microdata.pro/demo/catalog/demo/apple_cinema_30.jpg",
"url": "https://microdata.pro/demo/index.php?route=product/product&amp;product_id=42",
"name": "Apple Cinema 30&quot;",
"description": "Описание товара",
"offers": {
"@type": "Offer",
"price": "777.00",
"priceCurrency": "RUB"
}
}
]
}
</script>

 

Пример микроразметки логотипа JSON-LD

Для разметки логотипа следует указать:

  1. Словарь микроразметки.
  2. Тип данных. В нашем случае — “Organization”.
  3. URL-адрес ресурса.
  4. URL-адрес логотипа.

[code]

<script type="application/ld+json">
 {
   "@context": "http://schema.org",
   "@type": "Organization",
   "url": "http://www.example.com",
   "logo": "http://www.example.com/images/logo.png"
 }
</script>

[/code]

 

Микроразметка контактов JSON-LD

 

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Organization",
  "url": "http://www.example.com",
  "name": "Unlimited Ball Bearings Corp.",
  "contactPoint": {
    "@type": "ContactPoint",
    "telephone": "+1-401-555-1212",
    "contactType": "Customer service"
  }
}
</script>

 

Разметка рецепта блюда JSON-LD

<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Recipe",
  "name": "Grandma's Holiday Apple Pie",
  "author": "Elaine Smith",
  "image": "http://images.edge-generalmills.com/56459281-6fe6-4d9d-984f-385c9488d824.jpg",
  "description": "A classic apple pie.",
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4",
    "reviewCount": "276",
    "bestRating": "5",
    "worstRating": "1"
  },
  "prepTime": "PT30M",
  "totalTime": "PT1H",
  "recipeYield": "8",
  "nutrition": {
    "@type": "NutritionInformation",
    "servingSize": "1 medium slice",
    "calories": "230 calories",
    "fatContent": "1 g",
    "carbohydrateContent": "43 g",
  },
  "recipeIngredient": [
    "1 box refrigerated pie crusts, softened as directed on box",
    "6 cups thinly sliced, peeled apples (6 medium)",
    "..."
  ],
  "recipeInstructions": [
    "1...",
    "2..."
   ]
}
</script>





Микроразметка страницы услуг JSON-LD

микроразметка статьи json ld

Какие настройки выбрать для разметки в модуле MicrodataPro

Для полной универсальности что бы понравится всем поисковым роботам я рекомендую оставлять в настройках двойной синтаксис Microdata + JSON-LD. Каждый робот отдает предпочтение одному из форматов, а разметив всеми- выберет наиболее подходящий. Тем более что модуль передает одни и те же данные только двумя синтаксисами.

WordPress

Как обычно для вордрпесс можно найти готовые решения, вот популярные плагины:

  • NextGEN Facebook (указывает автора публикации и издателя)
  • Structured Data of JSON-LD (мощный плагин, поддерживает все типы разметки)

 

Альтернативный способ разметки данных на сайте

Также можно всё сделать без залезания в код, самостоятельно, в Гугле для этого есть инструмент во вкладке Search Console «Другие ресурсы» – Мастер разметки структурированных данных. Выбираешь тип данных (например: организация), вставляешь URL страницы, она подгружается – и размечай. // ]]>

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *