24.02.2021
122

Open Graph

Андрей Андреев
автор ApiX-Drive
Время прочтения: ~2 мин

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

Данный стандарт был разработан специалистами Facebook для упорядоченного отображения ссылок на сторонние сайты на страницах этой соцсети. На сегодняшний день протокол используется не только FB, но также многими другими популярными сервисами: Twitter, Pinterest, VK, Slack, Telegram, WhatsApp, Viber.

Микроразметка Open Graph необходима для того, чтобы ссылки на сайт красиво отображались на страницах соцсетей или мессенджеров: с заголовком, описанием, изображением и тегами. Она включает в себя набор мета-тегов, которые размещаются в элементе HEAD HTML-кода веб-страницы. При помощи разметки OG вебмастер может изменять вид и структуру сниппетов для превью страниц своего сайта в соцсетях, делая его более информативным и привлекательным.

Протокол Open Graph состоит из такого набора мета-тегов:

  • og:title (заголовок ссылки)
  • og:description (анонс объемом до 295 символов)
  • og:url (ссылка на страницу)
  • og:image (ссылка на изображение превью)
  • og:type (тип веб-страницы)
  • og:site_name (имя сайта, которое будет видно в превью)

Помимо этого, при помощи тегов Open Graph можно настроить и опциональные свойства: mime-тип изображения и его размеры (число пикселей в ширину и высоту). Синтаксис микроразметки OG есть в свободном доступе в ряде источниках: на сайте https://ogp.me/ опубликована документация на английском языке, а на https://www.ruogp.me/ – русскоязычная.

Пользователи могут внедрить теги Open Graph в HTML-код страниц своих сайтов вручную или же при помощи специальных плагинов. Эти расширения помогают автоматически прописать микроразметку на страницах сайтов, работающих на WordPress, Joomla, Opencart, Magento, Drupal, Битрикс. Проверить ее валидность также можно через разные сервисы: Open Graph Check, Яндекс-валидатор, отладчик репостов Facebook и т.д. Еще одна возможность протокола – создание в Google AdSense блока с рекомендуемым контентом.

***

Вернуться на главную Энциклопедия eCommerce

Настроить интеграцию без программистов ApiX-Drive

Статьи о маркетинге, автоматизации и интеграциях в нашем Блоге