- Про мікророзмітки
- Описуємо дані за допомогою Schema.org
- Мікроформати і Schema.org
- Що ще потрібно знати про мікроданних і Schema.org?
- Користь мікророзмітки і пошукова видача. розширені спіппети
- Розширений сниппет для Google
- Розширений сниппет для Yandex
- Популярні схеми мікророзмітки
- Offer Schema
- WebPage Schema
- AggregateRating Schema
- Product Schema
- Review Schema
- Rating Schema
- SearchAction Schema
- MobileApplication Schema
- WebSite Schema
- Валідація та перевірка мікророзмітки на Schema.org
- висновок
У світі, де править Інтернет і пошукові системи (Google, Bing, Yahoo !, Yandex, Baidu), пошук абсолютно будь-якої інформації - справа кількох хвилин. Значення пошукових систем в нашому житті складно недооцінити, тому не дивно, що їх розвиток йде величезними темпами. Якщо вчора будь вебмастер міг покладатися виключно на просту HTML-розмітку, то сьогодні цього буде вже недостатньо.
Пошукові машини стають розумнішими і пред'являють підвищені вимоги не тільки до того, як повинна бути відображена та чи інша інформація, але і до того, який смисловий посил вона несе. Наприклад, якщо раніше було достатньо прописати <h1> Володар кілець: Повернення короля </ h1>, то сьогодні цим вже не обійдешся. Чому?
Справа в тому, що людина швидко зрозуміє, чи йде в даному випадку мова про фільм, про книгу, про зображення і т.п., а ось пошукова система впорається з цим не так легко і, отже, буде не так ефективно шукати інформацію, адекватну запиту користувача. Щоб вирішити проблему розуміння інформації пошуковими системами, використовується мікророзмітки за допомогою мікроданних зі словником Schema.org.
Читайте також: Мікророзмітки потрібна для видачі. І крапка.
У даній статті ми поговоримо про те:
що таке мікророзмітки;
які бувають види мікророзмітки;
чим корисна мікророзмітки;
як описувати дані за допомогою Schema.org;
як мікророзмітки впливає на пошукову видачу і використовується в пошуковій оптимізації;
що таке розширені сніппети для Google і Yandex і як їх використовувати;
а також про 9 найпопулярніших схемах мікророзмітки, які повинен знати кожен веб-майстер і SEO специалист.
Звичайно ж, буде багато прикладів, які, сподіваємося, допоможуть Вам застосувати мікророзмітки і на Ваших власних сайтах.
Про мікророзмітки
Словник мікроданних Schema.org з'явився в 2011 році, коли Google, Microsoft і Yahoo! (Пізніше до них приєднався і російський Yandex) вирішили уніфікувати схеми семантичної розмітки. Schema.org - єдиний словник тегів, який може використовуватися веб-майстрами для розмітки сторінок так, щоб пошукові системи Google, Yandex, Bing і Yahoo! могли "читати" інформацію на них.
Мікророзмітки дозволяє використовувати єдиний стандарт, який значно полегшує семантичну оптимізацію. В даний час, використовуються три типи мікророзмітки:
Мікродані. Використовується з HTML і Schema.org для опису спеціальних даних. Наприклад, якщо це фільм, то ми можемо спеціально прописати його назву, жанр, режисера, акторів, рейтинг і т.п.
Мікроформати. Використовуються в якості простих сутностей, тобто описують тип інформації на сторінці, задаючи набір властивостей. Наприклад, якщо це якийсь захід, то ми спеціально пропишемо його назву, дату, час початку та закінчення заходу і т.п.
RDFa. Те ж використовується разом з сутностями, властивостями і елементами. Використовується не так часто, як мікродані і мікроформати, так як поступається їм у функціональності.
Відзначимо, що в даній статті ми зробимо акцент на мікроданних і словника Schema.org.
Описуємо дані за допомогою Schema.org
Тепер, коли Ви приблизно уявляєте, що таке мікророзмітки, почнемо заглиблюватися в деталі. Для початку поговоримо про те, як описати дані за допомогою Schema.org. Чому ми вибрали Schema.org і мікродані? Справа в тому, що це найбільш популярний, надійний і ефективний спосіб мікророзмітки. Він не так складний як RDFa і, до того ж, рекомендований Google.
Мікроформати і Schema.org
Schema.org - це словник тегів для розмітки мікроданних в HTML5, в якому також присутні різні сутності, атрибути та їх властивості. На даному етапі, поговоримо про тих основних атрибутах: itemscope, itemtype і itemprop.
Itemscope. Цей атрибут дозволяє розмежовувати інформацію на сторінці, виділяти окремі блоки для кожної сутності.
Itemtype. Цей атрибут працює в парі з itemscope і визначає тип виділеної суті за допомогою ієрархії типів в Schema.org.
Itemprop. Цей атрибут дозволяє описати додаткову інформацію про сутність. Наприклад, мова йде про книгу, то це може бути назва, автор, жанр, рік видання і т.п.
Тепер розглянемо вищеописане на конкретному прикладі. Припустимо, що Ви хочете впровадити мікророзмітки на сторінці вже згаданого нами фільму "Володар кілець: Повернення короля". Швидше за все, частина HTML-коду без мікророзмітки виглядає приблизно так:
<Div> <h1> Володар кілець: Повернення короля </ h1> <span> Режисер: Пітер Джексон </ span> <span> Фентезі </ span> <a href="ссилка"> Дивитися фільм </a> </ div>
Виділимо блок, який присвячений фільму, за допомогою itemscope.
<Div itemscope> <h1> Володар кілець: Повернення короля </ h1> <span> Режисер: Пітер Джексон </ span> <span> Фентезі </ span> <a href="ссилка"> Дивитися фільм </a> < / div>
Тепер пошукової робот буде розуміти, що всю інформацію між <div> і </ div> треба розглядати як одне ціле.
Далі додаємо тег itemtype. Так ми повідомимо пошуковим роботам, яка саме інформація знаходиться в виділеному блоці. У нашому випадку ми використовуємо схему Movie.
<Div itemscope itemtype = "http://schema.org/Movie"> <h1> Володар кілець: Повернення короля </ h1> <span> Режисер: Пітер Джексон </ span> <span> Фентезі </ span> <a href = "посилання"> Дивитися фільм </a> </ div>
Далі повідомляємо пошуковим роботам більше інформації про фільм за допомогою тега itemprop. В даному прикладі ми можемо вказати мікророзмітки назви фільму, режисера, жанру, а також URL.
<Div itemscope itemtype = "http://schema.org/Movie"> <h1 itemprop = "name"> Володар кілець: Повернення короля </ h1> <span> Режисер: <span itemprop = "director"> Пітер Джексон < / span> </ span> <span itemprop = "genre"> Фентезі </ span> <a href="ссилка" itemprop="movie"> Дивитися фільм </a> </ div>
Зверніть увагу, що тегами з атрибутом itemprop в більшості випадків треба обертати конкретний текст. В наведеному вище прикладі ми додали додаткову пару тегів <span>, щоб пошукові роботи не розглядали слово "режисер" в якості самого режисера.
Що ще потрібно знати про мікроданних і Schema.org?
в Schema.org є багато схем із заданими властивостями (про найпопулярніші з них ми поговоримо нижче). Їх кількість поступово збільшується.
основних властивостей чотири (в реальності їх набагато більше - см. властивості Thing ): Name, description, URL і image. Дочірні суті і схеми завжди отримують властивості "батьків".
за допомогою Schema.org бажано робити розмітку тільки тієї інформації, яку видно користувачам сайту. Не робіть розмітку прихованих блоків інформації.
при розмітці треба завжди використовувати очікуваний тип і текст, звертайте увагу на вкладені суті, дочірні і батьківські типи. Наприклад, у Вас є ланцюжок Thing - Place - TouristAttraction. Ставлячи схему TouristAttraction, будьте готові використовувати властивості, прийняті в цьому ланцюжку. Якщо цього не робити, то пошукові системи просто не зможуть "зрозуміти", що Ви їм хотіли сказати.
намагайтеся використовувати окрему схему для кожної конкретної посилання. Наприклад, у Вас є список товарів на сторінці. Переконайтеся, що кожен з них буде позначено, як Product, а кожна посилання на нього, як URL.
Користь мікророзмітки і пошукова видача. розширені спіппети
Мікророзмітки допомагає пошуковим системам не тільки краще відображати, а й краще розуміти, розміщену на сторінці інформацію. Саме мікророзмітки дає пошуковим роботам детальну "карту" того, як слід обробити і проіндексувати інформацію. Саме мікророзмітки, в кінцевому рахунку, дозволяє значно поліпшити релевантність сторінки як для пошукових систем, так і для користувачів. Отже, поліпшується і пошукова видача. Вважається, що мікророзмітки може збільшити надходження трафіку на сайт приблизно на 30%. Погодьтеся, що така пошукова оптимізація - гарне рішення!
Читайте також: 7 ознак SEO-самогубці: помилки при просуванні сайту
Присутність мікророзмітки на сторінці робить сторінку більш інформативною і привабливою у видачі за допомогою сниппета. Сніппет з мікророзмітки дозволяє вивести в видачу більш повний опис сторінки, вказати розділи і ціни, відобразити фото, адреса і телефон компанії. Порівняйте два приклади нижче і відчуйте різницю:
Сайт у видачі без мікророзмітки
Сайт у видачі з мікророзмітки
Думаємо, зрозуміло, який сайт приверне користувачів і трафік. Докладний і грамотний сниппет дозволяє заощадити час і швидко зрозуміти, чи варто заходити на сайт чи ні, і, отже, на сайт потраплять тільки ті, кому це дійсно треба. Якісний трафік гарантований. Загалом, мікророзмітки робить сайт більш помітним як для пошукових роботів, так і для користувачів, що позитивно впливає на трафік, видачу та кінцеву задоволеність клієнта сайтом.
Розширений сниппет для Google
Google дозволяє перешкодити невеликий опис веб-сторінки (сниппет) у видачі. Чим детальніше і інформативніше сниппет, тим легше користувачеві зрозуміти, наскільки зміст веб-сайту релевантне його запитом. Домогтися інформативності сниппета можна за допомогою мікророзмітки мікродані зі Schema.org. Наприклад, якщо мова йде про веб-сайті ресторану, то за допомогою мікророзмітки можна не тільки вказати його назву, а й додати ціни, рейтинг, час роботи, адреса, фотографії страв і т.п. Загалом, розширений сниппет просто не може пошкодити.
Створити розширений сниппет для Google можна:
вибравши формат розмітки (в нашому випадку це мікродані);
разметив зміст (див. приклади нижче);
перевіривши розмітку за допомогою спеціальних валідаторів (про них мова той же піде нижче).
Приклад коду розширеного сниппета для Google
Приклад розширеного сниппета для Google у видачі
Відзначимо, що на даний момент Google підтримує сніппети для відгуків, людей, товарів, компаній, організацій, рецептів, заходів, музики і деяких інших типів контенту. Кожен тип має свої властивості і особливості.
Розширений сниппет для Yandex
В Yandex так само використовуються розширені сніппети, які дають користувачеві повне уявлення про те, чи відповідає зміст веб-сайту його запитом чи ні. Так само, як і в випадку з Google, користувач вибирає схожі результати видачі, не заходячи на всі сайти підряд.
Розширений сниппет від Yandex містить заголовок, короткий опис і додаткову інформацію. Наприклад, в сниппет можна додати швидку посилання на певний розділ сайту, адреса компанії, дані про товари і послуги, відгуки, рейтинг, дані по музичним творам, фільмів, кліпів, рецептами, рефератів, словникових статей та багато іншого.
У сниппета Yandex використовуються так звані навігаційні ланцюжки. Якщо сайт досить великий і має добре виражену структуру, то навігаційна ланцюжок може включати швидкі посилання, що значно полегшує доступ до різних розділів сайту, а також дозволяє оцінити обсяг контенту, його тип і релевантність запиту. З цього випливає, що веб-майстер зобов'язаний зробити сайт зрозумілим і простим.
приклад
Окремо відзначимо, що сніпети Yandex можуть містити дати. Наприклад, якщо мова йде про новини, публікації в блозі, новинному повідомленні і т.п., то дата вкрай необхідна для орієнтації користувача. Щоб повідомляти пошуковим роботам дати, веб-майстер повинен налаштувати формування URL у вигляді шаблону.
приклад
Популярні схеми мікророзмітки
Тепер, коли Ви маєте уявлення про мікророзмітки, її користь в пошукової оптимізації та варіантах використання, поговоримо про найбільш популярних схемах мікророзмітки, які реально можуть поліпшити відображення контенту, допомогти згенерувати більше трафіку і залучити більше відвідувачів.
Отже, які ж схеми мікророзмітки є найпопулярнішими і можуть допомогти SEO? Якщо вірити даним, наданим компанією SimilarTech , То виходить, що найпопулярнішими в світі є схеми:
Offer Schema
WebPage Schema
AggregateRating Schema
Product Schema
Review Schema
Rating Schema
SearchAction Schema
MobileApplication Schema
WebSite Schema
Поговоримо про кожну з них окремо. Саме ми поговоримо про те, де і як застосовується кожна з перерахованих вище схем, наведемо приклади фрагментів, а також надамо приклади розмітки.
Offer Schema
На російську мову "offer" перекладається "пропозицію". Фактично, суть Offer Schema полягає в пропозиції чогось. Наприклад, сайт пропонує купити таку-то книгу або фільм, орендувати квартиру, подивитися серіал онлайн, відремонтувати машину і т.п. Одне з таких пропозицій Ви можете побачити на розширеному сніпеті нижче.
приклад сниппета
Offer Schema є дочірньою сутністю Intangible, яка, в свою чергу, закріплена за самою загальною сутністю Thing.
WebPage Schema
WebPage Schema, як можна здогадатися, є схемою мікророзмітки для окремої веб-сторінки. У Schema.org передбачається, що ця схема може "захоплювати" деякі властиві сторінці властивості (наприклад, breadcrumb - хлібні крихти). Навіть якщо властивість не виділено в блоці мікророзмітки за допомогою itemscope, але знаходиться на сторінці, то пошукові боти все одно "зрозуміють", що воно відноситься до блоку. Відзначимо, однак, що краще ставити властивості окремо.
WebPage Schema є дочірньою сутністю CreativeWork, яка, в свою чергу, закріплена за самою загальною сутністю Thing.
AggregateRating Schema
AggregateRating Schema - це середній рейтинг сайту або веб-сторінки, який обчислюється на основі різних оцінок і відгуків, залишених клієнтами і користувачами. Відображається у вигляді зірочок; поруч вказується кількість відгуків, на основі яких обчислено рейтинг. З цього випливає, що AggregateRating Schema завжди використовується в парі з Review Schema. Дивись розширений сниппет нижче.
приклад сниппета
AggregateRating Schema є дочірньою сутністю Rating.
Product Schema
Product Schema - популярна схема, яка використовується для відображення конкретного товару або послуги. Наприклад, це може бути пара черевиків, квиток на концерт, автомобіль, серія серіалу або фільм і т.п. Дивись розширений сниппет нижче.
приклад сниппета
Product Schema є дочірньою сутністю Thing.
Review Schema
Review Schema - це схема для інформативного відображення відгуків на товар, послугу, фільм, альбом, магазин, ресторан і т.п. Дивись розширений сниппет нижче.
приклад сниппета
Review Schema є дочірньою сутністю CreativeWork, яка, в свою чергу, закріплена за самою загальною сутністю Thing.
Rating Schema
Rating Schema дозволяє відобразити рейтинг сайту або веб-сторінки в цифровому вираженні. Наприклад, рейтинг такого-то ресторану - 3,5 зірки, а такого-то магазину - 4 зірки. На відміну від AggregateRating, Rating обчислюється тільки на основі оцінок і без урахування відгуків.
Rating Schema є дочірньою сутністю Intangible, яка, в свою чергу, закріплена за самою загальною сутністю Thing. Rating - батьківська схема для AggregateRating Schema.
SearchAction Schema
SearchAction Schema дозволяє зробити пошук по ресурсу прямо з видачі. Топові сайти в США роблять акцент саме на цій схемі (за даними SimilarTech ). Дивись розширений сниппет нижче.
приклад сниппета
SearchAction Schema є дочірньою сутністю Action, яка, в свою чергу, закріплена за самою загальною сутністю Thing. SearchAction - батьківська схема для FindAction Schema.
MobileApplication Schema
MobileApplication Schema дозволяє відобразити в пошуку властивості мобільного додатка; містить вказівку на те, що це програма розроблена для роботи на мобільних пристроях.
Mobile Application Schema є дочірньою сутністю SoftwareApplication, яка, в свою чергу, є дочірньою сутність CreativeWork, а та закріплена за Thing.
WebSite Schema
WebSite Schema - схема для відображення набору пов'язаних веб-сторінок або інших елементів, які розміщені на єдиному веб-домені і мають один URL.
WebSite Schema є дочірньою сутністю CreativeWork, яка, в свою чергу, закріплена за самою загальною сутністю Thing.
Валідація та перевірка мікророзмітки на Schema.org
Розмітка на Schema.org потребує тестуванні і перевірці так само, як і верстка веб-сторінки і код будь-якої програми. Рекомендуємо завжди проводити валідацію розмітки, адже саме від неї залежить те, наскільки ефективно пошукові боти "прочитають" контент сайту. Коректність розмітки можна перевірити за допомогою таких інструментів:
Structured Data Testing Tool . Цей інструмент від Google простий у використанні і дозволяє досить швидко перевірити розмітку як на цілому сайті, так і в частині HTML-коду.
валідатор мікророзмітки . Цей інструмент від Yandex працює так само, як і вищеописаний Structured Data Testing Tool: введіть URL сайту або частина HTML-коду, натисніть кнопку "Перевірити" та насолоджуйтеся.
Structured Data Linter . Цей інструмент в цілому схожий на два попередніх. Єдиною відмінністю є можливість завантажувати файл з HTML-кодом сайту для аналізу.
Сподіваємося, що ці інструменти принесуть Вам користь.
висновок
Отже, що можна сказати наостанок? Мікророзмітки вже тут, їй активно користуються все більше і більше вебмайстрів і SEO фахівців для більш грамотної та ефективної пошукової оптимізації. Мікророзмітки хороша для всіх: користувач отримує доступ до більш адекватної й структурованої інформації; пошукові боти краще "читають" і індексують сайт; вебмастер і SEO специалист отримують задоволення від збільшеного трафіку і більшої кількості правильних відвідувачів.
У мікророзмітки немає нічого складного, особливо якщо Ви вирішили зупинитися на мікророзмітки мікродані за допомогою Schema.org. Всі дані уніфіковані на сайті schema.org , І якщо Ви володієте англійською, то проблем у Вас точно не виникне. На сайті є і опису окремих схем, і їх властивості, і приклади.
З чого почати? Якщо Ви читаєте цю статтю, то, думаємо, очевидно, що почати треба з 9 схем мікророзмітки, які були описані вище. Якщо у Вас немає часу на все 9, то зупиніться хоча б на найпотрібніших для Вашого бізнесу. Наприклад, якщо Ви тримаєте Інтернет-магазин, то логічніше буде розпочати з Offer, Product, Review, Rating і SearchAction. Якщо Ви володієте корпоративним сайтом, то почніть з WebSite і WebPage. Загалом, вирішувати Вам.
Чи не забувай перевіряті мікророзміткі валідаторамі. Пам'ятайте, що весь сенс в тому, що пошукові роботи могли краще зрозуміти зміст сторінки або сайту, а, якщо в коді помилки, то цього не відбудеться.
Сьогодні грамотна і успішна пошукова оптимізація багато в чому залежить від мікророзмітки, так що не втрачайте часу дарма. Спасибі, що були з нами!
Org?Чому?
Org і мікродані?
Org?
Отже, які ж схеми мікророзмітки є найпопулярнішими і можуть допомогти SEO?
З чого почати?