1. Что такое протокол Open Graph?
2. Кто должен использовать Open Graph Protocol?
3. Нативные рекламодатели также должны использовать Open Graph Protocol:
4. Когда и где вы используете мета-теги Open Graph?
5. На странице Открыть настройки графика:
6. Настройки Open Graph для всего сайта:
7. Вывод кода метатегов Open Graph:
8. Что происходит, когда вы не используете теги Open Graph?
9. Тестирование мета-тегов Open Graph перед публикацией статьи
10. В заключение, вот что мы узнали о протоколе Open Graph и о том, как он максимизирует количество кликов...

Возможно, вы слышали о метатегах раньше. Они используются при обработке вашего SEO сайта. Однако существует новый тип мета-тегов, который становится все более распространенным в современном мире стратегий электронного маркетинга и генерации трафика, которые выходят за рамки простого SEO.

Этот новый набор мета-тегов носит общее название «Open Graph Protocol». И если вы онлайн-издатель, не пользующийся ими, то скоро вам это понадобится.

Мы объясним, почему ниже.

Но обо всем по порядку, давайте узнаем, что такое метатеги Open Graph Protocol и какова причина их существования. Неужели «люди из Интернета» просто хотят сделать жизнь бизнесмена более сложной? Не совсем. Эта разработка на самом деле для вашей выгоды и помогает привлечь больше и более целенаправленный трафик на ваш сайт.

Что такое протокол Open Graph?

Протокол открытого графика это способ, с помощью которого сайты могут делиться контентом, размещенным по внешнему URL, более наглядным и убедительным образом.

Наиболее распространенное место, где вы, вероятно, уже взаимодействовали со страницей, использующей протокол Open Graph, - это когда вы делитесь ссылкой на Facebook. Вы знаете предварительный просмотр, который генерирует Facebook, когда вы вставляете ссылку в строке состояния? Этот предварительный просмотр создается путем «захвата» (так сказать) информации с внешней веб-страницы и отображения ее в Facebook, чтобы ваши друзья с большей вероятностью нажимали на нее. Вот пример из моего фида в Facebook, где я опубликовал статью на TheStraight.com:

Это намного привлекательнее, чем обычная текстовая ссылка, верно? Люди в Facebook тоже так думали. Поэтому они разработали метатеги Open Graph Protocol, чтобы сделать обмен ссылками в сети лучше для всех.

До появления мета-тегов Open Graph Protocol, когда ссылка размещалась в Интернете, не было большого количества информации, которую «получающий» сайт мог бы «схватить», чтобы показать пользователю, на что он будет нажимать.

У сайтов были метатеги, и это было прекрасно для страниц результатов поисковой системы (SERP), которые все основаны на тексте и довольно ограничены в информации, которую они должны отображать для поисковых запросов. Короче они были:

• Мета Название
• Мета Описание
• Мета-ключевые слова (которые мы больше не используем для SEO, но это тема для другой статьи)

И это все.

Например, мета-теги, используемые для генерации предварительного просмотра SERP для официального сайта Open Graph Protocol:

SERP также показывают URL, и результат вывода выглядит следующим образом - представление, с которым вы, возможно, уже знакомы:

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

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

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

В Интернете существуют другие протоколы для проведения таких различий. Например Schema.org является одним из них, и у него есть свои сценарии использования. Но для публикации случаев, когда ссылка должна сопровождаться фрагментом информации (например, заголовок, изображение и вводный текст), обычно выбирают Open Graph Protocol.

Протокол Open Graph теперь используется как «золотой стандарт» для крупных социальных сетей. Facebook, Google+ и LinkedIn все используют его. Вот несколько ссылок:

Даже Twitter, который имеет свою собственную разметку для использования мета-тега (для создания Карты Твиттера ) будут отступление на свойствах Open Graph если он не может найти специфичные для Twitter Card теги для отображения.

И Pinterest, который использует Богатые булавки , основывает эти выводы на Open Graph Protocol или разметке Schema.org (и несколько других опций в конкретных случаях).

Кто должен использовать Open Graph Protocol?

Все издатели онлайн-контента, которые хотят, чтобы их контент чаще щелкали по сети, должны использовать Open Graph Protocol. Это относится к общему доступу в социальных сетях, а также к более сложным случаям, таким как использование нативных рекламных сетей.

Нативные рекламодатели также должны использовать Open Graph Protocol:

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

Здесь предполагается, что для того, чтобы издатель контента, такой как новостной сайт, мог показывать эффективные объявления, на которые будут чаще нажимать, они должны быть связаны с тем, что пользователь уже делает и хочет видеть. Психология этого объясняется более подробно в это видео , выпущенный командой разработчиков Facebook, когда они решили продвигать нативную рекламу в своей сети.

Короче говоря, существует меньшая вероятность монетизации сайта с помощью баннерной рекламы. Но показать пользователю статью на интересную тему, связанную с тем, что он уже читает? Сейчас мы говорим.

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

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

Это то же самое, что помочь поисковой системе найти ваш контент, а затем отобразить его для релевантных поисковых запросов, используя «обычные» HTML-метатеги. Но с нативной рекламой для этого требуется и доступно больше данных.

Как издатель и создатели контента автоматически находят свое «соответствие» через собственный рекламный обмен? С мета-тегами Open Graph.

Правильно, «традиционных» метатегов HTML недостаточно. Если вы хотите повысить рейтинг кликов (CTR), в этом вам помогут изображения и специально разработанные формулировки.

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

Когда и где вы используете мета-теги Open Graph?

Вы можете использовать метатеги Open Graph, если хотите побудить пользователей нажимать на ваш контент со всего Интернета. Как правило, это будет наиболее важно для вашего блога или публикации, так как эти страницы вашего сайта обычно содержат «разделяемый» контент, который пользователи хотят видеть. Но нет никаких причин, по которым вы не можете использовать метатеги Open Graph на своих страницах продаж, страницах продуктов, страницах контактов и т. Д.

Чтобы вставить метатеги Open Graph, вам необходимо убедиться, что вы соблюдаете форматирование разметки, описанное на веб-сайте Open Graph Protocol (вам может понадобиться веб-разработчик, чтобы помочь вам в этом):

http://ogp.me/

Они всегда должны появляться в разделе <head> вашего сайта.

Если вы используете систему управления контентом (CMS), такую ​​как WordPress или Drupal, вы, как правило, сможете найти плагин для своего веб-сайта, который может достаточно хорошо обрабатывать протокол Open Graph, без необходимости много знать язык кодирования.

Например, Yoast SEO плагин для WordPress предлагает как минимум две изящные функции для использования Open Graph Protocol:

На странице Открыть настройки графика:

Приведенная ниже информация предполагает, что вы используете плагин Yoast SEO, но принцип этих настроек и входных данных может быть применен к любому плагину CMS, который предлагает вам следующие элементы управления:

В той же области, где вы настраиваете свои метатеги SEO, анализируете свой контент, настраиваете свои настройки роботов и т. Д. Для страницы или публикации, вы также можете нажать «Социальные сети» (теперь обозначается значком), чтобы определить, какие Настройки Open Graph должны быть:

Имейте в виду, что плагин Yoast SEO может время от времени изменять внешний вид и дизайн, поэтому скриншоты в этих примерах следует использовать только в качестве руководства.

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

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

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

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

Обратите внимание, что в этом случае, фотография только цыпленка или фотография ТОЛЬКО Обамы на телефоне не были бы такими привлекательными сами по себе. Но сложите их вместе, и теперь мы превратили читателей в любопытных кошек!

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

Вот еще один пример из Harvard Business Review, хотя он не относится непосредственно к названию статьи, но, кажется, используется в качестве общего изображения в стиле логотипа, что очень удобно, если вам больше нечего показать (лучше, чем ничего):

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

Настройки Open Graph для всего сайта:

При использовании плагина Yoast SEO, вы можете следовать эти инструкции на их сайте, чтобы теги Open Graph появлялись в области <head> ваших страниц. Вы также можете использовать настройки в разделе «Социальные сети» на панели инструментов WordPress для настройки:

• Frontpage Open Graph Settings (т.е. ваша домашняя страница)
• Изображение по умолчанию (если вы его не указали, чтобы убедиться, что что-то может пойти в этом месте, как в приведенных выше примерах логотипов)
• Идентификатор пользовательского приложения администратора Facebook (для предоставления возможности Facebook Insights, которая может сообщать вам, сколько людей посещают ваш сайт по ссылке в Facebook)

Вот как могут выглядеть эти экраны настроек (и вы можете захотеть найти что-то похожее, если вы используете другой плагин для управления вставками кода Open Graph):

И далее вниз на этой странице ...

Вывод кода метатегов Open Graph:

Код, который выводится при настройке метатегов Open Graph с помощью плагина, может различаться, в зависимости от масштабности плагина и информации, которую вы вводили в различных областях настроек. Ниже приведен пример, который можно найти при просмотре исходного кода веб-страницы (т. Е. Он не отображается на «переднем конце» вашего сайта для ваших читателей). Мы прокомментируем каждую строку, чтобы помочь вам понять, для чего предназначен каждый тег:

→ Это определяет, что страница написана на английском языке США. Вы можете использовать коды страны и языка, чтобы определить локаль, которую вы хотите использовать. Используйте эту ссылку для получения дополнительной справки. Настройка языкового стандарта для сайта WordPress с помощью плагина Yoast SEO требует следующего эти инструкции ,

→ Тип контента. Есть и другие типы объектов ты можешь использовать.

→ Заголовок, который отображается как заголовок статьи при отображении фрагмента с использованием метаданных Open Graph.

→ Описание статьи или содержания страницы, на которую делается ссылка.

→ URL страницы. Для этого следует использовать канонический URL-адрес внутреннего сайта. Для получения дополнительной информации о канонизации см. Эта статья ,

→ Название всего сайта.

→ Учетная запись Facebook, с которой связана эта веб-страница.

→ Категория или раздел сайта, на котором появляется эта статья.

→ Все три вышеупомянутых тега относятся к дате и времени, чтобы отметить «свежесть» статьи.

→ Единый идентификатор пользователя или идентификатор приложения для подсчета данных для Facebook Insights. Увидеть эта ссылка для получения дополнительной информации.

→ Изображение для отображения в предварительном просмотре фрагмента.

Есть ли больше тегов, чем показано выше? Там, безусловно, есть! Тем не менее, они могут получить довольно подробно. Кроме того, в Интернете есть множество ресурсов, которые уже отдают должное их инструкциям. Поэтому мы оставим их вне этой статьи. Google твой друг!

Что происходит, когда вы не используете теги Open Graph?

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

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

И если система не читает ваши «традиционные» метатеги, а также не может сканировать ваш контент, чтобы сформулировать предварительный просмотр фрагмента, ссылки на ваши статьи могут отображаться только в виде простого URL (или может произойти какой-то другой неожиданный результат). Вид "бла" и скучно, верно? Никто не поймет причину, по которой они должны нажать на эту ссылку, потому что она не будет сопровождаться какой-либо информацией о контенте, который они могут найти на странице.

Тестирование мета-тегов Open Graph перед публикацией статьи

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

1. Хорошо получить представление о визуальном выводе, который пользователи ожидают увидеть во фрагменте. Затем вы можете внести любые необходимые изменения или исправления в код, прежде чем продвигать свой контент в Интернете.
2. Вы можете очистить кэш неправильного изображения, прежде чем оно застрянет в системе Facebook.

Когда вы создаете предварительный просмотр статьи, которой хотите поделиться на Facebook, Facebook может взять изображение из тега Open Graph и сохранить его в своем кэше. Кэш похож на «ящик памяти», где сайт (или другое приложение) может хранить информацию, которую он «видел» ранее. Таким образом, в следующий раз, когда кто-то захочет отобразить его на своем экране, сайт не займет много времени, пытаясь получить его снова.

Поэтому, если у вас случайно было неправильное изображение в теге изображения Open Graph, вы можете использовать отладчик Facebook, чтобы очистить кэш этого изображения. Таким образом, он покажет самое последнее ссылочное изображение вашей статьи.

Вот ссылка на отладчик Facebook Sharing:

https://developers.facebook.com/tools/debug/

Однако обратите внимание, что эта функция применяется только к Facebook, а не к другим сайтам, которые могут использовать метатеги Open Graph.

В заключение, вот что мы узнали о протоколе Open Graph и о том, как он максимизирует количество кликов на ваш контент:

Вот краткое изложение того, что мы узнали в этой статье:

1. Open Graph Protocol - это набор мета-тегов, предназначенных для того, чтобы публикация и читатели могли делиться контентом в сети.
2. Мета-теги Open Graph необходимы для продвижения вашего контента в Интернете, в дополнение к «традиционным» метатегам, используемым для SEO.
3. Open Graph Protocol не только используется почти во всех крупных социальных сетях, но также используется для помощи нативному рекламному программному обеспечению при поиске контента для продвижения на соответствующих сайтах.
4. По-настоящему хорошее использование мета-тегов Open Graph означает обращать внимание на привлекательные заголовки, писать заманчивые вводные тизеры и включать в себя потрясающие изображения. Кроме того, вам нужно подобрать все эти размеры в соответствии с макетами сети контекстной рекламы, в которой вы хотите поделиться ими.
5. Есть плагины, которые могут обрабатывать метатеги Open Graph в простом, не кодирующем интерфейсе. Популярным для WordPress является плагин Yoast SEO, но есть и другие.
6. Если вы не хотите использовать плагин для метатегов Open Graph, обязательно включите их в раздел <head> HTML-кода каждой страницы вашего сайта.
7. Протокол Open Graph должен соответствовать определенным форматам в своей разметке. Официальный сайт протокола Open Graph объясняет это в деталях.
8. Вам следует проверить метатеги Open Graph с помощью отладчика общего доступа Facebook, чтобы проверить наличие возможных ошибок и очистить кэш любых изображений, которые вы хотите заменить, прежде чем делиться ими.

И вот оно! Вы на пути к созданию лучшей видимости своего контента в Интернете с помощью метатегов Open Graph!

Похожие

Комментарии