Dies sind allgemeine Best Practices für das Schreiben von Open-Graph-Markup von Hand oder in deinem CMS. OG Preview selbst ist ein Betrachter: Es stellt dar, wie deine Tags aussehen werden, und meldet im Modus „URL abrufen“, welche Tags eine Seite bereits bereitstellt.
Verwende eindeutige Tags je Seitentyp
Verschiedene Seiten verdienen verschiedene Vorschauen. Blogbeiträge funktionieren am besten, wenn og:type auf article gesetzt ist, Produktseiten profitieren von einem aussagekräftigen Titel und Bild, und deine Startseite sollte die Markenidentität betonen. Eine einzige generische Vorschau überall wiederzuverwenden senkt die Klickrate.
Optimiere das Bild für schnelle Ladezeiten
Vermeide PNGs mit mehreren Megabyte. Komprimiere auf eine vernünftige Größe, behalte die plattformübergreifend passenden Abmessungen von 1200×630px (1,91:1) bei und stelle sicher, dass die Datei für Crawler schnell lädt.
Setze immer og:site_name
So bleibt dein Markenname in den Vorschauen sichtbar, selbst wenn der Titel abgeschnitten wird:
Teste plattformübergreifend — verlass dich nicht auf Annahmen
Facebook, LinkedIn und X (Twitter) behandeln Meta-Tags jeweils etwas anders. Sieh dir die Vorschau zuerst hier an und überprüfe sie dann auf den echten Plattformen mit deren offiziellen Tools:
Verwende og:type für reichhaltigere Inhalte
Für Blogs verwende article, für Produkte product. Der richtige Typ kann auf manchen Plattformen eine reichhaltigere Darstellung freischalten, etwa Autorennamen oder Veröffentlichungsdaten.
Setze eine absolute Bild-URL
Social-Media-Crawler lösen relative Pfade nicht auf. Verwende immer eine vollständige URL: https://yoursite.com/img/og.jpg, nicht /img/og.jpg.
Cache-Busting für aktualisierte Bilder
Wenn du ein OG-Bild ersetzt, liefern Plattformen möglicherweise weiterhin das alte aus. Ändere den Dateinamen (zum Beispiel og-v2.jpg) oder hänge einen Versions-Query wie ?v=2 an und führe anschließend den Debugger der Plattform erneut aus, um den Cache zu aktualisieren.
Kombiniere OG-Tags mit JSON-LD
Strukturierte Daten über <script type="application/ld+json"> helfen Suchmaschinen, während OG-Tags das Teilen in sozialen Medien übernehmen. Sie ergänzen einander — behalte beide.