4 Min. Lesezeit
Warum deine Link-Vorschauen kaputt aussehen (und wie du sie reparierst)
Eine leere oder falsche Vorschau, wenn du deinen Link in Slack, iMessage oder X einfügst, liegt fast immer an einer Handvoll Open-Graph-Tags. Hier ist die Checkliste.
Du veröffentlichst eine Seite, fügst den Link in Slack ein und bekommst eine nackte URL ohne Bild — oder schlimmer, den Titel vom letzten Monat. Link-Vorschauen werden von Open-Graph- und Twitter-Meta-Tags gesteuert, und fehlen sie oder sind falsch, greift jede Plattform auf etwas Hässliches zurück.
Die Tags, die die Vorschau steuern
<meta property="og:title" content="Your page title" />
<meta property="og:description" content="One clear sentence." />
<meta property="og:image" content="https://yoursite.com/og.png" />
<meta name="twitter:card" content="summary_large_image" />Die üblichen Verdächtigen
- og:image ist ein relativer Pfad — es muss eine absolute URL sein.
- Das Bild ist zu klein; ziel auf 1200×630.
- Tags werden clientseitig eingefügt, sodass Crawler sie nie zu sehen bekommen.
- Ein Cache liefert die alte Vorschau aus — neu einlesen lassen, um sie zu aktualisieren.
Das Tool OG-Image rendert für jede Seite eine gebrandete Karte und zeigt dir die Vorschau in Slack, iMessage, X und LinkedIn, bevor du veröffentlichst — dann verdrahtet das Tool die Tags in deinem Repo, sodass sie serverseitig gerendert werden.