Разметка Open Graph — это один из эффективных способов оптимизации семантической разметки, что поможет привлечь на ваш сайт новый трафик из соцсетей. Также, микроразметка позволяет поисковым работам идентифицировать доступные типы информации на сайте, структурировать ее в социальных сетях.
Основные преимущества использования инструмента Open Graph — это максимальная информативность сниппета, привлекательный визуал для пользователей. Конечно, микроразметка не имеет прямого влияния на SEO, но благодаря этому инструменту можно значительно улучшить поведенческие факторы сайта.
Возможности и особенности разметки Open Graph
Основная возможность, которую перед пользователями открывает Open Graph — это оформление максимально привлекательных ссылок, с картинками и описанием, для распространения в социальных сетях.
Если вы попытаетесь осуществить репост статьи из блога на сайте в аккаунт на Facebook без разметки Open Graph — сразу заметите неприятные нюансы и поймете, почему все-таки стоит ее использовать. Именно микроразметка позволяет указывать заголовок и анонс, что должны быть в публикации при репосте страницы, адрес и параметры изображения, что будет закреплено в качестве обложки.
Микроразметка была создана разработчиками Facebook и первоначально использовалась только на просторах этой социальной сети. В настоящее время этот протокол поддерживается такими платформами, как ВКонтакте, Твиттер, LinkedIn, Телеграмм, Viber, Slack и т.д.
Пример разметки в Facebook
Синтаксис разметки Open Graph
Вы можете ознакомиться с документацией, которая пригодится в работе с разметкой Open Graph в таких источниках:
Краткую информацию об обновлениях и сжатые инструкции вы можете найти в справке Яндекс.Вебмастер. Также в справке вы можете найти ответы на основные вопросы о разметке, основные теги, помогающие реализовать протокол на сайте. Стоит обратить внимание на пособия по использованию Open Graph для отдельных соцсетей:
Микроразметка — это комплекс метатегов, которые используются для того, чтобы передать нужную информацию социальным сетям. Теги также указывают на контент для репоста, тип и способ его отображения. Микроразметка Open Graph основана на синтаксисе RDFa, что предполагает использование дополнительных тегов <meta> в разделе <head>. Под тегом <meta> стоит обязательно указать два атрибута — «property» и «content». Атрибут «property» часто наделяют обязательными и опциональными свойствами.
Обязательные теги
Предлагаем ознакомиться с обязательными свойствами и тегами, входящих в атрибут «property»:
- og: title — заголовок или название, характеризующее страницу.
- og: type — тип материала, который размещен на странице.
- Видео <meta property = ‘og: type’ content = «video.movie» />.
- Аудио: <meta property = ‘og: type’ content = «music.song» />.
- Статья: <meta property = ‘og: type’ content = «article» />.
- og: image — URL-адрес картинки, которая будет сопровождать материал.
- og: url — каноническая ссылка на веб-страницу, которая распространяется в соцсети.
Опциональные теги
Также при работе с микроразметкой вы можете использовать такие теги:
- og: site_name — задает имя сайта, которое отображается в предыдущем показе.
- og: description — расширенное описание страницы, необязательно добавлять, ведь оно не всегда отображается в режиме предварительного просмотра.
- og: locale — тег, задает язык и соответствующий регион в формате «язык_регион».
Также вы можете подобрать ряд дополнительных тегов для отображения контактных данных, месторасположение, языка и других элементов на странице ogp.me. Использование опциональных тегов пригодится, если вы добавляете страницу с информацией, что требует дополнительных характеристик.
Публикация видео с использованием Open Graph
Видеостоки, онлайн-хранилища и ресурсы с большим количеством видеоконтента могут использовать протокол микроразметки Open Graph для улучшения ранжирования контента на платформе Яндекс.Видео. В разметке Open Graph доступны специальные метатеги, с помощью которых можно детально охарактеризовать ролик и передать Яндекс необходимую информацию о нем:
- og: title — краткое название ролика, что не должно превышать 1000 символов.
- og: description — описание ролика, объемом от 150 до 1000 символов.
- og: url — URL страницы на которой размещено видео.
- og: video — путь к видеоплееру или файлу.
- og: image — ссылка на картинку, которая будет использована в качестве заставки видео.
- og: type — категория, или тема к которой будет отнесено видео.
- og:video:type — все кодеки, доступные для данного формата ролика.
- ya:ovs: upload_date — дата и время загрузки.
- ya:ovs:adult — используется для роликов, входящих в категорию контента «для взрослых». Если это так, укажите «true», если нет — «false».
- video:duration — продолжительность видеоролика (указывается в секундах с округлением до целого числа).
Сервисы и плагины для работы с Open Graph
Доступны несколько способов внедрения Open Graph на вашем сайте:
Первый и самый простой — это использовать соответствующие плагины для CMS, которая установлена на вашем сайте. Существует множество удобных вариантов, позволяющих быстро разместить микроразметку. Также, в сайтах на платформе Tilda предусмотрен конструктор с встроенной оптимизацией страниц для социальных сетей.
Второй и более сложный вариант — это размещение протокола непосредственно в код страниц вашего сайта. В начале html-кода следует вставить такую часть <html prefix = «og: http: //ogp.me/ns#»>. Впоследствии, используйте нужные теги между <head> и </ head>.
Среди самых популярных сервисов и плагинов для работы стоит выделить:
- All in One SEO Pack и Yoast SEO для WordPress.
- Open Graph для Битрикс.
- Open Graph для Opencart.
- Open Graph для Joomla.
Как проверить корректность микроразметки?
В настоящее время доступны три метода проверки правильности применения разметки:
- Отладчик репостов от Facebook.
- Валидатор микроразметки от Яндекс.
- Сервис Open Graph Check.
Доступен также отдельный валидатор для микроразметки в социальной сети Twitter. Все эти инструменты пригодятся, если вы не уверены в привлекательности объявления, или обнаружили ошибку и хотите ее исправить.
комментариев