Харьков (057)
78-00-333
меню
мы в соцсетях
Подпишитесь на новые статьи

Мануал по микроразметке сайта Open Graph и Schema.org

4.8 из 5 на основе 4 оценок
25.08.2021

Для привлечения трафика используются различные методы. Но бывает, что даже испробовав большинство из них, результата добиться не удается. Это значит, что следует обратить внимание на выдачу конкурентов в поисковиках и признать: пришло время задуматься о микроразметке.

Микроразметка сайта – схематическая структуризация страниц, предназначенная для предоставления поисковым системам и пользователям дополнительной информации. Результат всегда один – онлайн-ресурс становится более привлекательным. Область его присутствия увеличивается, растет и вероятность того, что посетитель кликнет на ссылку. Если сказать проще, микроразметка является инструментом для увеличения конверсии в разы.

Многие ошибочно думают, что структурирование данных невозможно увидеть невооруженным глазом. Но достаточно только взглянуть на отображение запроса в поисковике – сразу становится понятно, как микроразметка влияет на корректное отображение контента. Если же увиденное не впечатляет, необходимо заняться тегами и атрибутами, прописав которые вы поможете поисковым роботам давать пользователям наиболее обширную информацию (например, стоимость товара, наименование, фото и описание).

Как микроразметка влияет на сниппет страниц?

Для малоискушенных в сфере IT объясним: сниппетом принято называть текстовый фрагмент страницы, релевантный запросу. Он отображается в поисковой выдаче вместе со ссылкой на сайт. Посетитель, бегло осмотрев информацию фрагмента, получает представление о том, насколько полезен для него будет переход по ссылке.

Микроразметка делает сниппет более презентабельным и информативным. При успешной реализации юзеру даже не обязательно переходить по ссылке, чтобы понять, о чем конкретно идет речь на странице. Вместе с тем, потенциальный клиент понимает: переход на сайт окажется очень даже нужным. Это делает сайт клиентоориентированным и привлекательным не только для пользователей, но и для поисковых роботов.

Правильно реализованная микроразметка – залог повышения кликабельности (CTR), которая также будет учтена поисковиками.

Разметка – язык веб-сайта с гарантией преимуществ

После внедрения микроразметки владельцы сайтов удивляются тому, насколько она оказывается полезной. Среди достоинств структуризации страниц важно назвать:

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

Но важно знать, что атрибуты тоже «любят» норму: если перестараться, есть риск потерять кликабельность. Это происходит тогда, когда сниппет содержит столько информации, что нужды перейти по ссылке пользователь не испытывает. Кроме того, если использовать неоправданное множество атрибутов и разные виды синтаксиса для страниц, код получится огромным «неподъемным».

О словаре и синтаксисе SEО-микроразметки

Поговорим об азах внедрения разметки. Для этого определим два основных элемента для удачного микроформата:

  • словарь – перечень инструментов (свойства и классы), который помогает программистам выделить ключевые аспекты контента;
  • синтаксис – набор тегов, метатегов, фраз, помогающих реализовать словарь.
  • Говоря о словарях, следует отметить, что их достаточно много. Чаще всего используются:
  • Schema.org – позволяет создавать расширенные сниппеты и увеличивает релевантность (сюда, кстати, входят Opencart – вторая по рейтингу схема с определенным синтаксисом, и отдельный модуль Drupal); 
  • HTML-шаблоны microformats.org – микроформат, повышающий ценность небольших описаний продуктов и услуг;
  • Open Graph – используется на Facebook-страницах;
  • FOAF – дает возможность описывать людей и проводить параллели взаимосвязи личностей;
  • Dublin Core – используется для предоставления информации о литературных произведениях, экспонатах;
  • Good Relations – помогает в наполнении каталожных страниц и товарных карточек для онлайн-торговли.

В этом ключе нельзя упустить еще одну составляющую Schema.org: Data Vocabulary – микроразметку, в свое время презентованную Гуглом, первооткрывателем термина «хлебные крошки». И это только самые популярные словари – на практике их гораздо больше.

В свою очередь, синтаксис применяется программистами для того, чтобы дать представление о размещении различных элементов. Здесь стоит назвать такие единицы:

  • свод микроданных – itemscope, itemtype, itemprop;
  • RDFa – используется для интерпретации человека, его сущности;
  • JSON-LD – презентует широкий спектр объектов на страницах.

 

Типы данных микроразметки

Современные роботы-поисковики реагируют на теги и атрибуты, объединенные с учетом содержания. Таким образом, можно выделить несколько групп структурированных данных:

  • контакты;
  • информация об организации и ее логотип;
  • цепочка навигации – уже упомянутые нами «хлебные крошки»;
  • визуальный контент – фотоиллюстрации и видеоролики;
  • товарные карточки – включают описания, рейтинги, наличие;
  • отзывы;
  • рецепты.

Реализовать микроразметку можно с использованием синтаксиса разных типов. Многие создают коды самостоятельно и внедряют их в сайты, но часто помогают программы, связанные с плагинами «движка» (WordPress, Drupal, Joomla, OpenCart и прочие).

Как реализовывается микроразметка логотипа?

Главная цель этой разметки – указать, что изображение «шапки» представляет собой лого. Пошагово процесс выглядит так: определяется логотип на сайте, контейнеру присваивается атрибут itemscope, указывается предназначение картинки (в этом случае – данные организации или компании) при помощи itemtype, размещаются itemprop="url" и itemprop="logo". Последние два элемента являются ссылками на «главную» и непосредственно на картинку лого.

Разметка навигационного меню

Это, опять же, о «хлебных крошках». Микроразметка в этом случае делается поэтапно: присвоение контейнеру itemscope, указание типа контейнера с применением itemtype, размечивание itemprop="itemListElement" – основных элементов страницы. Заключительный шаг – повторное указание itemscope и itemtype. Это пример с использованием словаря Schema.org, и синтаксиса JSON-LD.

Микроразметка отзывов и товарных карточек

Такая микроразметка предусматривает использование тега элементом itemtype="https://schema.org/Product". Он позволяет разметить:

  • каталожную информацию (наименование, бренд, цена, фото, описание);
  • рейтинг товара или услуги;
  • комментарии (с указанием имени пользователя, оценки плюс непосредственно текст).

Код, который будет способствовать отображению рейтинга, обязательно прописывается с учетом средней оценки на данный момент [value], максимальной оценки [max_rating], минимальной оценки [min_rating], количество оценок и комментариев – [num_votes] и [num_votes_review].

Микроразметка страниц категорий: особенности

Возьмем на вооружение синтаксис JSON-LD и словарь Schema.org – они позволяют прописывать:

  • название категории;
  • самую низкую и самую высокую цену товаров;
  • валюту;
  • показатель средней и максимальной оценки, общее количество оценок;
  • рейтинг.

Что еще полезно знать о микроразметке?

Микроразметка возможна и для видео-контента – для этого в коде указываются url-ссылка, название, описание, время воспроизведения, рекомендации по возрастному цензу, изображение для предварительного просмотра, дата.

Для максимальной эффективности микроразметки обязательно нужно проверить правильность кодов. Это позволяет увидеть ошибки и быстро их исключить.

Проверить можно при помощи таких валидаторов:

  • Google;
  • Validator.nu;
  • Structured Data Linter

Мы, со своей стороны, рекомендуем Гугл – он выделяет недочеты, и программист превращает код с ошибкой в рабочий.

Правильная микроразметка никогда не перегружает сайт. Страницы быстро грузятся, корректно отображаются в браузерах. Поэтому процесс реализации всегда предусматривает определенный алгоритм. Лучше всего составить план и неукоснительно следовать ему – так CTR обязательно повысится.

мы в соцсетях
Подпишитесь на новые статьи