Zum Hauptinhalt springen

Linkvorschau: Open Graph Tags

Florian Triller-Windisch avatar
Verfasst von Florian Triller-Windisch
Vor über 2 Monaten aktualisiert

Wenn eine Link-Vorschau in einem Social Media Post nicht wie gewünscht dargestellt wird, liegt das häufig an fehlenden oder unvollständigen Open Graph Tags auf der verlinkten Website. Diese Meta-Informationen im Quellcode einer Seite definieren z. B.:

  • den Titel des Artikels

  • das Vorschaubild

  • eine Kurzbeschreibung

  • den Autor oder weitere Details

Swat.io greift auf diese Open Graph Tags zu, um die Vorschau korrekt anzuzeigen.
Sind die Tags nicht vorhanden oder fehlerhaft, kann die Vorschau unvollständig oder falsch dargestellt werden.

Tipp: Du kannst die Open Graph Tags eines jeden Links mit Tools wie dem Facebook Sharing Debugger prüfen. Swat.io selbst greift auf die gleichen Informationen zu.

Screenshot vom Facebook Sharing-Debugger

Eine vollständige Auflistung aller Open Graph Tags und Angaben zur Verwendung findet sich unter den nachfolgenden Links:
Dokumentation auf opengraph.io (Eng)
Dokumentation auf ogp.me (Eng)
Dokumentation von Facebook (De)

Wenn die Link-Vorschau in Swat.io nicht wie erwartet angezeigt wird, kann es sein, dass Swat.io beim Laden der Vorschau unerwünschte Resultate liefert bzw. die Vorschau nicht anzeigen kann. In diesem Fall wird eine Fehlermeldung mit einem Hinweis auf die fehlerhaften Open Graph Tags angezeigt.

Was tun bei fehlerhaften Open Graph Tags?

Wenn du die Kontrolle über die verlinkte Website hast...

Wenn du die verlinkte Website selbst verwaltest oder dein Web-Team Zugriff darauf hat, kannst du fehlerhafte Open Graph Tags gezielt korrigieren lassen.
Hilfreich dabei ist der Facebook Sharing Debugger, mit dem du:

  • Bestehende Tags analysieren kannst;

  • Fehler identifizieren kannst;

  • Eine neue Link-Vorschau generieren kannst.

Nach der Korrektur kannst du den Link erneut in Swat.io einfügen – die Vorschau sollte dann wie gewünscht angezeigt werden.

Wesentliche OG-Tags:

  • og:title prägnanter, ansprechender Titel

  • og:description kurze Beschreibung, die zum Klick motivieren soll

  • og:image Bild-URL der Vorschau (empfohlen: mindestens 1200 × 630 px, 1.91:1 Format)

  • og:url kanonische URL der Seite

  • Zudem optional: og:type, og:site_name, og:locale, Video- oder Audio-Information

Warum OG-Tags verwenden?

  • Höhere Klickrate durch aussagekräftige Vorschauen

  • Stärkere Markenpräsenz bei geteilten Links

  • Verbesserte Vorschau-Kontrolle über generische oder falsche Vorschaubilder

Wenn du keine Kontrolle über die Website hast...

Auch wenn du keine Möglichkeit hast, die verlinkte Seite zu bearbeiten, kannst du den Link selbstverständlich über Swat.io posten.

In diesem Fall wird das soziale Medium versuchen eine Vorschau automatisch zu erstellen. Ist beispielsweise kein Vorschaubild in den Open Graph Tags definiert, wird ein Bild aus dem Seiteninhalt verwendet.

Analog dazu kannst du auch hier das Verhalten im Voraus mit dem Facebook Sharing Debugger testen. Einfach den gewünschten Link eingeben und auf „Fehlerbehebung“ klicken – du erhältst:

  • Eine Vorschau, wie Facebook den Link darstellen würde;

  • Eine Übersicht aller erkannten Open Graph Tags:

  • Hinweise auf fehlende oder fehlerhafte Angaben.

Best Practice: Immer korrekte Open Graph Tags verwenden

Um eine optimale Darstellung von Links sicherzustellen - sowohl in Swat.io als auch direkt auf Social Media Plattformen - sollten Open Graph Tags immer vollständig und korrekt gesetzt sein.

Info: Gut gepflegte Open Graph Tags verbessern nicht nur die Darstellung auf Facebook & Co., sondern wirken sich auch positiv auf die Sichtbarkeit in Suchmaschinen aus.

Hat dies deine Frage beantwortet?