Open Graph ist ein Protokoll, das festlegt, wie eine Webseite aussieht, wenn du ihren Link auf einem sozialen Netzwerk teilst. Es liefert Plattformen wie Facebook, LinkedIn oder X (früher Twitter) genau die Informationen, die sie für die Vorschau brauchen: Titel, Beschreibung, Bild und URL.
Wie Open Graph entstanden ist
Facebook stellte das Open Graph Protocol im April 2010 auf seiner Entwicklerkonferenz F8 vor. Das Ziel war einfach: Externe Webseiten sollten sich in Facebooks sozialem Netzwerk genauso verhalten wie interne Facebook-Objekte — also Artikel, Profile oder Fotos. Bis dahin entschieden soziale Netzwerke selbst, welches Bild und welchen Text sie aus einer Seite herauslesen. Das Ergebnis war oft zufällig und unvorteilhaft.
Das Protokoll basiert technisch auf RDFa (Resource Description Framework in Attributes), einem Standard, der semantische Informationen in HTML einbettet. Facebook ließ sich dabei von älteren Konzepten inspirieren, darunter Dublin Core (ein Standard zur Beschreibung von digitalen Dokumenten aus den 1990er-Jahren) und Microformats. Kurz nach dem Launch war das Open Graph Protocol bereits auf 50.000 Webseiten im Einsatz.
Andere Plattformen zogen schnell nach. LinkedIn, Pinterest und X übernahmen das Protokoll und lesen dieselben Tags aus. X hat zwar ein eigenes System namens Twitter Cards entwickelt, greift aber automatisch auf die Open Graph Tags zurück, wenn keine Twitter-spezifischen Tags vorhanden sind. Die offizielle Dokumentation des Protokolls findest du unter ogp.me, wo es unter der Open Web Foundation Agreement Version 0.9 veröffentlicht ist.
Wie Open Graph technisch funktioniert
Open Graph Tags sind Meta-Tags, die du im <head>-Bereich einer HTML-Seite hinterlegst. Jeder Tag hat ein property-Attribut, das mit og: beginnt, und ein content-Attribut mit dem eigentlichen Wert. Eine einfache Implementierung sieht so aus:
<meta property="og:title" content="Mein Seitentitel" /> <meta property="og:description" content="Eine kurze Beschreibung der Seite." /> <meta property="og:image" content="https://beispiel-seite.at/bilder/vorschau.jpg" /> <meta property="og:url" content="https://beispiel-seite.at/kontakt" />
Laut dem offiziellen OGP-Standard sind genau vier Tags Pflicht: og:title, og:type, og:image und og:url. Alle anderen sind optional, aber sinnvoll. Der og:type-Tag beschreibt, um welche Art von Inhalt es sich handelt — etwa website, article oder video.movie. Fehlt er, setzt Facebook automatisch website ein.
Wenn jemand einen Link teilt, schickt die Plattform einen Crawler (ein automatisches Programm) zur verlinkten Seite. Dieser liest die Meta-Tags aus und baut daraus die Vorschaukarte zusammen. Das Ergebnis sieht der Nutzer, bevor er auf den Link klickt.
Das Vorschaubild: og:image
Das Bild ist der wirkungsvollste Teil einer geteilten Vorschau. Facebook empfiehlt eine Mindestgröße von 1.200 × 630 Pixeln mit einem Seitenverhältnis von 1,91:1. Bilder unter 600 × 315 Pixeln werden nur als kleines Quadrat angezeigt und verlieren damit ihre Wirkung. Es lohnt sich außerdem, zusätzlich og:image:width und og:image:height anzugeben — damit lädt Facebook das Bild beim ersten Teilen sofort, ohne es erst herunterladen und analysieren zu müssen.
Ohne ein gesetztes og:image sucht sich die Plattform selbst ein Bild von der Seite — oft das Logo oben links oder irgendein zufälliges Element. Das ist selten das, was du dir vorstellst.
Open Graph und SEO
Open Graph ist kein direkter Rankingfaktor für Google. Die Tags werden bei der Indexierung ignoriert. Der indirekte Effekt ist aber real: Eine gut gestaltete Vorschau führt zu mehr Klicks auf geteilte Links. Mehr Traffic und höheres Engagement können sich langfristig positiv auf dein Ranking auswirken. Außerdem stärkt eine konsistente, markenkonforme Vorschau die Wiedererkennung deiner Marke.
Open Graph in der Praxis einrichten
In WordPress brauchst du in der Regel keinen Code zu schreiben. Plugins wie Yoast SEO oder RankMath setzen die Open Graph Tags automatisch und erlauben dir, Titel, Beschreibung und Bild pro Seite individuell festzulegen — direkt im Editor.
Willst du prüfen, wie deine Seite auf Facebook aussieht, nutzt du den Facebook Sharing Debugger (unter developers.facebook.com/tools/debug). Für LinkedIn gibt es den LinkedIn Post Inspector. Diese Tools zeigen dir die ausgelesenen Tags und erlauben es, den Cache der Plattform zu leeren — das ist wichtig, wenn du Änderungen vorgenommen hast und das alte Bild noch angezeigt wird.
Wenn du Titel, Beschreibung und Vorschaubild für deine Seite schnell prüfen und anpassen willst, kannst du dafür den SERP & Open Graph Editor der SEO-Küche verwenden.
Häufige Fragen
Was passiert, wenn ich keine Open Graph Tags setze?
Plattformen wie Facebook lesen dann automatisch irgendwelche Inhalte aus der Seite aus — meistens den <title>-Tag, die Meta-Description und das erste Bild, das der Crawler findet. Das Ergebnis ist oft unvorteilhaft und nicht das, was du dir als Vorschau wünschst.
Wirken sich Open Graph Tags direkt auf das Google-Ranking aus?
Nein, Google ignoriert og:-Tags bei der Indexierung. Indirekt kann eine ansprechende Vorschaukarte aber die Klickrate auf geteilte Links erhöhen, was langfristig den Traffic steigert und sich positiv auf dein Ranking auswirken kann.
Muss ich für jede Plattform eigene Tags setzen?
Nein, Open Graph ist plattformübergreifend. Facebook, LinkedIn, Pinterest und X lesen alle dieselben og:-Tags aus. Wenn du X besonders optimieren willst, kannst du zusätzlich Twitter-Card-Tags setzen — fehlen diese, greift X automatisch auf die Open Graph Tags zurück.
