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

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

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

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

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

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

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

WordPress

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

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

 

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

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