Bedeutung, Vorteile und Optimierung

OG Image

Kontakt aufnehmen

Obwohl Facebook das Open Graph Protocol bereits 2010 eingeführt hat, ist es für viele Webseitenbetreiber immer noch ein Buch mit sieben Siegeln. OG Tags werden entweder gar nicht, falsch oder ineffizient eingesetzt. Dadurch wird die Chance vertan, Inhalte der eigenen Seite optimal auf Facebook zu präsentieren.

Was ist ein Open Graph Image? 

Das Open-Graph-Protokoll definiert, wie geteilte Inhalte in den Sozialen Medien dargestellt werden. Es umfasst Metadaten für Crawler, die so die relevanten Informationen auf einer Webseite gezielt finden und als Vorschau anzeigen können. Sind keine OG Tags vorhanden, wählen die jeweiligen Crawler von Facebook, Twitter, Pinterest & Co. mehr oder minder zufällig Texte und Bilder aus. Das verhindern Sie durch das Setzen von Open Graph Meta Tags im Quellcode Ihrer Webseite. Das zur URL passende Bild wählen Sie mit dem Tag og:image aus: 

<meta property="og:image" content="https://beispielseite.com/assets/beispielbild.jpg" /> 

In CMS wie WordPress lässt sich das og:image auch ohne HTML-Kenntnisse einfügen, etwa über ein benutzerfreundliches SEO Plug-in. 

Fehlt die og:image-Auszeichnung, erscheint auf der Social-Media-Plattform im ungünstigsten Fall nicht das Artikelbild, sondern ein Werbebanner. Das sollten Sie unbedingt vermeiden. 

Welche Vorteile hat ein OG Image?

Ein sorgfältig gewähltes, aussagekräftiges und ansprechendes Open Graph Image hat viele Vorteile: 

  • Es fungiert buchstäblich als Blickfang und lenkt die Aufmerksamkeit der User auf den Content. 

  • Als Teil der Einheit “Wort und Bild” ist es die perfekte Ergänzung zu den Tags “og:title” und “og:description”, die Überschrift und Inhaltsbeschreibung umfassen. 

  • Die Algorithmen spielen den Content eher der relevanten Zielgruppe aus. 

  • Neben dem eigentlichen Inhalt lassen sich nebenbei weitere Botschaften transportieren, über ein dezentes Logo beispielsweise die Marke. 

  • Eine attraktive Bilddarstellung verbessert die Klickrate.  

  • Die User teilen die Inhalte lieber – das kann sich positiv auf Offpage-Optimierung auswirken. 

OG Image Größe und Format: Was gilt es zu beachten?

Neben dem og:title- und dem og:description-Tag ist insbesondere das OG Image für die Gestaltung eines perfekten Facebook-Snippets wichtig. Hier herrscht oft Unklarheit bezüglich der richtigen Formate und Größen. Zu kleine oder gar abgeschnittene Bilder verlieren ihre Wirkung auf Facebook bzw. konterkarieren sie.

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 angelegt sein. Die Bildgröße ist dabei auf 8 MB beschränkt. Auf anderen Endgeräten reichen auch 600 x 315 Pixel: Diese Bildgröße lässt sich zur Not also verwenden, wenn keine bessere Auflösung verfügbar ist. Kleinere Bilder, etwa in der Größe 200 x 200 Pixel, werden im Linkseitenbeitrag fast unkenntlich dargestellt, so dass sie keinen Sinn machen.

Eine minimale Abweichung vom Format 1,91:1 ist möglich, allerdings sind dann Teile des Bildes abgeschnitten. Um sicherzustellen, dass ein OG Image beim ersten Teilen bzw. Liken zu sehen ist, sollten dem Crawler per og:image:height und og:image:width die genauen Maße mitgeteilt werden.

Die aktuellen Open-Graph-Image-Größen im Überblick:  

  • Für Facebook Posts und Timeline-Bilder: 1200 x 630 Pixel, 600 x 315 Pixel (Minimum) 

  • Für Twitter In-Stream-Bilder: 1600 x 900 Pixel (empfohlen), 600 x 335 Pixel (Minimum) 

  • Für Instagram-Posts: 1080 x 566, 1080 x 1080 oder 1080 x 1350 Pixel  

  • Für Pinterest Story Pins und Fleets: 1080 x 1920 

  • Für LinkedIn Blogposts: 1200 x 627 Pixel 

  • Für YouTube Banner: 2048 x 1152 Pixel, für Vorschaufotos 1280 x 720 Pixel 

  • Für TikTok-Profilfotos: 20 x 20 Pixel (Minimum), für Videos 1080 x 1080 Pixel 

MVV
diva-e sorgte für die Anbindung eines Commerce Systems in die SAP-Landschaft und entwickelte ein Self-Service Portal für Kunden.
Schott
diva-e schafft durch die Online Plattform des Glas-Weltmarktführers ein einzigartiges Bestellerlebnis im B2B.
dmTech
diva-e setzt gemeinsam mit dmTech neue Maßstäbe sowohl in der Softwareentwicklung als auch in der digitalen Beratung.
Weleda
diva-e begleitet Weleda seit mehreren Jahren auf dem Weg der digitalen Transformation. Als großer Meilenstein der Digitaloffensive ging im Februar 2024 der Online-Shop in Deutschland live.
Vergölst
diva-e bringt die Kundenansprache bei Vergölst durch optimierte Bestandskundenansprache mit Adobe Campaign ins Rollen.
Talanx
diva-e bildete im Projekt mit der Talanx Gruppe für den Relaunch der Corporate Website sowie das neue Karriereportal die gesamte digitale Wertschöpfungskette ab.
STAUFF
diva-e entwickelt eine skalierbare und zukunftssichere Architektur und integriert diese in die bereits bestehenden Backendsysteme.
Hertha BSC
diva-e entwickelte für Hertha BSC eine neue State-of-the-Art Website mit emotionalem Design.
Klöckner & co
diva-e begleitet Stahlhandelsriesen Klöckner bei der Digitalisierung und realisiert Online Shops mit Marktplatzfunktion.
FC Bayern München
diva-e setzt für den deutschen Rekordmeister und seine Fans neue Maßstäbe mit maßgeschneiderten digitalen Erlebnissen.
EDEKA
diva-e realisiert für den Einzelhandelsriesen eine dynamische E-Food-Plattform und sorgt so für mehr Transaktionen.
MVV
diva-e sorgte für die Anbindung eines Commerce Systems in die SAP-Landschaft und entwickelte ein Self-Service Portal für Kunden.
Schott
diva-e schafft durch die Online Plattform des Glas-Weltmarktführers ein einzigartiges Bestellerlebnis im B2B.
dmTech
diva-e setzt gemeinsam mit dmTech neue Maßstäbe sowohl in der Softwareentwicklung als auch in der digitalen Beratung.
Weleda
diva-e begleitet Weleda seit mehreren Jahren auf dem Weg der digitalen Transformation. Als großer Meilenstein der Digitaloffensive ging im Februar 2024 der Online-Shop in Deutschland live.
Vergölst
diva-e bringt die Kundenansprache bei Vergölst durch optimierte Bestandskundenansprache mit Adobe Campaign ins Rollen.
Talanx
diva-e bildete im Projekt mit der Talanx Gruppe für den Relaunch der Corporate Website sowie das neue Karriereportal die gesamte digitale Wertschöpfungskette ab.
STAUFF
diva-e entwickelt eine skalierbare und zukunftssichere Architektur und integriert diese in die bereits bestehenden Backendsysteme.
Hertha BSC
diva-e entwickelte für Hertha BSC eine neue State-of-the-Art Website mit emotionalem Design.
Klöckner & co
diva-e begleitet Stahlhandelsriesen Klöckner bei der Digitalisierung und realisiert Online Shops mit Marktplatzfunktion.
FC Bayern München
diva-e setzt für den deutschen Rekordmeister und seine Fans neue Maßstäbe mit maßgeschneiderten digitalen Erlebnissen.
EDEKA
diva-e realisiert für den Einzelhandelsriesen eine dynamische E-Food-Plattform und sorgt so für mehr Transaktionen.
weleda logo
Logo von Talanx
weleda logo
Logo von Talanx

We

our partners