Social Media

So optimierst du deine Link-Vorschau für Facebook

Gesicht, Augen, Facebook Logo
Die Link-Vorschau des Facebook-Beitrags gut aussehen zu lassen, ist keine Kunst. (Foto: Pixabay.com / geralt)
geschrieben von Stephanie Kowalski

Kaum ein Unternehmen kommt heute noch ohne eine Facebook-Fanpage aus. Und da die verhältnismäßig leicht zu bedienen sind, werden täglich zahlreiche Posts veröffentlicht. Die Link-Vorschau des Beitrags gut aussehen zu lassen, ist zwar keine hochtrabende Kunst. Sie erfordert jedoch einige Anpassungen an der eigenen Website. 

Viele Facebook-Seitenbetreiber haben ein Problem mit ihren veröffentlichten Posts: Die Link-Vorschau beinhaltet nur den Namen des Links, es fehlt ein ansprechendes Motiv oder es wird das falsche Bild in der Vorschau angezeigt.

Mit Anpassungen an der eigenen Webseite ermöglichst du Facebook, eine schöne Link-Vorschau zu erstellen. Dazu braucht man nur ein paar Basics in Sachen Suchmaschinenoptimierung und Open Graph Tags.


Neue Stellenangebote

Growth Marketing Manager:in – Social Media
GOhiring GmbH in Homeoffice
Content Marketing Expert / Social Media Expert Publications (w|m|d)
zeb.rolfes.schierenbeck.associates gmbh in Münster
Senior Social Media Manager:in im Corporate Strategy Office (w/d/m)
Haufe Group SE in Freiburg im Breisgau

Alle Stellenanzeigen


Warum du deine Webseite optimieren solltest

Man teilt nicht nur selber seine Inhalte auf Facebook – auch die eigene Zielgruppe und potenzielle Kunden teilen die produzierten Inhalte auf ihren Profilen. Sie sprechen über dein Produkt, deine Marke sowie Dienstleistungen und Services.

Die richtige und ansehnliche Darstellung deiner Social-Media-Beiträge sollte daher ebenso eine wichtige Rolle spielen wie die Distribution. Eine optimale Anzeige ist dann auch wesentlich leichter umzusetzen.

Um deine Webseite für Facebook zu optimieren und die gewünschten Texte sowie Bilder in der Link-Vorschau erscheinen zu lassen, musst du die sogenannten Open-Graph-Tags (OG-Tags) verwenden.

So setzt du OG-Tags richtig ein

Wird eine URL bei Facebook eingegeben, wird der Link aufgerufen und die entsprechende Webseite nach passenden Inhalten für die Vorschau gescannt. Für die Vorschau sucht Facebook automatisch eine Überschrift, einen Text und ein Bild aus. Wie du wahrscheinlich selbst aus Erfahrung weißt, klappt das mal gut und mal weniger gut.

Mit den OG-Tags kannst du Facebook die Bestandteile für die Vorschau vorgeben. Wie andere Meta-Tags werden auch diese im Header-Bereich der Webseite untergebracht. Sie sagen der Suchmaschine von Facebook, was für Überschriften, Texte und Bilder angezeigt werden sollen.

So legst du Bilder und Text mithilfe von OG-Tags für Facebook fest: Um Fehlermeldungen vom W3C-Validator zu vermeiden, solltest du den HTML Prefix <html prefix=“og:http://ogp.me/ns#“> einsetzen. Dann kannst du mit den OG-Tags weitermachen.

Folgende Open-Graph-Tags bilden die Grundlage für eine vollständige und ansehnliche Vorschau bei Facebook:

  • og:title gibt die Überschrift aus.
  • og:image beinhaltet die URL zum Bild, das in der Vorschau gezeigt wird.
  • og:type gibt an, um welchen Inhalt es sich handelt. Für „article“ kannst du weitere Parameter wie Autor und Veröffentlichungsdatum angeben.
  • og:url verweist auf den Link, mit dem Facebook den jeweiligen Beitrag verlinken soll.

Sich über die aktuellen Bild- und Textgrößen zu informieren, kann dir dabei helfen, die Darstellung in der Link-Vorschau noch besser zu optimieren. Im Hilfebereich von Facebook Business findest du die aktuellen Angaben dazu.

Da der größte Teil der Facebook-Nutzer sich die Seiten auf mobilen Endgeräten anschaut, empfiehlt es sich, Bild und Text entsprechend zu optimieren. Der Desktop spielt nur eine untergeordnete Rolle.

Weitere OG-Tags und wie du diese anwenden kannst, findest du im Leitfaden zum Teilen für Webmaster auf der Facebook for Developers-Seite.

Die New York Times veröffentlichte mithilfe der OG-Tags folgenden Beitrag auf ihrer Facebook-Page:

New York Times, Facebook, Link-Vorschau

Für seine Link-Vorschau auf Facebook nutzt die New York Times OG-Tags. (Foto: Facebook.com / Screenshot)

Der HTML-Code sieht mit den entsprechenden OG-Tags so aus:

Im HTML-Code sehen die OG-Tags von der New York Times für Facebook Link-Vorschau so aus. (Foto: Facebook.com / Screenshot)

Wenn das Beitragsbild nicht angezeigt wird

Du hast all die genannten Aspekte berücksichtigt, aber dein Bild wird nicht in der Link-Vorschau bei Facebook angezeigt? Oder es gibt andere Probleme mit dem Post?

Startseite, Facebook, Debugger

Der Facebook Debugger behebt Fehler in der Link-Vorschau deiner Beiträge. (Foto: Facebook.com / Screenshot)

Dann kann dir der „Facebook Debugger“ weiterhelfen. Der Debugger kann die Fehler in dem Link, den du teilen willst, erkennen und damit die Fehlerbehebung erleichtern. Neuerungen erkennt der Debugger automatisch und aktualisiert entsprechend die Link-Vorschau.

Du gehst folgendermaßen vor:

  1. Logge dich bei Facebook ein.
  2. Rufe die folgende Webseite auf:
    https://developers.facebook.com/tools/debug/
  3. Hier trägst du den Link ein, der vom Debugger untersucht werden soll.
  4. Mit dem Klick auf „Fehlerbehebung“ startest du den Debugger.
  5. Hier zeigt der Facebook Debugger in vielen Fällen an, dass die URL fehlerhaft ist.
  6. Klick auf „Neue Informationen abrufen“. In der Regel lässt sich die Fehlermeldung so beheben.
  7. Unter Link-Vorschau solltest du dann deinen Post mit dem gewünschten Vorschaubild vorfinden.

Link-Vorschau für Facebook einfach optimieren und anpassen

Wenn du Inhalte in den sozialen Netzwerken erfolgreich teilst, solltest du darauf achten, dass deine Beiträge auch teilbar sind. Fehlende Überschriften, weniger aussagekräftige Teaser-Texte und fehlende Bilder haben einen sehr starken Einfluss darauf.

OG-Tags und der Facebook Debugger helfen dir dabei, das Beste aus deinen Beiträgen für Facebook herauszuholen. Und dafür brauchst du nur grundlegende Kenntnisse in HTML, um die Tags auf deiner Webseite richtig einzufügen.

Mit der Optimierung verbesserst du die Teilbarkeit deiner Inhalte, ihre Benutzerfreundlichkeit und langfristig deine Reichweite.

Hast du die Open-Graph-Tags oder den Facebook Debugger schon einmal benutzt? 

Auch interessant:

Über den Autor

Stephanie Kowalski

Stephanie Kowalski ist Bloggerin und unterstützt als freiberufliche PRlerin kleine und mittelständische Unternehmen bei ihrer Kommunikation. In ihrem Blog Online PR Guide erklärt sie, wie man mithilfe bewährter PR-Strategien und moderner Online-Kanäle erfolgreich digital kommuniziert.

2 Kommentare

  • Ich vermisse den Hinweis auf das Yoast-Plugin für WordPress, womit sich das ganz einfach anpassen lässt. Immerhin ist WordPress das mit Abstand meistgenutzte CMS und Yoast das mit abstand meistgenutzte SEO-Plugin.

    Da du das Plugin selbst einsetzt, ist es dir ja bestens bekannt. Warum hast du es nicht erwähnt?

    • Hallo Ole,
      danke für deinen Kommentar samt Hinweis. In Kürze werden wir ein paar WordPress-Plugins in einem Artikel vorstellen, in dem auch Yoast und andere SEO-Tools erwähnt werden. Dort gehen wir dann auch auf die Optimierung der Link-Vorschau mit Yoast für Facebook und Twitter ein.

      Viele Grüße
      Philip