OpenGraph-Generator
OpenGraph-Tags für Social-Media-Vorschauen erstellen.
Wofür werden OpenGraph-Tags benötigt?
OpenGraph-Tags steuern, wie ein Link aussieht, wenn er bei Facebook, LinkedIn, WhatsApp & Co. geteilt wird – inklusive Titel, Beschreibung und Vorschaubild. Ohne diese Tags generieren Plattformen die Vorschau selbst, oft mit unpassenden Ergebnissen.
Beispiel: Blogartikel teilen
Ein gesetztes og:image sorgt dafür, dass beim Teilen eines Links ein großes Vorschaubild statt gar keines oder eines zufälligen Seitenbilds angezeigt wird.
Zweites Beispiel: Produkt in einem Shop
Für eine Produktseite trägt man als og:type "product" statt "website" ein, setzt og:title auf den Produktnamen und og:image auf ein Foto mit klarem Motiv ohne viel Textüberlagerung – Plattformen skalieren das Bild oft stark herunter, weshalb kleine Textelemente in der Vorschau unleserlich werden können.
Wann brauchst du den OpenGraph-Generator?
Sinnvoll ist das Tool, bevor ein neuer Blogartikel zum ersten Mal in sozialen Netzwerken geteilt wird, beim Testen, warum ein Link in WhatsApp ohne Bild erscheint, oder direkt nach einem Website-Relaunch, wenn alte og:image-Pfade ins Leere laufen und durch neue URLs ersetzt werden müssen.
Gut zu wissen
Viele Plattformen cachen einmal abgerufene OpenGraph-Daten für einige Tage. Ändert sich das Bild oder der Titel einer bereits geteilten URL, zeigt z. B. Facebook oft weiterhin die alte Vorschau, bis der Cache über ein Debugging-Tool der jeweiligen Plattform manuell aktualisiert wird.
Häufige Fragen
Welche Bildgröße sollte og:image haben?
Empfohlen wird ein Seitenverhältnis von 1,91:1, z. B. 1200×630 Pixel – das sorgt für eine optimale Darstellung als großes Vorschaubild.
Was ist der Unterschied zwischen og:type "website" und "article"?
"website" eignet sich für allgemeine Seiten wie Startseiten, "article" für redaktionelle Inhalte wie Blogartikel und ermöglicht zusätzliche artikelspezifische Meta-Daten.
Werden die OpenGraph-Tags auch von Twitter/X genutzt?
Teilweise – mit dem zusätzlichen twitter:card-Tag greift X/Twitter meist auf dieselben og:title-, og:description- und og:image-Werte zurück.
Warum zeigt WhatsApp beim Teilen kein aktuelles Bild an?
Meist liegt es an einem gecachten alten Snapshot der URL oder an einem og:image-Pfad, der nicht öffentlich ohne Login erreichbar ist – beides verhindert, dass die Plattform das aktuelle Bild neu abruft.
Muss og:url exakt der Adressleisten-URL entsprechen?
Ja, im Idealfall stimmt og:url mit der kanonischen URL der Seite überein, damit Likes, Shares und Klicks eindeutig derselben Seite zugeordnet werden und nicht auf mehrere URL-Varianten verstreut werden.