0-800-759-750
Ми на зв'язку с 7:00 до 24:00
office@elit-web.ua

Мікророзмітка JSON-LD: що це і як використовувати

Поділіться
Зміст

    Мікророзмітка – це розмітка тексту спеціальними тегами та атрибутами, за допомогою якої можна коректно формувати сніпети та надавати пошукачам точнішу інформацію про зміст сторінки.

    Ми вже маємо чудову статтю з цієї теми — «Мікророзмітка. Посилання, на які хочеться натискати». Рекомендуємо ознайомитись з нею перед тим, як переходити до JSON LD. Якщо ви вже з нею ознайомилися, приступаємо до сьогоднішньої теми!

    Мікророзмітка JSON-LD

    Що таке формат JSON-LD?

    JSON-LD – це формат опису контенту за допомогою об'єктів спеціального LD-словника. Він передбачає прописування контенту в тезі <script>, щоб пошукові алгоритми змогли їх коректно прочитати.

    Простіше кажучи, це інструмент передачі даних, використовуючи класичний формат JSON (JavaScript Object Notation) – зрозумілого для людини і коректно структурованого з погляду пошукових машин. На практиці така мікророзмітка зазвичай застосовується для покращення представленості сайту у пошуку. А точніше – для роботи зі сніпетами.

    Просто порівняйте два сніпети:

    1. Без використання мікророзмітки:

      Без використання мікророзмітки

    2. З мікророзміткою для структурування даних:

    З мікророзміткою для структурування даних

    У першому випадку маємо просто текст. Без структури, без акцентних елементів і без всієї тієї інформації, яку ми бачимо в другому прикладі. Власне, це є наочна демонстрація використання мікророзмітки.

    Чому її варто використовувати?

    На відміну від інших видів синтаксису для впровадження мікророзмітки (RDFa, hCard або Microdata), формат JSON-LD має кілька важливих переваг:

    • обсяг коду менший, а сприймати його легше;
    • він рекомендований Google як оптимальний формат мікророзмітки;
    • розмітка залучена через JS і помітна виключно пошуковим роботам.

    Ще одне перевага – велика кількість плагінів для всіх популярних CMS, які суттєво спрощують та прискорюють впровадження мікророзмітки.

    JSON-LD кращий за Schema.org

    Як мінімум перевага JSON в тому, що з ним простіше і зручніше працювати. Тому що відрізняються самі формати та методи впровадження коду в HTML. Розмітка Schema.org – це код, який розміщується безпосередньо в тілі сторінки і виглядає наступним чином:

    JSON-LD кращий за Schema.org

    JSON зручніший тим, що код впроваджується в тег <head>. Це, по-перше, простіше та швидше. А, по-друге, у майбутньому буде набагато легше знайти ваш код та скорегувати його, замінити чи видалити. Приклад застосування коду JSON в <head>:

    JSON зручніший тим, що код впроваджується в тег <head>

    Синтаксис JSON-LD

    Згідно з рекомендаціями Google, код JSON необхідно впроваджувати у тег <head>. Ми теж радимо чинити саме так, хоча в тезі <body> код теж працюватиме.

    Сама ж конструкція виглядає наступним чином:

    Синтаксис JSON-LD

    Фактично ми повідомляємо браузеру про звернення до JS-коду, в якому міститься JSON-LD. Для наочності пропонуємо вам подивитися на вже впроваджений код всередині тега <head>:

    впроваджений код всередині тега <head>

    Як бачите, код дійсно легко читається, не перевантажений нічим і зрозумілий. Якщо раніше ви вже працювали з JSON, то ніяких труднощів точно не виникне.

    Ключі та значення синтаксису JSON-LD

    Ключі – це елементи JSON-коду, які пов'язують об'єкти між собою. Розглянемо деякі ключі, що найчастіше використовуються, та їх функції:

    Обов'язкові властивості JSON-LD

    Існує кілька властивостей, без яких вміст вебсторінки просто не буде виводитися у сніпеті. До таких властивостей належать такі:

    Обов'язкові властивості JSON-LD

    Також є нехай і необов'язкові, але рекомендовані властивості, які теж бажано використовувати. І тут важливо розуміти, що використання релевантних властивостей може суттєво підвищити шанси попадання вашої сторінки в розширений сніпет.

    Також є нехай і необов'язкові

    Мікророзмітка JSON будується на двох основних компонентах – словнику і синтаксисі. Перший позначає вміст сторінки, а другий налаштовує правила, за якими елементи інтегруються на сторінку.

    Ключі та властивості JSON досить логічні та інтуїтивні. Їх легко запам'ятати і зручно використовувати, навіть якщо раніше ви не мали справи з мікророзміткою в принципі.

    Інструменти для роботи з JSON-LD

    Хоча ми вже неодноразово повторили, що синтаксис JSON-LD порівняно простий, писати код самостійно – процес все одно досить трудомісткий і витратний за часом. На щастя, потреби в цьому немає. Існує безліч корисних інструментів для роботи з JSON, які суттєво спростять вам завдання.

    Перерахуємо найпопулярніші:

    1. Schema Generator від Technicalseo.com. Функціональний генератор, за допомогою якого можна працювати з JSON, налаштовувати хлібні крихти та багато іншого.

      Інструменти для роботи з JSON-LD

    2. Hallanalysis.com. Максимально простий, навіть у певному сенсі примітивний generator json-ld, який все одно чудово справляється зі своїми завданнями. Інструмент дозволяє працювати з шістьма основними сутностями: місцевий бізнес, особистість, продукт та інші.

      Hallanalysis.com

    3. Web Code Tools. Функціональний генератор JSON-коду, в якому міститься понад 10 типів сутностей та унікальних атрибутів. А ще у Web Code Tools стильний та мінімалістичний інтерфейс – дрібниця, а приємно.

      Web Code Tools

    До речі, якщо ваш сайт працює на якомусь із популярних CMS, можна обійтися без сторонніх сервісів генерації JSON-коду. Є досить багато зручних плагінів, які суттєво спрощують це завдання та економлять час:

    Також варто додати, що після розміщення коду в структурі HTML ви зможете у будь-який час відстежувати виникнення будь-яких проблем у Google Search Console (розділ «Покращення»). Рекомендуємо періодично відвідувати розділ, щоб бути в курсі ситуації.

    Google Search Console JSON-код

    Як синтаксис JSON-LD перевірити на помилки?

    Перед публікацією JSON-коду ми наполегливо рекомендуємо перевірити його на помилки. Зрозуміло, немає потреби робити це самостійно та витрачати свій час. Ви все одно упустите якусь помилку. Набагато простіше і швидше використовувати спеціальні сервіси-валідатори.

    Рекомендуємо від себе «Інструмент перевірки структурованих даних Google». Працювати з ним максимально зручно — відкриваєте валідатор, вставляєте свій код, натискаєте «Перевірити код» і через секунду отримуєте результати з виявленими помилками та їх описами.

    Як синтаксис JSON-LD перевірити на помилки

    В принципі ви можете використовувати й інші валідатори, які знайдете в інтернеті. Наприклад, той же Schema.org чудово справляється з цим завданням. Якщо фірмовий інструмент Google вам з якоїсь причини не підходить, можете розглянути його – різниці в результатах, найімовірніше, не буде.

    Підсумок

    Підсумовуючи, можемо сказати, що JSON LD – це лише один з багатьох варіантів мікророзмітки. Але він справді може за правом вважатися одним із найкращих. Навіть якщо порівнювати його з популярним Schema.org.

    І тут у вас може виникнути логічне питання: «Чи варто впроваджувати JSON, якщо я вже використовую іншу мікророзмітку?». У більшості випадків такої потреби немає. Пошуковики чудово читають і інші варіанти мікророзмітки, тому перехід на JSON тільки додасть вам роботи, але може не зробити особливого впливу.

    А от якщо ви взагалі не використовуєте мікророзмітку і лише вибираєте слушний варіант, тоді ми радимо саме JSON. Недаремно ж Google рекомендує його з 2014 року!

    У Вас залишились запитання?
    Наші експерти готові відповісти на них.
    Залишіть ваші контактні дані.
    Будемо раді обговорити ваш проект!
    Отримати консультацію
    Наш менеджер зв'яжеться з Вами найближчим часом