Wie sieht mein Link auf Facebook und X aus?
URL einfuegen, "Check" druecken, und wir holen die Seite von unserem Server (dein Browser kann das nicht, CORS blockt Cross-Origin), ziehen die OpenGraph- und Twitter-Card-Tags raus und rendern, wie dein Link auf Facebook, Slack, X (Twitter), LinkedIn, Discord und iMessage aussehen wird.
Dazu eine Probleme-Liste: fehlende Tags, falsche Bildgroesse, nicht erreichbare URL, zu langer Titel, falscher Twitter-Card-Typ, relative Bildpfade (manche Crawler verwerfen die).
Ideal vor der Veroeffentlichung eines Blogposts, einer Stellenanzeige, einer Marketingkampagne oder einer neuen Landingpage.
So benutzt du es
- Die volle URL der Seite einfuegen (z. B. `https://deine-site.de/blog/post`). `https://` kannst du weglassen, wir ergaenzen es.
- "Check" klicken oder Enter druecken. Der Server hat 8 Sekunden zum Abrufen, meist 1 bis 3 Sekunden.
- Du siehst 5 nebeneinander Vorschauen, eine Tabelle mit allen gefundenen Meta-Tags und eine Liste von Problemen.
- Bei roten Fehlern (fehlendes `og:image`, nicht erreichbares Bild) im CMS fixen und nochmal pruefen.
- Nach dem Veroeffentlichen den Cache mit den Plattform-Tools manuell refreshen: Facebook Sharing Debugger, LinkedIn Post Inspector, X Card Validator.
Wann das nuetzlich ist
Sechs typische Situationen, in denen sich eine Link-Vorschau vor dem Ausspielen lohnt:
- Ein neuer Blogpost. Pruefen, dass das Featured-Image als `og:image` erkannt wird und an den Raendern nicht beschnitten ist.
- Eine Stellenanzeige. HR will den Link auf LinkedIn teilen, die Vorschau muss professionell aussehen. Ohne `og:image` zeigt LinkedIn nur die Domain.
- Social-Media-Kampagne. Marketing plant bezahlte Posts, jeder Link braucht ein 1200x630-Bild und einen lesbaren Titel unter 60 Zeichen.
- Eine neue Produkt-Landingpage. Verifizieren, dass `twitter:card` auf `summary_large_image` (grosse Karte) statt `summary` (kleines Thumbnail) steht.
- SEO-Audit beim Kunden. Die Schluesselseiten der Reihe nach scannen, eine Liste von Luecken bauen und den Report an die Dev-Crew uebergeben.
- Nach einer CMS-Migration. Pruefen, dass `og:url` auf die neue Domain zeigt, nicht auf die alte (haeufiger Bug nach Migration von WordPress zu Next.js).
Brauchst du Meta-Tags von Grund auf? Nimm den Meta-Tags-Suite-Generator. Wenn die Seite live ist, generiere die passende sitemap.xml und robots.txt, damit Suchmaschinen sie sauber aufnehmen.