Beiträge auf Facebook mit Vorschaubild teilen

Facebooknutzer werden die kleinen Vorschaubilder geteilter Beiträge kennen. Manchmal sind sie kleiner, manchmal größer, manchmal nur Quadratisch und sehr klein, aber Lust zum draufklicken machen Sie selten. Dabei geht hier ungenutztes Potential verloren. Mit einem kleinen Trick blenden Sie Vorschaubilder in Facebook ein, die in optimaler Größe eingeblendet werden und zum Klicken animieren.

Facebook Open Graph
Beiträge via  Open Graph auf Facebook teilen

Das Passende Vorschaubild bei Facebook einblenden

Im Normalfall kann der Benutzer, der einen Beitrag bei Facebook teilt aus mehreren kleinen Vorschaubildern das passende auswählen. Oft genug wir aber ein unpassendes Bild, das irgendwo auf der Seite verwendet wird dabei vorgeschlagen. Die meisten User wissen nicht, dass man über einen kleinen Button, der im Vorschaubild eingeblendet wird, blättern kann. Die Folge sind Vorschaubilder, die kaum etwas mit dem eigentlichen Post zu tun haben und dementsprechend auch kaum neugierig machen. Aber Facebook selbst bietet eine Möglichkeit zu jedem Post das passende Vorschaubild ein zu fügen.

Die Facebook Open Graph Meta Tags

Über kurze, für den normalen Besucher unsichtbare, Meta-Angaben im Quellcode einer Webseite werden Zusatzinformationen transportiert, die dafür sorgen, dass das Snipet eines Beitrages in Facebook korrekt erscheint. Viele kennen vielleicht die sogenannte Meta Description, die von den meisten Suchmaschinen als Kurzbeschreibung in den Suchmaschinenergebnissen verwendet wird. Solche Meta Tags gibt es auch für soziale Medien. Facebook stellt für diese Zwecke den Open Graph zur Verfügung. Die entsprechenden Metatags haben angelehnt an den Namen Open Graph das vorangestellte Akronym „og“. Mit folgendem Meta Tag legt man den Titel des Beitrages in Facebook fest:

<meta property=“og:title“ content=“Titel  bei Facebook„>

Solche Meta Tags gibt es für die Kurzbeschreibung, die zu verlinkende URL, oder aber das Vorschaubild. Der Meta Tag für das Vorschaubild sieht folgendermaßen aus:

<meta property=“og:imagecontent=“https://www.beispieldomaine/img/vorschaubild.jpg„>

Über diesen Meta Tag teilen Sie Facebook, aber auch anderen sozialen Medien mit, welches Bild als Vorschaubild verwendet werden soll. Die im Tag eingebundene URL verweist auf das Vorschaubild. Auch Google Plus hat das Rad nicht neu erfunden und verwendet diese Vorschaubilder.

Die richtige Größe für Facebook Vorschaubilder

DIe richtige Größe für das Facebook Vorschaubild ist leicht zu merken::

möglichst richtig groß!

Damit ein Bild in der Facebook-Vorschau auch auf hochauflösenden Geräten optimal zur Geltung kommt, sollte es mindestens 1.200 x 630 Pixel groß und im Format 1,91:1 hinterlegt sein. Die maximale Größe ist auf 8 MB begrenzt. Wer nicht immer das passende Bild in so hoher Auflösung zur Verfügung hat, der kann auch kleinere Bilder verwenden. Eine akzeptable Mindestgröße beträgt 600 x 315 Pixel. Für die meisten Endgeräte ist das vollkommend ausreichend. Ist das Bild kleiner, dann wird es im Linkseitenbeitrag nur noch im Briefmarkenformat angezeigt und macht kaum noch Sinn.  Über das Open Graph Protokoll lassen sich per og:image:height und og:image:width lauch die genauen Maße des Vorschaubildes an Facebook übermitteln. Das sieht dann so aus:

<meta property=“og:image:width“ content=“600“ />
<meta property=“og:image:height“ content=“315“ />

Bilder in anderen Formaten werden von Facebook oben und unten beschnitten, so daß das Bild wieder im Verhältnis  1,91:1 vorliegt. Das automatisierte Beschneiden kann aber zu unschönen Ergebnssen führen.

Man kann über die Meta Tags übrigens auch eine ALT Beschreibung für das Bild übermitteln. Das sieht dann so aus:

<meta property=“og:image:alt“ content=“Niemals den Alt Tag vergessen“ />

Das Facebook Open Graph Protokoll


Die kompletten Möglichkeiten, die das Open Graph Protokoll zur Verfügung stellt findet ihr unter Facebook Open Graph Protokoll.