Ви знаєте, що таке schema.org, але ніяк не можете впровадити її на свій сайт? Ви прочитали купу статей по темі, але жодна з них не дала вам чіткого керівництва до дії? І начебто все зрозуміло, але коди все-одно не працюють?
Якщо ви залишали подібні коментарі і взагалі вищеописана ситуація – це про вас, не турбуйтеся. Ми допоможемо вам розібратися. У даному матеріалі ми не будемо посилати вас на сайт schema.org зі словами «Там все докладно написано, читайте». Замість цього ми постараємося в максимально доступній формі і з наочними прикладами) пояснити вам, як використовувати цю горезвісну мікророзмітку і який код куди потрібно вписувати.
Що таке Schema.org?
Досить докладно про те, що таке микроразметка Schema.org ми писали в одній з наших минулих статей. А якщо коротко, то Schema.org – це словник семантичної розмітки даних, підтримуваний всіма провідними пошуковими системами. Її мета – допомагати пошуковим роботам краще розуміти зміст сторінки і, тим самим, покращувати результати видачі.
Куди потрібно вписувати?
Ну а тепер давайте розбиратися, які коди й куди потрібно вписувати. Звернемося до конкретного прикладу. Ось так виглядає микроразметка, що описує фільм «Аватар»:
Тут ми бачимо три атрибута, і ви їх повинні будете незмінно використовувати в кожній своїй микроразметке:
Примітка. Вищенаведений скріншот був зроблений на сайті ruschema.org – проект перекладу schema.org, розвивається силами добровольців. На даний момент переведений не весь сайт. Взяти участь у перекладі може будь-який бажаючий.
Крім цих трьох атрибутів в коді присутні ще і теги. Розглянемо на іншому прикладі, тип об’єкта – Person (Осіб):
показують, де починається і закінчується опис об’єкта.
Як це зробити на практиці?
Заходимо на ruschema.org в розділ «Схеми». Вибираємо потрібний об’єкт. Припустимо, Book (Книга). Дивимося, які властивості ми хочемо вказати. І починаємо збирати код.
У вас повинно вийти приблизно наступне:
Перевірити правильність проставлення мікророзмітки можна в спеціальних сервісах Google і від Yandex.
Кілька прикладів фрагментів і кодів
Для полегшення вашої задачі ми перерахуємо кілька прикладів фрагментів і готових кодів до них. Вам залишається тільки вписати свою інформацію:
- Відео
Video: Назва відео
«Посилання на сам відеофайл — http://www.example.com/video123.flv»
– HTML-код відео. Береться з відеохостингу:
Опис відео
- Рецепт
Назва рецепта
Беремо банани, знімаємо з них шкірку. Перемелюємо в блендері і додаємо туди борошно»
Ім’я автора,
May 8, 2009
Опис рецепта
1 hour
3 банана
1 яйце
Стакан цукру
- Організація
Назва організації
Вулиця,
Місто,
Область.
Phone: Номер телефону – 206-555-1234
Важлива інформація
Якщо ви використовуєте авторство Google, і в пошуку вже відображається ваша фотографія, не використовуйте мікророзмітку Schema.org, оскільки авторство після цього може порушитися.
Приклад 1. При описі видеообъекта (videoObject), фотографія автора повністю замінюється на скріншот з відео (thumbnail), а інформація про автора переміщається в самий низ фрагменту. У деяких випадках, авторство видаляється повністю.
Приклад 2. При описі об’єкта відгук (review), відбувається те ж саме – фото автора зникає і з’являється інформація про те, кому належить цей відгук (огляд).
Який з фрагментів показує кращий CTR, на жаль, невідомо. Але ця інформація важлива, і її потрібно було донести.
Адаптація матеріалу Schema-org Guide for Beginners (Everyone Can Understand!) + Schema Cheatsheet і Structured Data: Why you should mark-up for higher CTR.