W walce o przyciągnięcie uwagi konsumenta bez przerwy karmionego informacją w każdej postaci na znaczeniu zyskują drobiazgi. Wszyscy wiemy, jaką rolę odgrywa intrygujący tytuł artykułu i copy posta na Facebooku, ale wielu wydawców wciąż zapomina o poprawnym skonfigurowaniu formatu, w jakim pokazują się udostępniane przez nich treści w mediach społecznościowych. W sytuacji, kiedy o kliknięciu decydują ułamki sekund, nie można sobie pozwolić na nieodrobione lekcje z Open Grapha – w jaki sposób go okiełznać i wykorzystać do generowania dodatkowego ruchu?
Mówiąc najprościej, tagi Open Graph (OG), protokołu stworzonego przez Facebooka w 2010 roku, pozwalają na całkowitą kontrolę tego, w jaki sposób udostępniane przez nas i naszych odbiorców treści wyświetlają się innym użytkownikom portali społecznościowych – chodzi o tytuł, URL, fragment copy, obrazek (ale nie tylko – o tym za moment).
OG nie sprawi, że twój serwis zacznie notować dynamiczny wzrost ruchu, jeśli nie zadbasz w pierwszej kolejności o wartościowe treści oferowane odbiorcom – ale kiedy ten etap masz za sobą, powinieneś doszlifować sposób ekspozycji linków. Jeżeli udostępniasz materiały w sposób niedbały, na przykład bez podglądu, pozostawiając sam link z niewiele mówiącym URL-em, możesz być pewien kiepskiej interakcji; we wspomnianym na początku natłoku informacji i atrakcyjnych treści oferowanych przez twoją konkurencję, nikt nie ma czasu na testowanie łącz, które nie budzą zainteresowania. Taktyka optymalizacji meta-danych i microcopy wykorzystywana jest również “w drugą stronę” – wśród wydawców określa się to mianem click-baitingu, a więc praktyki nadmiernego podkręcania elementów treści widocznych w social mediach w celu osiągnięcia dużego wzrostu ruchu.
Tak czy owak, odpowiednio zdefiniowane meta tagi mogą wpłynąć na decyzję – kliknąć, czy nie kliknąć?
Tak wyglądałby przykładowy link do strony, na której nie zaimplementowano OG:
Ewentualnie, Facebook spróbuje “zaciągnąć” do serwisu losowo wybrane informacje – jeden z obrazków umieszczony w tekście, a także tytuł ze znacznika “title” strony i opis z pierwszego fragmentu tekstu.
Tyle teorii. Jak w praktyce zacząć korzystać z dobrodziejstw OG?
Cztery podstawowe znaczniki to:
”og:title” – odpowiada za definiowanie wyświetlanego na FB tytułu strony
”og:type” – odpowiada za definiowanie kategorii linkowanej strony, która może – po kliknięciu przycisku “lubię to” – zostać umieszczona w odpowiedniej sekcji zainteresowań w profilu użytkownika
“og:site_name” – jeśli udostępniana strona jest częścią większego serwisu internetowego, można wprowadzić ujednoliconą nazwę zamiast wyświetlania konkretnego adresu URL
“og:image” – odpowiada za zdefiniowanie wyświetlanego zdjęcia, które zaciąga się z podanego URL-a. Powinno być ono w rozdzielczości co najmniej 1200×800, w skali 3:1 (tagi powinny wyglądać tak: <meta property=”og:image:width” content=”1200″ /> <meta property=”og:image:height” content=”800″ />)
Tak wygląda poprawnie zaimplementowany protokół OG na stronie głównej Onetu:
Poszczególne artykuły również mają zdefiniowane tagi. Tak wygląda link do jednego z tekstów, udostępniany na profilu:
Jeśli z kolei zajrzymy “pod płaszcz” strony, naszym oczom ukażą się tak zdefiniowane tagi:
Najprawdopodobniej, system zarządzania treścią wykorzystywany w Onecie automatycznie określa zawartość meta znaczników, zaciągając z leadu artykułu treść do “og:description” – stąd urywanie fragmentu tekstu, które następuje po 200 znakach.
Powyższa lista tagów to dopiero początek – jest ich całe mnóstwo i odpowiadają za różne aspekty zarówno wyświetlanej w social feedzie strony, jak i sposobu jej integracji z profilem użytkownika. To między innymi:
- og:audio – definiowany poprzez link do pliku audio. Tagi pogłębiające:
- <meta property=”og:audio” content=”http://example.com/sound.mp3″ />
- <meta property=”og:audio:secure_url”
- content=”https://secure.example.com/sound.mp3″ />
- <meta property=”og:audio:type” content=”audio/mpeg” />
- og:video – działa dokładnie tak samo jak tag og:image, ale wymaga podlinkowania pliku wideo. Tagi pogłębiające:
- <meta property=”og:video:secure_url”
- content=”https://secure.example.com/movie.swf” />
- <meta property=”og:video:type” content=”application/x-shockwave-flash” />
- <meta property=”og:video:width” content=”400″ />
- <meta property=”og:video:height” content=”300″ />
- og:type – wspominaliśmy o nim wcześniej, ale posiada on całkiem sporo wertykalnych podgrup, umożliwiających dokładne zdefiniowanie typu danej strony:
- bar – bar, pub
- company – firma
- cafe – kawiarnia
- band – zespół muzyczny
- government – organizacja rządowa
- non_profit – organizacja non-profit (np. fundacja, stowarzyszenie)
- author – autor (np. książki, tekstu)
- director – reżyser
- musician – muzyk
- politician – polityk
- book – książka
- drink – napój
- food – jedzenie
- game – gra
- article – artykuł
- blog
- website – strona internetowa
W przypadku wykorzystania znacznika article czy website, można umieścić dodatkowe informacje o autorze, w taki sposób, by pod udostępnianą treścią wyświetlał się link do pozostałych artykułów autora w serwisie (konieczne jest stworzenie podstrony, na której będą zebrane wszystkie teksty albo po prostu kategoria wpisów), albo link do jego osobistego profilu na Facebooku. Wykorzystuje to m.in. Antyweb:
Jednym z ciekawszych przykładów “mikrokampanii” wykorzystującej w kreatywny sposób Open Graph były działania francuskiego biura podróży, Marmara.com. Poprzez odejście od tagu image:
na rzecz video:
Tym prostym zabiegiem udało się wygenerować kilkanaście tysięcy przejść na stronę i konwersję bezpośrednią na poziomie 45 tysięcy euro – nie inwestując ani złotówki, jedynie starannie definiując meta tagi.
#Protip: jeżeli architektura twojego serwisu opiera się na silniku WordPressa, możesz zastosować którąś z poniższych wtyczek, po to, by w łatwy sposób samodzielnie definiować OG tagi dla konkretnych stron i wpisów:
WordPress SEO, Yoast
WP Facebook Open Graph protocol
Mikroprotokół danych OG wykorzystywany jest nie tylko przez Facebooka, ale też m.in. przez widget rekomendacji treści NextClick. Jak na jego użyciu mogą skorzystać wydawcy?
Tomasz Zaród, Publisher Support Specialist w Scoop, odpowiada:
1. W jaki sposób NextClick wykorzystuje informacje zawarte w tagach OpenGraph?
Widget NextClick korzysta informacji zawartych w tagach OG, by móc poprawnie emitować, zgodnie z wolą Wydawcy, treści sugerowane użytkownikom. Dane zbierane przez nasz skrypt obejmują: adres URL, tytuł, opis, grafikę i fakultatywnie czas utworzenia danej podstrony.
Nasze narzędzie korzysta z kliku źródeł informacji: dedykowanych zmiennych osadzenia, tagów OpenGraph i meta-tagów HTML. NextClick weryfikuje poszczególne źródła w przedstawionej kolejności i jest w stanie kompletować je między sobą. Przykładowo, jeśli tagi OpenGraph nie obejmują informacji o opisie strony, może on zostać pobrany z dedykowanych zmiennych.
W sytuacji, gdy widget nie odnajdzie w kodzie źródłowym strony zarówno tagów OG jak i dedykowanych zmiennych konfiguracyjnych, podejmie on próbę wyszukania meta-tagów HTML oraz wykrycia grafiki reprezentującej podstronę. Jako grafikę powiązaną z treścią zostanie wybrane największe zdjęcie zamieszczone na stronie, pochodzące z domeny lub jej dowolnej subdomeny.
Integracja za pomocą meta-tagów HTML powinna być stosowana jedynie w przypadku, gdy nie jest możliwe osadzenie tagów OpenGraph lub zmiennych konfiguracyjnych.
Podsumowując: implementując tagi OpenGraph Wydawca ma pełną kontrolę nad emitowanymi informacjami, zarówno w przypadku publikacji postu na FB, jak i na zewnętrznych narzędziach takich jak NextClick, co przekłada się na wzrost ruchu na stronie.
2. Czy NextClick jakkolwiek monitoruje konwersję i optymalizuje zaciągane tagi w celu maksymalizacji ruchu?
Zaciągane przez NextClick informacje służą wyłącznie poprawnej emisji sugestii. Maksymalizacja ruchu w serwisie Wydawcy obywa się poprzez poprawne targetowanie odpowiednio sprofilowanych treści użytkownikom. NextClick sugeruje je na podstawie bieżącej analizy ścieżek zainteresowań użytkowników, tzw. bliźniaków behawioralnych.