Мікророзмітки для поліпшення сніппета

Використання мікророзмітки на сайті - це корисна практика, яка дозволяє зробити його зміст більш структурованим і зрозумілим для пошукових машин. Стандарт Schema.org був введений в 2011 році гігантом пошуку Google за підтримки Yahoo! і Bing і нині враховується, в тому числі, і Яндексом. За допомогою спеціальних тегів HTML-коду пошукові роботи отримують чітке уявлення про характер контенту ресурсу, що дозволяє будувати більш релевантну видачу та підвищувати якість пошуку. Сайт, в свою чергу, отримує розширений привабливий сниппет і, отже, зростання числа пошукового трафіку.

 

Створюємо товарний сниппет

Інформацію про товари та їх вартість, представлену в картках інтернет-магазину або на сторінках корпоративного сайту компанії, можна транслювати в сниппет для видачі Google і Яндекса. Щоб сформувати таке корисне доповнення в описі посилання, необхідно розмітити відповідні сторінки ресурсу за допомогою стандарту Schema.org.

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

Для формування товарного сниппета необхідно використовувати відповідні схеми (Product, Offer, AggregateOffer) та їх властивості, описані в ієрархії на сайті Schema.org (прим .: англомовний ресурс). Слід зазначити, що Яндекс враховує далеко не весь список властивостей (наприклад, немає можливості вказати інформацію про рейтинг продукту), тому товарний сніпет в даній пошуковій системі виглядає більш скромним, ніж в Google.

Розглянемо приклад семантичної розмітки для картки товару Iphone 6 інтернет-магазину "Евросеть". Сніппет даної сторінки в Google виглядає наступним чином (Мал.1):


 

Заглянемо в HTML-код сторінки, щоб побачити правила, за допомогою яких в сніпет картки товару транслюються його назва, вартість та рейтинг на підставі відгуків покупців. Атрибут itemscope дає вказівку пошуковому роботу на те, що описується певний об'єкт, itemtype називає тип об'єкта (у нашому випадку - Product):

Атрибут itemprop описує властивості об'єкта, в даному прикладі - це назва (name):

Слід підкреслити, що вельми до речі тут можна було б використовувати і властивість об'єкта «опис» (description) з розміщенням ключової інформації про товар.

Наступне правило дозволяє відобразити вартість товару в сніппеті:

І, нарешті, вказується тип об'єкта, що позначає рейтинг на підставі відгуків:

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


Детальна інформація про правила синтаксису стандарту Schema.org російською мовою і приклади побудови коду представлені в довідковій документації Яндекса і в оригіналі (прим .: англійською мовою) на офіційному сайті Schema.org.

Доповнюємо сниппет даними про компанії

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


 

За розмітку контенту сторінки контактів компанії відповідають схеми Organization і Place. У пошуковій системі Google до того ж реалізована можливість розміщення логотипу або іншого графічного елементу, який буде відображатися, наприклад, в мережі знань (праворуч від результатів пошуку).


 

 

Інші області застосування

Стандарт Schema.org також дуже популярний серед власників інформаційних сайтів і блогів. Не дивно, що для движка WordPress створено ряд плагінів для автоматичної генерації і вбудовування мікроданних в код сторінки. Досить часто в сніппеті можна побачити графічні елементи (фотографії, картинки, відео) або, наприклад, опис шуканого фільму, які привертають увагу і мимоволі мотивують пройти за пропонованою посиланням.

Такий прийом розширення сниппета застосовується для наступних ресурсів:

сайти рецептів (Recipe);

  • сайти з відеопублікаціямі, відеохостінги (VideoObject);
  • новинні портали, блоги (NewsArticle, BlogPosting);
  • сайти питань і відповідей (Question і Answer);
  • сайти мобільних і веб-додатків (SoftwareApplication);
  • сайти з каталогами фільмів, книг, рефератів і т.д. (Movie, CreativeWork);
  • енциклопедичні, словникові ресурси (ScholarlyArticle);
  • сайти-афіші з публікацією подій (Event).

І це лише мала частина прикладів застосування семантичної розмітки. Кількість доступних наборів класів Schema.org для опису різного роду об'єктів і їх властивостей налічує декілька сотень варіантів. Провідні пошукові системи на поточний момент підтримують не всі доступні типи мікроданних, однак постійно працюють над областю їх розширення.

 

Висновки

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