Open Graph Tags: Mehr Interaktion auf Social Media

Open Graph Tags: Mehr Interaktion auf Social Media
Mann schaut aus Fenster
Open Graph Tags – die Vorschau Deiner Linkpostings

Dein Content auf Deiner Webseite ist so gut, dass man ihn auf Social Media teilt? Herzlichen Glückwunsch! Mit Open Graph Tags kannst Du sicherstellen, dass Deine geteilten Inhalte optisch ansprechend in den sozialen Netzwerken wie Facebook und Instagram dargestellt werden. So fällt der Content Deiner Zielgruppe gleich ins Auge und Du steigerst die Interaktionsrate. Wir verraten, wie es geht.

Inhalt

Was sind Open Graph Tags?

Open Graph Tags (auch og tags) sind Elemente, die Du im Quellcode Deiner Website im HTML-Header hinterlegst. Mit diesen bestimmst Du, welche Vorschau User beim Teilen Deiner Seite in sozialen Netzwerken zu sehen bekommen – wie zum Beispiel Bild, Titel und Beschreibung.

Wofür sind Open Graph Tags wichtig?

Wer in sozialen Netzwerken erfolgreich sein und viele Klicks generieren möchte, muss sich heutzutage schon ziemlich ins Zeug legen – die Konkurrenz ist riesig. Deine User teilen Deine Webseiten und Inhalte auf Facebook oder Twitter? Das ist schon mal eine super Leistung. Um jetzt so viele Klicks wie möglich zu generieren, ist die Vorschau an dieser Stelle enorm wichtig. Mit Open Graph Tags hast Du die Möglichkeit, die Vorschau zu beeinflussen und User zum Klick anzuregen.

Wo und wie werden Open Graph Tags hinterlegt?

Im Quellcode Deiner Website, speziell im Header. Open Graph Tags werden wie folgt angegeben:

<meta property="[og tag]" content="[Inhalt og tag]" /> 
Beispielcode für den Einsatz von Open Graph Tags
So sehen Open Graph Tags im Quellcode aus

Betreibst Du Deine Website mit einem CMS wie WordPress, stehen Dir auch an dieser Stelle entsprechende Plugins zur Verfügung, die Dir bei der Optimierung helfen.

Die wichtigsten Open Graph Tags

Du hast eine recht große Auswahl an Open Graph Tags, welche Du zur Optimierung Deiner Vorschau anwenden kannst und solltest.

Beispiel-Vorschau eines Links bei Twitter
So stellen sich Open Graph Tags bei Twitter dar

og:title – Prägnante Titel

Egal ob Facebook oder Twitter: Das og:title Element wird Deinen Usern neben dem Bild als erstes auffallen und benötigt besondere Pflege. Hier entscheidet sich, ob User interessiert sind und klicken oder im Feed weiter scrollen. Achte darauf, Deinen Titel so kurz und prägnant wie möglich zu gestalten, mit ihm Neugierde zu wecken und zum Klick anzuregen.

Hat ein Link mehr als 50 Interaktionen (Likes, Kommentare, Shares) erhalten, kann der Titel nicht mehr angepasst werden.

<meta property="og:title" content="SEO für Anwälte – Mit Google zu mehr Mandanten" /> 

og:description – Interesse der User wecken

Worum geht es auf der Seite und was können User erwarten? Mache Deine Inhalte schmackhaft und erkläre kurz, worum es geht. Achtung: Versprich nichts, was Du nicht halten kannst. Leere Versprechungen in der Beschreibung bringen Dir vielleicht Klicks, steigern aber Deine Absprungrate Deiner Webseite.

<meta property="og:description" content="Du bist Rechtsanwalt und fragst Dich, wie Du mit SEO mehr Mandanten gewinnst? Wir geben Tipps & Tricks zum Thema Website und Suchmaschinenoptimierung!" /> 

og:type – Website, Blog oder Artikel?

Hier hinterlegst Du, um was für eine Art von Inhalt es sich handelt, z. B. eine Webseite, einen Blog oder einen Artikel. Meist bleibt es bei diesen drei Ausführungen des og-tags. Bietest Du jedoch Inhalte wie Musik oder Bücher an, kannst Du auf spezielle Tags zurückgreifen. Eine detaillierte Übersicht findest Du im Open Graph Protocol.

<meta property="og:type" content="article" /> 

og:image – Mehr Aufmerksamkeit erhalten

Je größer eine Vorschau in sozialen Netzwerken wie Facebook oder Twitter ist, desto mehr Aufmerksamkeit erhält sie. Eine besondere Rolle spielt also der Einsatz eines Bildes. Wähle ein ansprechendes Bild, das auf Deine Zielgruppe abgestimmt ist und welches sie wahrscheinlich anklicken würde. Berücksichtige Anforderungen an die Bildformate der verschiedenen sozialen Netzwerke.

Für mehrere Bilder (Facebook Carousel Post) ganz einfach mehrere og:image Tags anlegen. Achte hier auf die Bildformate – im besten Fall haben die Bilder die gleiche Größe.

<meta property="og:image" content="[Pfad der Bilddatei]" /> 

Möchtest Du ein Bild wechseln und änderst den Pfad, tauscht Facebook dieses auch bei älteren Veröffentlichungen aus.

og:video – Von der Masse abgrenzen

Dieses Element funktioniert ähnlich wie das og:image, nur dass an dieser Stelle kurze Videos in der Vorschau zu sehen sind. Damit kannst Du Dich von der Konkurrenz abheben und Aufmerksamkeit gewinnen.

<meta property="og:video" content="[Pfad der Videodatei]" />

Testen und optimieren

Wenn Du Deine Open Graph Tags eingebunden hast und nun testen möchtest, ob sie funktionieren, steht Dir der Open Graph Checker zur Verfügung. Hier siehst Du, welche Tags gefunden und erkannt wurden – so werden Fehler aufgedeckt, die Du im nächsten Schritt beheben solltest.

Um das Ganze auch bei Facebook zu testen, nutze den Sharing Debugger von Meta.

Zusammenfassung

Für eine bessere Vorschau bei zu teilenden Webseiten in sozialen Netzwerken wie Facebook solltest Du Deine Open Graph Tags optimieren. Ein ansprechendes Bild, ein prägnanter Titel und eine interessante Beschreibung sorgen dafür, dass User Deine Inhalte anklicken und somit Deine Interaktionsrate steigt. Es gibt verschiedene Arten von Open Graph Tags. Entscheide je nach Inhalt der Seite selbst, welche für Dich relevant sind – Bild, Titel und Beschreibung sind jedoch Pflicht, um im Feed aufzufallen. Je nach Website Pflege fügst Du diese manuell ein oder nutzt bei CMS Systemen ein entsprechendes Plugin.

Du hast noch Fragen zu dem Thema oder benötigt einen Profi, der Open Graph Tags in Deinem Quellcode einbindet? Melde Dich bei uns!

Kontakt aufnehmen

Bewerten

Rating: 5.0/5. From 3 votes.
Please wait...

Erfahre noch mehr zum Thema Social Media


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.