Open Graph op Facebook en Social Media. Zo werkt het.

Jouw content overal geoptimaliseerd

28 juni 2017
Leestijd: 5 minuten

Wat is Facebook’s open graph en wat kun je ermee?

Open Graph is een soort van kaartje met vaak een foto die verschijnt in je post, zodra er een link wordt gedeeld op een social network site, zoals Facebook. Maar wat is het eigenlijk, hoe werkt het, wat kun je er mee en welke voordelen heeft het?

Open Graph?

Open Graph is in 2010 geïntroduceerd binnen verschillende social media platformen. Zo verschijnen er regelmatig ingrijpende updates binnen Facebook. Open Graph zorgt ervoor dat websites en social media beter integreren. Geposte links van websites werden ‘rich graphs’ op Facebook. Een website kreeg meer controle over hoe dit eruit ziet op Facebook.

Als er een link in iemands status op Facebook wordt geplaatst, verschijnt er automatisch een kaartje met afbeelding, titel, omschrijving en een link. Normaal gesproken worden deze automatisch overgenomen van de website, maar met Open Graph kun je zelf bepalen met welke elementen het ‘kaartje’ wordt gevuld. Dit geldt zowel voor Facebook, maar ook voor LinkedIn, Google+ en Twitter.

Open Graph NU NL voorbeeld

Een voorbeeld op Facebook van Nu.nl

Open Graph Voorbeeld Facebook NU NL

Broncode die ze bij Nu.nl zien

Praktijkvoorbeeld

De voordelen van Open Graph zijn nog relatief onbekend en Open Graph wordt nog weinig toegepast. Een van de voordelen is dat het zorgt voor een betere uitstraling op social media, maar slecht een klein deel van de websites profiteert van dat voordeel. Sommige website profiteren echter wel van het voordeel; Nu.nl maakt bijvoorbeeld goed gebruik van Open Graph wat zorgt voor een goede uitstraling op social media.

Open Graph, hoe werkt het?

Om met Open Graph te kunnen werken moet je in de broncode van de website Open Graph metatags gebruiken. Dit klinkt heel technisch, maar het is vaak gemakkelijk om met een plugin in je Content Management Systeem zelf Open Graph te implementeren op je website, soms zit het er zelfs al in.

LinkedIn, Google+ en Twitter kijken actief naar Open Graph tags in je website. Twitter heeft zelfs een eigen service, Twitter Cards. Als er geen Open Graph tags aanwezig zijn in je website, dan vult de site waarop je een link deelt zelf iets in op basis van wat ze kunnen vinden. Hierbij moet je dus geluk hebben, wat een belangrijke reden is om zelf de weg te wijzen in Open Graph.

Open graph voorbeeld juist facebook

Met Open Graph tags bepaal je zelf hoe gedeelde content wordt weergegeven

Open Graph, hoe gebruik je het in je eigen website?

Om Open Graph te laten werken moet je een bepaalde basis gebruiken. Deze basis bestaat uit 4 metatags in je broncode.

  • og:title – dit is de titel van je bericht of pagina
  • og:type – dit is het type content dat je deelt voor een webpagina. B.v. voor een nieuwsartikel gebruik je ‘’artikel.’’
  • og:image – hier zet je de locatie van de afbeelding die je wilt laten zien op de te delen pagina. (zorg wel voor een afbeelding die groot genoeg is.
  • og:url – dit is de URL van de pagina waar jij naartoe wil linken

In de <head> sectie van de HTML van je website ziet dat er als volgt uit:

<html>
<head>
<title>Facebook live. Hoe werkt het? Tips en Turotrial </title>

<meta property=”og:title” content=“Facebook live. Hoe werkt het?” />
<meta property=”og:type” content=“artikel” />
<meta property=”og:image” content=“https://juist.nl/wp-content/uploads/2016/05/juist-blog.jpg” />
<meta property=”og:url” content=“https://juist.nl/blog/facebook-live-hoe-werkt-het/” />

</head>

</html>

open graph facebook voorbeeld juist

Een voorbeeld op Facebook als alle OG-tags zijn ingevuld

Je kunt nog een aantal extra tags toevoegen als je een website in Nederland hebt:

Beschrijving

Deze tag zorgt voor een stukje tekst die wordt getoond bij het delen van de URL.

<meta property=”og:description” content=“Hoe werkt Facebook Live? Wat heb je eraan en waar moet je op letten? Lees het in deze duidelijke tutorial, inclusief waardevolle tips.” />

Taal

Deze tag geeft aan welke taal je content is. Facebook zet standaard de taal op en_US, daarom is het van belang dat jij de taal aanpast.

<meta property=”og:locale” content=”nl_NL” />

Naam website

Met deze laatste tag kun je de naam van jouw site doorgeven. Als jouw site bijvoorbeeld onderdeel is van een netwerk is dit erg handig.

<meta property=”og:site_name” content=“Juist” /

Open Graph werkt niet?

Je hebt alles goed ingesteld in de <head> van je pagina’s, maar toch gebruikt Facebook nog steeds je oude teksten en afbeeldingen. Dit komt omdat de nieuwe elementen nog niet actief door Facebook zijn opgepikt. Je kunt Facebook hier een handje bij helpen met de handige tool ‘Sharing Debugger’ van Facebook. Hiermee forceer je Facebook om de meest recente OG-tags te gebruiken.

  • Ga naar https://developers.facebook.com/tools/debug/
  • Vul de complete URL van de pagina in
  • Facebook toont de huidige inhoud van de OG tags
  • Komt het niet overeen met wat je hebt ingesteld? Klik dan op ‘Scrape again’.

Open Graph, waarom toepassen?

Ten eerste omdat je graag zelf bepaald hoe je website op social media eruit ziet, zeker als je hier veel tijd en energie insteekt. Daarnaast valt het goed vormgegeven Open Graph kaartje bij een social media post beter op je tijdlijn. Hierdoor trek je meer likes en kliks aan, dat zorgt ervoor dat de content langer in de newsfeed blijft hangen. Al deze toepassingen zorgen dus voor meer bereik.

Open graph kan je helpen om nieuws, vacatures, persberichten of bijvoorbeeld een link naar je homepage in te richten. Hierdoor ziet het er goed en relevant uit, wat weer belangrijk is als het gedeeld wordt.

Met Open Graph bepaal je dus hoe je content eruit ziet op social media en niet te vergeten dat het ook werkt voor de vindbaarheid van je content.

Je vindbaarheid verbeteren met Open Graph?

Er wordt door meer dan 1 miljard gebruikers op Facebook gezocht en ook Facebook zet duidelijk in op zoeken. Kortom: Facebook kan ook gezien worden als zoekmachine. Dit wordt extra duidelijk door Graph Search. Die vindbaarheid wordt groter als je gedeelde content op Facebook juist en volledig is vormgegeven.

Goede vindbaarheid van je content is in de toekomst erg belangrijk voor:

  1. local: Facebook zet qua zoeken niet alleen in op grotere bedrijven en winkels maar ook op lokale content. Een onderdeel waar zoeken belangrijk voor is, is de functie Places. Omdat je natuurlijk niet wil dat die bedrijven foute info over jou tonen is het heel belangrijk dat je met Open Graph die bedrijven in een duidelijke weergave de juiste info geeft.
  2. Bing: Facebook en Bing werken nauw samen, zo toont Bing (in Amerika) social resultaten van Facebook in de zoekmachine.

Graph Search, wat is het?

Doormiddel van Graph Search wordt het zoeken in (gedeelde) content en posts een stuk eenvoudiger. Hierdoor liggen er kansen om je content beter vindbaar te maken. Als je je taalinstellingen op Facebook op English US hebt staan, heb je automatisch toegang tot de zoekfunctie.

Het wordt dus belangrijker dat je de juiste keywords in je content en Open Graph gebruikt. Je kunt met de juiste keywords in je Open Graph de vindbaarheid op social media al vanuit je website vergroten.

Meer inzicht op Facebook over jouw website

Facebook Insights geven de statistieken van jouw pagina weer. Je krijgt hier toegang toe als je een Facebookpagina hebt. De Domain Insights is hier een interessante toevoeging op. Je krijgt een extra Open Graph tag als je je website claimt op Facebook. Zodra je die extra tag in je website plaatst, krijg je op Facebook Insights meer inzicht in het verkeer dat van Facebook naar je website gaat. Facebook geeft deze statistieken niet standaard af maar het instellen ervan is redelijk eenvoudig.

Aan de slag

Je moet ervoor zorgen dat je Open Graph in de basis kunt toepassen. De meeste Content Management Systemen hebben plugins die zorgen voor de juiste functionaliteit. Het is niet moeilijk om Open Graph data op te nemen in je site. Als je Open Graph de juiste invulling en toepassingen hebben, heeft het zowel direct als indirect invloed op je presence, je vindbaarheid en de traffic naar jouw site.

0 Reacties

Geef een reactie