Как работает Open Graph?

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

Open Graph – разметка на сайте, обеспечивающая корректный и наиболее выгодный показ ссылки на сайт в социальных сетях. Улучшение превью возможно для большинства востребованных сетей и мессенджеров:

• ВКонтакте,
• Skype,
• Google+,
• Twitter,
• Pinterest,
• LinkedIn и др.

Зачем нужны красивые ссылки

Трудность в красивом оформлении постов, которая возникает каждый раз при желании поделиться актуальной ссылкой в социальной сети или мессенджере, все чаще встречается среди администраторов сайта. Так, вместо ожидаемого контента на выходе ссылка представляет собой пост с нерелевантной картинкой и неуместным текстом.

Решить проблему сегодня можно с помощью Open Graph, разметка позволяет вручную настраивать вид анонса страницы сайта для социальных сетей. Словарь микроданных разработали сотрудники соцсети, но адаптирован он для многих популярных сетей и мессенджеров.

Привлекательная ссылка – явный критерий успеха кликабельности и эффективности продаж.

Использование Open Graph

Внедрив в код страницы метатеги Open Graph, можно получить корректное и красиво оформленное превью ссылки.

Сайт разработчика предлагает широкий ряд тегов (лишь 5 из которых обязательны). Так, информативное превью выглядит следующим образом:

Как работает Open Graph

Рассмотрим каждый тег Open Graph по отдельности и разберемся в их значениях:

• «og:locale» — указывает локализацию (язык сайта), можно использовать значение «ru_RU» по умолчанию.
• «og:type» — указывает тип страницы (статья, новость, видео, категория и т. д.), можно использовать по умолчанию «article».
• «og:title» — указывает заголовок статьи.
• «og:description» — указывает краткое описание, которое выводится при формировании превью ссылки.
• «og:url» — ссылка на страницу сайта.
• «og:image» — ссылка на картинку, которая будет отображаться в посте.
• «og:site_name» — название сайта.

Значение каждого тега расписано, поэтому вам осталось только их заполнить и внедрить в код страниц вашего любимого интернет-ресурса.

Хочется добавить, что с внедрением протокола Open Graph рекомендуется установить на страницы сайта кнопки «Поделиться» в социальных сетях. Это упросит возможность пользователя поделиться полезной информацией о вашем сайте с другими юзерами. Ну и, безусловно, несколько упростит задачи SEO-оптимизатора при работе с биржами «лайков», которые хоть и не приносят ощутимого ссылочного эффекта, но позволяют несколько ускорить индексацию/переиндексацию при продвижении сайта. Например:

Как работает Open Graph

Open Graph аналоги

На выбор представлены и другие разметки микроданных, так, наиболее известные и востребованные словари:

• Microformats.org (узкоформатный словарь);
• Schema.org (широкие возможности микроразметки);
• Dublin Core (стандартизированный ГОСТ Р 7.0.10-2010 словарь).