Open Graph: tagovi za društvene mreže

Open Graph: tagovi za društvene mreže

  • Post category:Internet
  • Reading time:4 mins read

Deljenje sadržaja na društvenim mrežama jedna je od osnovnih aktivnosti većine korisnika interneta. Da bi vaša lepa stranica sa kvalitetnim sadržajem, savršenog dizajna, izgledala utegnuto i kada je neko podeli sa prijateljima, neophodno je da definišete open graph tagove. Često je ovo prvi susret korisnika sa vašim sadržajem, pa se potrudite da ostavite dobar utisak.

Pravilan pristup i implementacija Open Graph tagova popraviće primetno vaš CTR.

Open Graph protokol je kreirao Facebook 2010. godine, sa ciljem da standardizuje korišćenje podataka i obogati prikaz sadržaja različitih stranica na ovoj društvenoj mreži. Ono što su meta tagovi za SERP, to su OG tagovi za društvene mreže, mesindžere i čet servise.

Šta će se dogoditi ako ne koristite Open Graph tagove?

Većina društvenih mreža će na osnovu podataka sa stranice generisati prikaz sadržaja, koji neće svaki put izgledati dovoljno dobro. Prikazaće se naslov, neka od slika sa stranice i možda ostanete uskraćeni za opis ili to bude neki neadekvatan tekst. Upravo su ovo osnovni OG tagovi koje je poželjno kreirati za svaku pojedinačnu stranicu.

Open Graph je vrsta posrednika u komunikaciji između vašeg sajta i platformi poput Facebook, LinkedIn, Pinterest, Twitter. Twitter je razvio svoje Twitter Cards tagove, a ukoliko ih ne koristite, izvor informacija i za ovu mrežu će biti OG tagovi.

Osnovni open graph tagovi

og:image – slika u visokoj rezoluciji koja će se prikazati za određenu stranicu prilikom deljenja na društvenim mrežama. Pored odabira adekvatne slike, savet je da koristite odnos 1.91:1 uz minimalnu dimenziju 1200x630px kao optimalnu za prikaz na svim uređajima.

primer:
<meta property=”og:image” content=”http://linkvašeslike.jpg” />

og:title – za naslov se najčešće koristi isti naslov, meta title, koji je postavljen i na izvornoj stranici. Ne postoji striktna standardizacija, ali savet je da koristite oko 60 karaktera.

primer:
<meta property=”og:title” content=”Open Graph: tagovi za društvene mreže” />

og:description – za razliku od meta opisa kojim se obraćate korisnicima koji pretražuju ključnu frazu, og opisom se obraćate korisnicima kojima je na interesantan način potrebno predstaviti sadržaj. Ovaj kratak tekst može biti ključan za povećanje broja interakcija. Savet je da opis bude dužine oko 200 karaktera.

primer:
<meta property=”og:description” content=”Open Graph tagovi koriste se za bogat prikaz sadržaja stranice na društvenim mrežama” />

og:type – vrsta sadržaja stranice, najčešće je to “website”, ukoliko pišete blog postove, može biti “article”, odnosno “video” ukoliko stranica sadrži video materijal.

primer:
<meta property=”og:type” content=”website” />

og:url – adresa matične stranice, canonical URL.

primer:
<meta property=”og:url” content=”http://vas.sajt” />

og:locale – definiše jezik na kom je napisan sadržaj stranice, ukoliko ne definišete ovaj podatak, difoltni je američki engleski, en_US.

Sve informacije je potrebno implementirati u okviru <head> sekcije na stranicama.

Provera open graph tagova

Većina društvenih mreža će čitati postavljene og tagove i omogućiće bogat prikazvašeg sadržaja na svojim kanalima. Ipak, svaka društvena mreža ima svoj pravilnik i standardizaciju vezanu za broj karaktera koji se prikazuje ili dimenzije slika. Neke od najpopularnijih imaju svoje alate preko kojih možete proveriti izgled postavljenih tagova i prikaz stranica u njihovom ekosistemu.

Twitter: https://cards-dev.twitter.com/validator
Facebook: https://developers.facebook.com/tools/debug
Pinterest: https://developers.pinterest.com/tools/url-debugger
LinkedIn: https://www.linkedin.com/post-inspector/inspect

Primena open graph tagova učiniće vaš sadržaj primetnijim, podeljivijim i interaktivnijim na društvenim mrežama. Ako na sadržaj stranica gledamo kao na dobro opremljenu prodavnicu, og tagovi su izlog za slučajne prolaznike.