Open Graph

Wofür benötige ich Open Graph?

Die Open-Graph-Metadaten dienen dazu, auf Social Media Plattformen die Vorschau eines geteilten Artikels festzulegen. Ursprünglich rief Facebook das Open Graph Protocol Ende 2010 ins Leben. Mittlerweile nutzt jedoch nicht nur Facebook Open Graph, sondern das Protokoll hat sich bei allen großen Social Media Plattformen durchgesetzt und ist heutzutage nicht mehr wegzudenken. Durch das Protokoll sind die Social Media Plattformen in der Lage, Webseitenartikel in die hauseigenen Graph-Objekte zu konvertieren und können somit die Vorschau der URL gut aussehen lassen.

<html>
  <head>
    <meta property="og:title" content="Weitere 5 Quellen kostenloser Backlinks" />
    <meta property="og:type" content="article" />
	<meta property="og:url" content="https://seitenreport.de/kb/weitere-5-quellen-kostenloser-backlinks" />
	<meta property="og:image" content="https://seitenreport.de/fileadmin/_processed_/8/9/csm_1505_quellen_b01a8904af.jpg" />
	<meta property="og:description" content="Nachdem der Artikel über die 10 kostenlosen Backlink-Quellen vom Juni 2012 so eingeschlagen hat und bis zum heutigen Datum von sage und schreibe 279 Personen kommentiert wurde, habe ich mich dazu entschlossen, euch heute 5 weitere kostenlose Backlink-Quellen zur Verfügung zu stellen.">
  </head>
</html>

Mithilfe der Open Graph Tags würde bspw. mein geteilter SEO Artikel „Weitere 5 Quellen kostenloser Backlinks“ auf Facebook wie folgt dargestellt werden:


Was gibt es bei der Implementierung zu beachten?

Grundsätzlich möchte man mit der Einbindung von Open Graph erreichen, dass die Link Vorschau den Social Media Benutzer anspricht und zum Anklicken bewegt. Hierfür muss der Artikel im Newsfeed herausstechen und vertrauensvoll auf den User wirken.

Der wichtigste Faktor ist hierbei das Bild, weshalb hierauf auch besonderen Wert gelegt werden sollte. Das Bild ist letztendlich das, was uns als erstes bei einer Link Vorschau ins Auge sticht und wirklich auffällt. Damit das Bild in voller Breite und Größe angezeigt werden kann, werden zum einen die Formate 16:9 oder 4:3 empfohlen und zum anderen wurde die ideale Größe von Facebook auf mindestens 1.200 x 630 Pixel festgelegt.

Ein weiterer wichtiger Faktor ist der Textbereich der Vorschau, der sich aus dem Titel und der Beschreibung zusammensetzt. Um den Benutzer neugierig zu machen, sollte ein Titel gewählt werden, der vertrauensvoll und auffallend aussieht und nicht bspw. den Webseitentitel enthält. Ebenso bei der Beschreibung. Sollte hier keine spezielle Beschreibung definiert werden, wird bspw. bei Facebook der erste <p> Tag aus dem body Bereich angezeigt. Damit gibt man dem Benutzer kein gutes Gefühl auf den Artikel zu klicken. Ziel sollte es schließlich sein, dem Benutzer sein Interesse durch die Vorschau zu wecken, sodass er Lust auf den Artikel bekommt und ihn lesen möchte.

Um von den Social Media Plattformen richtig interpretiert zu werden, sind die folgenden vier Meta-Tags im head Bereich Pflicht:

  • og:title
  • og:type
  • og:url
  • og:image

Zusätzlich gibt es eine Vielzahl an weiteren optionalen Open-Graph Meta-Tags, die auf der offiziellen Webseite des Open Graph Protokolls zu finden sind: The Open Graph protocol