SEO Блог

Що таке мікророзмітка сайту: види, як додати на сайт та перевірити

Коваленко Марія 

Мікророзмітка сайту дозволяє пошуковим роботам краще розпізнавати вміст на сторінках сайту. А ще робить сніпети в пошукових системах візуально більш привабливими.

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

Що таке мікророзмітка і навіщо вона потрібна

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

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

В Яндексі без розмітки:

Що таке мікророзмітка

З розміткою:

Мікророзмітка в Яндекс

У Google без розмітки:

Що таке мікророзмітка

З розміткою:

Мікророзмітка в Гугл

Як можна помітити, розмітка підтягує в сніпет ціну, контакти, рейтинг, найменування моделі телефону.

Ще можна помітити розширені сніпети з картинками. Вони також створюються за допомогою мікророзмітки.

Розширені сніпети

Що це дає у плані SEO:

  1. Сторінка стає більш видимою та структурованою для пошукача. Якщо, наприклад, користувач шукає телефон через ключовик “iPhone 12 ціна” або “iPhone 11 відгуки”, велика ймовірність, що магазини з мікророзміткою за цими даними будуть вищими в результатах пошуку, ніж конкуренти без розмітки. Але мікророзмітка – не вирішальний фактор ранжування , а лише додатковий.
  2. Сніппет з мікророзміткою відрізняються візуально від звичайних сніппет. Ними частіше кликають. А це покращує поведінкові фактори, і пошукача починає частіше видавати сторінку (або весь сайт) у видачі.

⚠️ Важливо: мікророзмітка універсальна і добре розпізнається усіма пошуковими системами. Тобто не потрібно створювати окрему розмітку під різні пошукові системи.

Яку інформацію можна виділити за допомогою мікророзмітки:

  • Назва організації;
  • логотип;
  • телефон та інші контактні дані;
  • адреса;
  • відгуки;
  • рейтинг;
  • характеристики товару;
  • рецепти;
  • курси;
  • емейл;
  • автора контенту;
  • дати;
  • хлібні крихти;
  • афіші заходів;
  • вакансії;
  • посилання на інші сторінки сайту;
  • посилання на категорії;
  • інформацію про фільм — назву, рейтинг, дату виходу, ім’я режисера, мову озвучення.

Яким сайтам вигідно додавати мікророзмітку: інтернет-магазини, онлайн-кінотеатри, сайти-відгуки, сайти з рецептами, інформаційні блоги, сайти-підбірки.

Як зробити мікророзмітку на сайті

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

Розглянемо варіанти додавання мікророзмітки на найпопулярніших CMS та конструкторах.

WordPress

Мікророзмітка вже вбудована в багато тем Вордпрес і працює автоматично.

Як зробити мікророзмітку на сайті

Якщо хочете самі налаштувати мікророзмітку або у вибраній темі вона відсутня, можна встановити спеціальний плагін. Наприклад, All In One Schema.org Rich Snippets.

Плагін мікророзмітки для Вордпрес

Після встановлення та активації плагіна в лівій панелі інструментів з’явиться кнопка Rich Snippets. Натискаємо її, щоб переглянути налаштування. Плагін англійською. Працює дуже просто – потрібно вибрати категорію, яку хочемо розмітити та заповнити необхідні поля.

Які тут є категорії:

  • Item Review — відгук чи огляд товару/послуги.
  • Events – заходи (можна використовувати для афіші).
  • Person – автор, людина.
  • Product – товар.
  • Recipe – рецепт.
  • Software Application – програмне забезпечення.
  • Video – відео.
  • Article – стаття.
  • Service — послуга чи обслуговування.
Плагін мікророзмітки для Вордпрес

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

Плагін мікророзмітки для Вордпрес

Під час створення статті або сторінки на Вордпрес в нижній частині настройок з’явиться вкладка Configure Rich Snippet. Потрібно її відкрити та прописати потрібні значення.

Мікророзмітка на Вордпрес

Які ще є плагіни для WordPress: Schema, Schema Pro, WP SEO Structured Data Schema, Schema JSON-LD Markup, Schema APP Structured Data, Schema Markup Rich Snippets, WP SEO Structured Data Schema, SNIP: Rich Snippets by WPBud.

Окремо варто виділити плагін Yoast SEO – він загалом хороший для SEO-оптимізації, а створення мікророзмітки лише одна з його функцій.

⚠️ Важливо: якщо на вашому сайті встановлено плагін для інтернет-магазинів WooCommerce, не потрібно ставити додаткові плагіни для розмітки. У WooCommerce вона вже вбудована, і друга плагін може створити конфлікт.

Бітрікс

Для цієї CMS також є свої плагіни. Більшість з них платні, безкоштовні — Мікророзмітка Schema.org . На сторінці плагіна є детальна документація щодо встановлення та налаштування мікророзмітки.

Мікророзмітка на Бітрікс

Joomla

На Джумлі теж є свій плагін (на цьому движку замість плагінів використовується слово “компонент”) – Google Structured Data . Частина цих компонентів підтягує автоматично, частину треба налаштовувати. На сторінці компонента також є документація з налаштування.

Мікророзмітка на Джумла

Аналог компонента Google Structured Data – J4Schema.

Для конструкторів

Для конструкторів немає плагінів, потрібно створити код та вставити його в налаштуваннях сторінки. На щастя, писати код з нуля не обов’язково є готові генератори мікророзміток.

Спочатку трохи теорії:

Мікророзмітка складається із словника та синтаксису. Найпопулярніший словник, який добре розпізнається усіма сучасними пошуковими системами – це Schema.org.

Код мікророзмітки пишеться однією з трьох мов:

Microdata — код містить теги <article> </article>

Приклад, як виглядає повний код для розмітки статті:

Код мікророзмітки

RDFa – код містить теги <div> </div>

Приклад, як виглядає повний код для розмітки статті:

Приклад коду мікророзмітки

JSON-LD — код містить теги <script> </script>

Приклад, як виглядає повний код для розмітки статті:

Приклад коду мікророзмітки

Все, що вам потрібно – дізнатися, якою з трьох мов повинен бути написаний код для вашого конструктора і знайти генератор мікророзмітки для цієї мови. Зазвичай у налаштуваннях SEO сторінки конструктора вказана мова розмітки.

Також є окремий словник розмітки для відображення в соцмережах, створений Фейсбуком Open Graph. У конструкторах для налаштувань Open Graph зазвичай передбачено окреме поле. Зазвичай, все, що там потрібно зробити, – це написати тайтл, дескрипшн і завантажити картинку для відображення в соцмережах.

Заходимо на сайт сервісу The Ultimate JSON-LD Generator. Вибираємо тип контенту, для якого складатимемо код розмітки. Наприклад, це стаття. Клацаємо на кнопку «Article».

Генератор мікророзмітки

Заповнюємо поля. Тип контенту можна залишити Article або уточнити, яка саме це стаття (новинна або пост із блога). Далі прописуємо посилання на сторінку, заголовок H1, посилання на картинку, дату публікації, ім’я автора, посилання на лого.

Генератор мікророзмітки

У міру заповнення полів код праворуч змінюватиметься. Все, що залишиться, – скопіювати його і вставити в налаштуваннях сторінки сайту на Тільда. Щоб скопіювати код, натискаємо “Copy to clipboard”.

Генератор мікророзмітки

Відкриваємо сайт на Тільді. Навпроти сторінки тиснемо на її налаштування.

Мікророзмітка на Тільда

Доходимо до вкладки “Додатково”.

Мікророзмітка на Тільда

У цій вкладці прокручуємо налаштування вниз до пункту HTML код для вставки всередину head. Туди потрібно вставити скопійований код та зберегти зміни. Можливість вставки коду доступна лише на платних тарифах Тільди.

Як додати мікророзмітку на Тільда

Wix: у Wix код мікророзмітки теж пишеться мовою JSON-LD. Можна зробити ті самі кроки, що описані для Tilda.

Щоб вставити готовий код, заходимо в редактор конструктора і натискаємо на список сторінок. Навпроти кожної сторінки є три точки (меню). Кликаємо туди.

Як додати мікророзмітку на Wix

У меню вибираємо Базові налаштування SEO.

Як додати мікророзмітку на Wix

І в самих налаштуваннях переходимо до додаткових. У відповідне поле вставляємо код JSON-LD та зберігаємо зміни.

Як додати мікророзмітку на Wix

Якщо сайт на HTML

Для самописного сайту потрібно скласти код розмітки та вручну додати до коду сторінок. Найкраще довірити це програмістам. Якщо хочете зробити самі, можете використати генератори розміток, щоб сформувати код. Вище ми вже згадали два сервіси – це The Ultimate JSON-LD Generator і Schema Markup Generator (JSON-LD).

Також можна скористатися майстром розмітки структурованих даних від Google. Він працює аналогічно попереднім сервісам та генерує код на HTML.

Як створити мікророзмітку для сайту

Генератори мікророзмітки російською мовою: apelsin.pro та генератор на сайті seolik.ru (у розділі SEO-інструменти).

Готовий код вставляється між тегами <head> та </head> сторінки сайту. Приклад розміщення коду у форматі JSON-LD:

Як створити мікророзмітку для сайту

Як перевірити мікророзмітку

Після створення коду мікророзмітки варто переконатися, що все зроблено правильно. Для перевірки є спеціальні сервіси, а також інструменти від Яндекс та Google.

У Вебмайстрі Яндекс : потрібно натиснути на «Інструменти» у правому верхньому кутку та відкрити «Волідатор мікророзмітки».

Як перевірити мікророзмітку

У самому валідотор потрібно додати посилання на сторінку, яку хочемо перевірити або готовий код. Система просканує сторінку (або код) і підтвердить, що все правильно чи дасть рекомендації щодо виправлення мікророзмітки.

Валідатор мікророзмітки Яндекс

У серч консоль Google : аналогічно – вказуємо посилання на сторінку або код і дивимося на результати перевірки.

Валідатор мікророзмітки Гугл

Третій спосіб – перевірка через валідатор Schema.org . Працює через перевірку коду. У лівому вікні вставляємо код, натискаємо на сіру кнопку посередині, праворуч дивимось результат. Якщо все ок, над результатом буде написано “немає помилок” і “немає попереджень”.

Як перевірити мікророзмітку

Висновок

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

Recommended Posts

SMM - Соціальні медіа Telegram Блог

Про що вести канал у Телеграмі: приклади та застереження

Треба писати новий пост чи створити канал, але поки що не знаєте, про що? Потрібно придумати тему одного посту чи одразу десятка? Ми вивчили безліч каналів, щоб розповісти вам, на які тематики та що пишуть спільноти. Розібралися, що писати в каналах на різні теми, а про що точно говорити не варто. Користуйтесь 😉 З чого почати Якщо поки що […]

Коваленко Марія 
Instagram Блог SMM - Соціальні медіа

Ідея для сторіс. Тест на знання

В чому суть. Перевірте ерудицію передплатників та проведіть тест на знання: загальної тематики, вашої професійної галузі чи певного продукту. Як зробити. Ви, звичайно, можете придумати велосипед і розробити свій спосіб, але зручніше використовувати готові стікери Інстаграма*: «Опитування» і «Тест». Перший зручний, якщо ви пропонуєте 2 варіанти відповіді на вибір, другий – 3 або 4. Найбільша перевага наклейки […]

Коваленко Марія 
Facebook Блог Instagram Блог SMM - Соціальні медіа

Оптимальні розміри картинок для соцмереж: шпаргалка

Розміри картинок та фото для соцмереж корисно знати SMM-щикам, дизайнерам та маркетологам – ці знання допоможуть розробити макети для постів, сторіс, шапок та обкладинок для груп. Розповідаємо, якого розміру мають бути фото для Інстаграма*, ВКонтакті, Фейсбуку* та Однокласників. Розміри зображень для Інстаграма* Максимальна вага фото – 30 Мб. Розмір аватарки в Інстаграмі * Оптимальний : 320 х […]

Коваленко Марія 

Leave A Comment