Agencja marketingowa

Ocean pomysłów?

Wiemy jak przekuć
je na sukces w Internecie!

 

Sprawdź nas

Zjedź na dół
środa, 08 sierpnia 2018 15:39
Open Graph - zadbaj o wygląd linków

Open Graph - zadbaj o wygląd linków

Jeżeli prowadzisz marketing swojej strony/sklepu internetowej czy też aplikacji na pewno chciałbyś uzyskać jak największą liczbę odbiorców. Udostępnianie linków na portalach społecznościowych może jeszcze efektywniej pomóc Ci uzyskać klientów, jak to zrobić? Wystarczy że zastosujesz Open Graph!

1 Czym jest Open Graph?

Mówiąc najprościej jest to protokół stworzony przez Facebooka wykorzystujący odpowiednie znaczniki meta umieszczane w sekcji head strony. Dzięki tym znacznikom udostępniane przez nas treści wyświetlają się w odpowiednim formacie odbiorcom na portalach społecznościowych takich jak: Facebook, Twitter, Google+, Pinterest. Implementacja tego protokołu sprawia, iż nasza strona staje się obiektem grafu społecznego.

2 Link przed i po implementacji protokołu

Przykładowy obraz udostępnionego linku do produktu na sklepie bez implementacji Open Graph:

Obraz udostępnionego linku strony bez implementacji Open Graph

Przykładowy obraz udostępnionego linku do produktu na sklepie z implementacją Open Graph:

Obraz udostępnionego linku strony z implementacją Open Graph

3 Zastosowanie protokołu zwiększa nawet trzykrotnie ruch na stronie

Adres strony, który udostępniamy na portalu społecznościowym, w którym zastosowano Open Graph, zdecydowanie poprawia interakcję z użytkownikiem. Określając tylko podstawowe tagi jak: tytuł, obraz, opis, typ oraz adres strony nasz link do strony staje się zdecydowanie atrakcyjniejszy i bardziej zaufany dla użytkownika. Użytkownicy chętniej klikają w linki, które przedstawiają grafikę oraz opis określający treść strony.

4 Podstawowe znaczniki

Na oficjalnej stronie protokołu http://ogp.me/ znajdziemy znaczniki, które możemy wykorzystać na naszej stronie. Podstawowe znaczniki przedstawione w dokumentacji to:

og:title - tytuł twojego obiektu, np “Open Graph - zadbaj o wartościowe treści i zwiększ ruch na stronie”

og:type - typ twojego obiektu np “website”, “article”, “news.publishes”, “product.group”, “product.item”

og:image - obraz reprezentujący twój obiekt

og:url - kanoniczny url twojego obiektu

Przykład wykorzystania jednego ze znaczników z wykorzystaniem atrybutów property oraz content:

<meta property="og:title" content="Open Graph - zadbaj o wartościowe treści i zwiększ ruch na stronie" />

Na oficjalnej stronie jest przedstawione wiele innych znaczników, które możemy zastosować. Niektóre ze znaczników jak og:image mogą posiadać dodatkowe metadane, które piszemy po znaku “:”. Przykład poniżej:

<meta property="og:image" content="http://example.com/ogp.jpg" />
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
<meta property="og:image:alt" content="A shiny red apple with a bite taken out" />

5 Testowanie implementacji Open Graph

Istnieje kilka narzędzi, dzięki którym jesteśmy w stanie przetestować naszą stronę i sprawdzić jak będzie wyglądać link, zanim udostępnimy go na portalu społecznościowym.

Pierwszym z nich jest narzędzie do debugowania oferowane przez Facebook, aby z niego skorzystać należy być zalogowanym na facebooku. Narzędzie to przedstawia nam wygląd linku oraz to co jest zawarte w uzupełnionych znacznikach meta.

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

Drugim narzędziem, które bardziej służy do szybkiego podglądu udostępnianego linku bez większej analizy danych jest wtyczka do chrome “Open Graph Preview”. Poniżej link do rozszerzenia:

https://chrome.google.com/webstore/detail/open-graph-preview/ehaigphokkgebnmdiicabhjhddkaekgh?hl=pl

Podsumowanie

Zastosowanie protokołu Open Graph nie jest skompikowane, można nawet twierdzić, że jest bardzo proste. Jeżeli chcesz, aby twoje linki zwracały uwagę potencjalnych klientów/odbiorców to warto poświęcić chwilę czasu na implementację meta znaczników na własnej stronie i czekać na efekty!

Konrad Kacprzyk
Konrad Kacprzyk

Subskrybuj na YT

Kalendarz wpisów

« Październik 2018 »
Pn Wt Śr Czw Pt Sb Nie
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        

image

Poczuj się jak Rekin w wodzie!

Efektywność to najważniejszy parametr cechujący skuteczne działania w Internecie. Agencja marketingowa RekinySukcesu.pl wie jak osiągnąć wysoką efektywność w błękitnym i czerwonym oceanie marketingu.

Ponad 100 zadowolonych Klientów, ponad 300 przeszkolonych osób, a nam ciągle mało. Już więcej niż 9 lat spędzili użytkownicy na wykonanych przez agencję interaktywną Wrocław stronach internetowych. Dzięki temu o Twoim Kliencie wiemy wszystko, a nawet i więcej. Nie uznajemy kompromisów. Dlatego warto kliknąć w jeden z przycisków poniżej.

 

Konfigurator Kontakt

Rekiny Mobile Menu