Как работать с Open Graph
Поисковые системы обращают внимание на поведенческие факторы, в частности — внимание к сайту в социальных сетях. В свою очередь, протокол Open Graph позволяет использовать возможности соцсетей при поисковой оптимизации в полную силу. К тому же, повышает кликабельность ссылок на сайт, которыми делятся пользователи в своих профилях.
Микроразметка: что нужно знать SEO-специалисту о словарях и синтаксисе Подробнее об этих факторах читайте в нашем посте «
Протокол Open Graph создан специалистами Facebook. Зачем его использовать? Чтобы сделать предпросмотр (превью) веб-страниц в социальных сетях смотрибельным. А в глобальном смысле — для воплощения идеи семантической паутины. То есть стандартизации всей информации во Всемирной паутине, чтобы она стала пригодна для автоматической обработки.
Зачем внедрять Open Graph
Сейчас Open Graph поддерживают большинство популярных соцсетей и мессенджеров:
Протокол также используется для передачи данных в Яндекс.Видео и помогает качественнее работать функции «Блоки рекомендуемого контента» в AdSense.
Давайте подробнее рассмотрим, что произойдет, если не внедрить Open Graph на своем сайте.
Вот некоторые образцы предпросмотра в Facebook веб-страниц без разметки:
Facebook не понимает, какие элементы подгружать в предпросмотр, поэтому берет любую картинку со страницы (может взять даже рекламный баннер). К тому же, полностью загружает заголовок.
Теперь примеры страниц с разметкой:
Предпросмотр выглядит привлекательнее и кликабельнее потому, что в разметке указаны выбранные нами изображение, заголовок и описание.
Важно: заголовок и описание, по желанию, могут отличаться от title и description веб-страницы.
Open Graph позволяет собственноручно сформировать желаемый сниппет для превью страницы в соцсетях.
Истории бизнеса и полезные фишкиОсновные теги протокола Open Graph
Разметкой предусмотрено много свойств (тегов). Основные:
- og:title — заголовок, который хаpaктеризует страницу и отображается внешне.
- og:type — тип основного содержимого страницы. Например:
- видео: ;
- музыка: ;
- статья: .
- og:image — URL изображения, которое отобразится в предпоказе.
og:url — канонический URL веб-страницы. Он используется как идентификатор объекта (веб-страницы). Например:
Пример кода, если задействовать только основные свойства:
<html prefix=\"og: https://ogp.me/ns#\"><head><meta property=\"og:title\" content=\"Example title\" /><meta property=\"og:type\" content=\"article\" /><meta property=\"og:url\" content=\"https://www.site.com/example\" /><meta property=\"og:image\" content=\"https://site.com/images/example.jpg\" />...head>...html>Рассмотрим не основные, но важные и полезные теги при продвижении:
- og:site_name — задает имя сайта, которое отображается в предпоказе.
- og:description — описание страницы (элемент подгружается не всегда. Иногда, к примеру, Facebook может не показывать описание в превью).
Вот все теги, которые влияют на внешний вид предпросмотра:
Дополнительные необязательные теги
- og:locale — задает язык и регион в формате «язык_РЕГИОН». Например:
Если свойство не задано, по умолчанию язык и регион «en_US».
Код языка нужно указывать по ISO 639.2, а страны по ISO 3166-1.
- og:audio – указывает URL аудиофайла;
- og:video – указывает URL видеофайла.
Например:
Как использовать дополнительные свойства тегов
Теги могут содержать дополнительные свойства. Например, у og:image такие:
- og:image:secure_url — задает URL картинки, который работает на HTTPS;
- og:image:width — число пикселей в ширину;
- og:image:height — число пикселей в высоту;
- og:image:type — задает MIME тип изображения (список существующих MIME-типов).
В коде это выглядит так:
<meta property=\"og:image\" content=\"https://site.com/example.jpg\" /><meta property=\"og:image:secure_url\" content=\"https://site.com/example.jpg\" /><meta property=\"og:image:type\" content=\"image/jpeg\" /><meta property=\"og:image:width\" content=\"500\" /><meta property=\"og:image:height\" content=\"400\" />Если необходимо задать разрешение сразу для нескольких изображений, можно использовать массив. Дополнительное свойство присваивается первому родительскому тегу сверху.
Например, есть три картинки с разным разрешением image1, image2, image3. Код будет выглядеть следующим образом:
<meta property=\"og:image\" content=\"https://site.com/image1.jpg\" /><meta property=\"og:image:width\" content=\"800\" /><meta property=\"og:image:height\" content=\"600\" /><meta property=\"og:image\" content=\" https://site.com/image3.jpg\" /><meta property=\"og:image\" content=\"https://site.com/image2.jpg\" /><meta property=\"og:image:height\" content=\"500\" />То есть, у image1 размер 800х600, у image2 500 пикселей в высоту, а ширина не указана,
у image3 размеры не указаны,
Разметка позволяет подстраховаться, указав, например, альтернативную картинку. Если первый URL будет недоступен, то в предпросмотр подгрузится вторая картинка. Очередь (приоритет) — сверху вниз.
Например:
<meta property=\"og:image\" content=\"https://site.com/example.jpg\" /><meta property=\"og:image\" content=\"https://site.com/example1.jpg\" />Если картинка https://site.com/example.jpg недоступна, подгрузится следующая https://site.com/example1.jpg.
Как внедрять Open Graph
Существуют несколько способов внедрения протокола Open Graph на сайте.
Первый и легкий — использовать плагины для CMS (если сайт сделан на CMS, для которой существуют такого рода плагины). Например, для WordPress и Для Joomla!.
Второй вариант посложнее — внедрить протокол напрямую в код страниц.
Сначала нужно обозначить, что страница использует протокол Open Graph. Для этого в открывающем теге указать атрибут prefix со значением my_namespace: https://example.com/ns#
Выглядит это так:
Сами же свойства (теги) нужно располагать между открывающим
и закрывающим , то есть внутри элемента .Способ подойдет сайтам, которые не используют CMS или же используют, но нет подходящего плагина.
Чтобы проверить правильность внедрения разметки можно воспользоваться специальным инструментом от Facebook или сервисом Open Graph Check.
Ещё больше тонкостей при продвижении в социалках — опыт наших экспертов в услуге SMM:
Хочу, чтобы мои соцсети продвигали маркетологи NetpeakВыводы
Open Graph —инструмент для формирования превью, который поддерживают большинство социальных сетей и мессенджеров. С помощью Open Graph можно:
- Рекламировать свой сайт в социальных сетях, создавая корректные превью страниц.
- Привлекать трафик из соцсетей кликабельными превью.
- Формировать не случайный, а продуманный предпоказ страницы.
- Наращивать поведенческие факторы и популярность среди пользователей соцсетей, которые будут репостить, лайкать и комментировать красивые превью.
Существуют несколько способов внедрения протокола Open Graph на сайте:
- Первый и легкий — использовать плагины для CMS (если сайт сделан на CMS, для которой существуют такого рода плагины).
- Второй вариант посложнее — внедрить протокол напрямую в код страниц.
Подписывайтесь на Telegram-каналы основателей Netpeak
Комментарии:
Представляем Netpeak Journal — новый этап развития блога Netpeak...
24 09 2023 0:29:38
Чем вам может пригодиться это исследование? Понимания стоимость конверсии и необходимое количество конверсий, вы можете прогнозировать, сколько денег на рекламу нужно выделить. Читать!...
23 09 2023 10:30:44
Начинаем серию постов в режиме реалити-шоу о подробностях продвижения крупного игрока бизнеса email- и sms-рассылок — компании UniSender....
22 09 2023 17:38:20
Мы достигли поставленных на старте продвижения целей: вернули потерянный трафик, получили дальнейший рост видимости сайта и увеличили доход....
21 09 2023 16:26:20
Система почтового маркетинга. Как удержать доверия подписчиков одним приветственным письмом...
20 09 2023 13:32:24
Рынок мобильных приложений и его глобальные тренды из исследования App Annie...
19 09 2023 1:42:59
Как говорят легенды, на создание дизайна этих носочков Sammy Icon вдохновили рисунки на стенах храма Темпло Майор в древнем городе Теночтитлан. К сожалению, город сейчас разобрали перуанские строители, но память о нем осталась в киевских носках...
18 09 2023 11:25:21
Безопасное соединение, которое положительно оценивают не только поисковые роботы, но и пользователи. Особенно, если на сайте предстоит оставить личные данные. Читать!...
17 09 2023 17:27:31
В основе продвижения любых продуктов фигурирует ЦА и её потребности. Рассказываем, как с ней работать в разрезе Инстаграм и Facebook так, чтобы РК давала максимальный профит...
16 09 2023 0:48:48
Alexa Rank учитывает как число страниц, так и количество просмотров страниц. Alexa Rank 1, что означает, что все сайты и сервисы Google посещают больше всего посетителей в интернете....
15 09 2023 8:25:57
Как подготовиться и сделать из интервью полноценную историю, которая будет интересна аудитории...
14 09 2023 1:12:36
В Netpeak появляется больше клиентов с четкими задачами по продвижению своих мобильных приложений в iOS и Android. В этом посте — кейс приложения популярной доски объявлений....
13 09 2023 20:33:30
SEO-продвижение интернет-сайта, где можно заказать доставку цветов. Оплатой за трафик под Россию, Украину, Казахстан, Армению, Грузию...
12 09 2023 16:42:42
Зная стоимость клика в вашей тематике или регионе, коэффициент конверсии на сайте, вы можете оценить объем необходимых в рекламу инвестиций и прогнозировать стоимость конверсии. Узнать больше!...
11 09 2023 10:56:18
Как и зачем мигрировать со старой на новую версию API на языке R. С пакета RAdwords на rgoogleads. Руководство от Алексея Селезнева. Читать дальше!...
10 09 2023 17:55:52
Рекламные заголовки в гугл адвордс так и пестрят предложениями контекстной рекламы бесплатно — вы когда-нибудь задумывались о том, откуда берутся эти «подарки»?...
09 09 2023 23:15:49
Думаете, что почитать об онлайн-продвижении и диджитал-маркетинге? Вам сюда. Мы собрали топ интересных сайтов, блогов, каналов и пабликов...
08 09 2023 10:25:40
Пожар в дата-центре, неудачные обновления и то самое падение Facebook....
07 09 2023 8:26:47
Новый способ автоматизации процессов при настройке аналитики больших объемов данных....
06 09 2023 9:53:48
Как прокачать email, когда рассылки уже работают....
05 09 2023 12:58:17
Перед внедрением ремаркетинга следует хорошенько поработать над составлением базовых портретов аудитории сайта...
04 09 2023 22:43:38
Наталья Воскобойникова из контент-студии WordFactory решила дать четкую хаpaктеристику потенциальному заказчику гостевых постов. Если хотя бы один ваш ответ на вопросы в этом посте отрицательный, стоит найти другие тактики продвижения своего проекта....
03 09 2023 18:21:41
С каждым годом китайские маркетплейсы увеличивают свое влияние, и покупатели всё активней заказывают товары из Поднебесной. Но не всё скидки да покупки — обладатели интернет-аудитории и маркетологи могут еще и хорошо заработать на этих площадках....
02 09 2023 6:35:57
Привыкли к недосыпу и жизни «на кофе»? Вы, конечно же, понимаете, что это не дело. Но осознаете ли насколько? Если нет, почитайте....
01 09 2023 6:47:19
Наука перехода — понятие краулинга (crawling, сканирование) сайта и принципа его работы. Виды поисковых роботов и способы их управления и другие полезные фишки в рубрике Азбука SEO на Netpeak Blog...
31 08 2023 22:42:35
Важно иметь прорывное мышление — о таком подходе к бизнесу написана книга Люка Уильмса «Переворот»....
30 08 2023 12:27:44
Как контролировать множество сайтов — полезные сервисы и советы для вебмастеров. Одно дело — несколько десятков сайтов, а что если сотни или тысячи? Как раз это подробно и разберем....
29 08 2023 7:13:18
Данные по более 26 млн кликов в 23 тематиках и 402 городах Украины...
28 08 2023 3:51:28
Профессиональная лексика SEO-специалистов в буржунете и в рунете формируется в одном поле: Google-то общий. Но когда специалисты Востока и Запада встречаются, им сложно понять друг друга. Это неудивительно, так как язык отражает само восприятие SEO. А под...
27 08 2023 21:10:35
Метод не для всех, но увлеченным веб-аналитикой точно понравится!...
26 08 2023 10:20:36
Мануал, по которому вы создадите специальный отчет, чтобы применить его на своем сайте....
25 08 2023 20:18:19
Опыт сотрудника отдела маркетинга Netpeak. Дочке Маше — 10 лет, сыну Егору — почти 4 года. Мы по-прежнему не очень продуктивны в таких условиях, но все же накопили больше опыта, чем те люди, которые сейчас внезапно столкнулись с удаленной работой...
24 08 2023 17:15:16
Netpeak Checker – это мультифункциональный инструмент для массового анализа и сравнения сайтов, который помогает выполнять самые разнообразные задачи в области интернет-маркетинга....
23 08 2023 1:35:35
Вам точно нужен ВП? Тогда утвердите сабж, чтобы умещался в три слова, скиньте линк и дескрипшн и распознайте канал-оборотень. Полная подборка сленговых слов, значение которых не всегда найдете в Google...
22 08 2023 12:20:21
Минимизация пропущенных звонков и ускорение обработки заявок с наглядными примерами из сервиса...
21 08 2023 17:15:11
Как найти продавцов для маркетплейса с помощью рекламы в Google, Facebook, TikTok и Viber....
20 08 2023 2:16:51
Онлайн-корпоративы стали трендом 2020 года, но останутся с нами надолго если не в чистом, то в гибридном формате. Делимся опытом организации дня рождения компании в Zoom....
19 08 2023 13:12:31
Кейс о том, как написать большинству дилеров премиальных акустических систем в Европе и ничего не продать. И почему это кейс, а не антикейс....
18 08 2023 21:58:22
Как правильно оформлять свое портфолио, писать сопроводительные письма и делать посты в соцсетях. С помощью простой человеческой адекватности можно выигрывать у 90% других подрядчиков. Как это использовать? Читайте дальше!...
17 08 2023 1:12:31
Грабберы — программы, позволяющие автоматизировать процесс сбора и публикации контента. С помощью грабберов, помимо парсинга контента, осуществляют перевод и уникализацию текстов....
16 08 2023 23:51:50
Как и зачем отслеживать конверсии с тегом Google Рекламы...
15 08 2023 4:30:31
За 10 месяцев сотрудничества увеличили небрендовый на 99%, а общий трафик — в два раза. Рассказываем не только о результатах, но и подходе создания реалистичного прогноза SEO-продвижения сайта. Читать дальше!...
14 08 2023 1:35:14
Инструкция для новичков: как быстро отправить почтовую рассылку клиентам...
13 08 2023 19:28:56
Сет по контекстной рекламе в тематике «разработка программного обеспечения»: снижение стоимости клика на 89%....
12 08 2023 18:19:55
Email-маркетинг увеличивает частоту транзакций. Показываем как это происходит и за счет чего. Делимся кейсом email-маркетинга для книжного интернет-магазина. Читать дальше....
11 08 2023 14:39:23
Самопомощь по тревоге во время карантина и экономического кризиса...
10 08 2023 20:18:38
Дублирование контента на разных сайтах, ориентированных на рынки разных стран, например, на публику Канады...
09 08 2023 16:30:59
Как обойти «Зал ожидания» и другие неочевидные фишки...
08 08 2023 21:55:51
Дэн Гридин, ненавистник холодных звонков и эксперт в области системного B2B маркетинга для сложных рынков, рассказал читателям блога о принципах работы на рынке во время шторма....
07 08 2023 15:37:17
Панельная дискуссия, на которой специалисты представляют нестандартные идеи для привлечения трафика, продвижения проектов. Всё, что можно применить на деле. Читать!...
06 08 2023 11:14:51
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
