Zum Inhalt springen

Cookie-Einstellungen

Optionale Statistik hilft uns zu verstehen, welche Seiten und Tools nützlich sind. Wenn du sie erlaubst, nutzen wir Google Analytics. Deine Dateien sind nie dabei, und jedes Tool funktioniert genauso, wenn du ablehnst. Cookie-Richtlinie

Open Graph Test

Prüfe die Open-Graph-Tags einer Seite und sieh dir die Karte an, die eine Social-Media-Plattform daraus baut, bevor du es erst beim Posten des Links merkst.

Browser-Tool

Open Graph

Lies die Tags aus dem HTML einer Seite aus oder beschreibe die Seite im Formular. Die Vorschauen sind nur Annäherungen: Plattformen gestalten Karten um und speichern zwischen, was sie abgerufen haben.

Über Open-Graph-Vorschau

Dass eine Linkvorschau kaputt ist, merkst du beim Teilen des Links, und dann hat die Plattform das Falsche schon zwischengespeichert. Die Tags vorher zu prüfen, ist der Unterschied zwischen einer durchdachten Vorschau und einer nackten URL im Feed einer Kollegin. Die Vorschau ist kostenlos, wird online erzeugt und braucht keine Registrierung. Deine URL und deine Texte werden lokal verarbeitet, statt irgendwohin geschickt zu werden.

So nutzt du Open-Graph-Vorschau

  1. Seite oder Markup bereitstellenJede im head des Dokuments deklarierte Eigenschaft wird neben ihrem Wert aufgeführt.
  2. Die vier wichtigen prüfenTitel, Beschreibung, Bild und URL. Ein fehlendes Bild fällt am meisten auf, weil es den Unterschied zwischen einer Karte und einer Textzeile ausmacht.
  3. Ergebnis in der Vorschau ansehenSieh ungefähr, wie sich die Karte zusammensetzt, bevor eine Plattform sie wirklich baut.

Warum das Bild eine absolute URL braucht

Ein Crawler, der deine Seite von seiner eigenen Infrastruktur aus abruft, kann /images/card.png nicht auflösen — er weiß nicht, worauf sich der Pfad bezieht. og:image muss eine vollständige URL mit Schema sein. Das ist der mit Abstand häufigste Grund, warum eine Karte alles zeigt außer dem Bild.

Was das Tool nicht kann

  • Eine Vorschau ist eine Annäherung. Jede Plattform schneidet, kürzt und gestaltet anders, und manche ignorieren deine Tags zugunsten ihrer eigenen Auswertung.
  • Plattformen speichern aggressiv zwischen. Ein korrigiertes Tag aktualisiert keine Karte, die bereits abgerufen wurde; die meisten bieten einen Debugger, der einen erneuten Abruf erzwingt.

Open-Graph-Vorschau: häufige Fragen

Warum wird mein Bild nicht angezeigt?
Meist steht eine relative URL dort, wo eine absolute nötig ist, oder das Bild liegt hinter einer Weiterleitung oder einem Login. Gelegentlich ist es ein Größenlimit — sehr große Bilder überspringen manche Plattformen, und sehr kleine werden als Icons ignoriert.
Brauche ich neben Open Graph auch Twitter-Card-Tags?
Meistens nicht. Die meisten Plattformen greifen auf Open Graph zurück, wenn die spezifischen Tags fehlen. Ergänze den Kartentyp, wenn du ein bestimmtes Layout willst, und halte dann beide Sätze einheitlich.
Kann ich Open-Graph-Tags für eine localhost- oder Staging-Seite testen?
Ja, denn von deiner URL wird nichts abgerufen: Füge das HTML der Seite ein, lade die gespeicherte Datei hoch oder trag die og:-Werte ins Formular ein. Externe Bilder bleiben Platzhalter, bis du Externe Bilder in der Vorschau laden anhakst. Die fertigen Tags kannst du anschließend direkt in den head der Seite kopieren.

Fragen zu ToolsVerse selbst – Datenschutz, Kosten, was mit deinen Dateien passiert – beantworten die häufig gestellten Fragen.

Die Tools, die man zusammen mit Open-Graph-Vorschau am häufigsten braucht.

Du findest das passende Tool nicht?

Sag uns, was du suchst, und wir prüfen, ob wir es hinzufügen.

Tool vorschlagen →