Du fügst eine URL in ein Tool ein und siehst, wie sie auf Facebook, LinkedIn und WhatsApp aussieht, bevor es jemand anderes tut. Das macht ein Social-Media-Vorschau-Checker. Er liest deine Open-Graph-Tags und rendert plattformähnliche Karten, damit du kaputte Bilder und falsche Titel vor dem Go-Live findest.
Kurzantwort
Ein Social-Media-Vorschau-Checker lädt deine URL wie ein Social Crawler, extrahiert Open-Graph-Meta-Tags und zeigt simulierte Link-Vorschauen für mehrere Plattformen gleichzeitig. Tools wie OpenGraph Check zeigen Titel, Description, Bild und erkannte Tag-Werte nebeneinander. Nutze einen Vorschau-Checker für schnelle Multi-Plattform-Validierung vor dem Teilen. Offizielle Plattform-Debugger, wenn du den gecachten Preview auf einem Netzwerk leeren musst.
Wie Link-Vorschauen entstehen
Beim Teilen einer URL fordert der Plattform-Crawler deine Seite an, liest HTML-<head>-Meta-Tags, lädt og:image und speichert eine gecachte Vorschau-Karte. Auf den meisten Netzwerken kein JavaScript. Die Vorschau hängt nur davon ab, was der Crawler in der ersten HTML-Antwort bekommt.
Kern-Tags:
<meta property="og:title" content="Deine Überschrift"><meta property="og:description" content="Deine Zusammenfassung."><meta property="og:image" content="https://example.com/og.jpg"><meta property="og:url" content="https://example.com/seite">Referenz: Open-Graph-Tags erklärt.
Was ein Vorschau-Checker wirklich macht
Ein guter Vorschau-Checker durchläuft vier Schritte:
- Fetch der URL mit crawler-ähnlichem User Agent über HTTPS
- Parse des HTML nach
og:*,twitter:*und Standard-Meta-Tags - Validate der Pflichtfelder, Markierung fehlender oder kaputter Werte
- Render visueller Vorschauen, die das Karten-Layout jeder Plattform approximieren
Ergebnis: Ein Dashboard, das zeigt, was Facebook, LinkedIn, X, WhatsApp und Discord aus derselben URL anzeigen würden.
Vorschau-Checker vs. Plattform-Debugger
Die Tools überschneiden sich, erfüllen aber unterschiedliche Jobs.
| Feature | Vorschau-Checker (OpenGraph Check) | Plattform-Debugger |
|---|---|---|
| Geschwindigkeit | Ein Scan, alle Plattformen | Eine Plattform pro Tool |
| Cache-Kontrolle | Zeigt Live-Tags | Kann Re-Scrape erzwingen |
| Visuelle Vorschau | Ja, Multi-Plattform | Ja, einzelne Plattform |
| Offizielle Scrape-Fehler | Allgemeine Warnungen | Detaillierte Error Codes |
| Account nötig | Meist nein | Oft ja (Facebook) |
| Ideal für | Validierung vor dem Teilen | Cache-Refresh nach Fix |
Beides nutzen. Vorschau-Checker zuerst für Speed. Debugger, wenn eine Plattform nach dem Tag-Fix noch alte Daten zeigt.
Wann du einen Vorschau-Checker brauchst
Vor Veröffentlichung
Marketing und Content sollten jede URL im Launch-Kalender scannen. Fehlendes og:image auf einer Produktseite kostet Klicks ab Tag eins.
Nach CMS- oder Theme-Änderungen
WordPress-Plugin-Updates, Next.js-Deploys und Shopify-Theme-Edits können Meta-Tags still entfernen. High-Traffic-URLs nach metadata-relevanten Änderungen scannen.
Vor Paid-Social-Kampagnen
Ad-Plattformen nutzen dieselben OG-Tags wie Organic Shares. Kaputte Vorschau auf einer Landing Page verbrennt Budget. Siehe Website-Vorschau vor dem Teilen.
Beim Debuggen von Kunden-Sites
Agenturen mit Dutzenden URLs profitieren von einem Tool für alle Netzwerke statt fünf separater Debugger.
Nach gemeldetem Problem
Kollege sagt, LinkedIn-Vorschau stimmt nicht. Mit Vorschau-Checker Live-Tags prüfen, dann LinkedIn Post Inspector für Cache-Refresh.
Was du in den Ergebnissen bewertest
Tag-Vollständigkeit
Diese müssen mit nicht-leeren Werten existieren:
og:titleog:descriptionog:image(absolute HTTPS-URL)og:url
Fehlt eines, leidet die Karte. Guide: Fehlendes OG-Bild beheben.
Bild-Erreichbarkeit
Der Checker sollte bestätigen, dass die Bild-URL 200 liefert. Bei Unklarheit manuell öffnen. Specs: Open-Graph-Bildgröße.
Plattform-spezifische Crops
Jedes Netzwerk cropt anders. LinkedIn bevorzugt höhere Karten. Facebook nutzt 1.91:1. Prüfen, dass wichtiger Inhalt jeden Crop im Preview-Grid überlebt.
Twitter-Card-Fallback
X liest Open Graph, respektiert aber explizite twitter:*-Tags. Vergleich: Open Graph vs. Twitter Card.
Grenzen jedes Checkers
Approximierte Vorschauen
Gerenderte Karten imitieren das Plattform-Layout, können aber um wenige Pixel oder Schriftstärke von der Live-App abweichen. Richtungsweise korrekt, nicht pixelgenau.
Kann Plattform-Cache nicht leeren
Zeigt Facebook nach dem Tag-Fix noch ein altes Bild, kann nur der Facebook Sharing Debugger Re-Scrape erzwingen. Siehe Link-Vorschau-Cache erklärt.
Private oder authentifizierte URLs
Checker können localhost, VPN-Staging oder login-geschützte Seiten nicht scannen. Zuerst auf öffentliche HTTPS-URL deployen.
Rate Limits bei manchen Debuggern
Offizielle Tools drosseln wiederholte Scrapes. Vorschau-Checker erlauben meist häufigere Scans während der Entwicklung.
Wie OpenGraph Check funktioniert
OpenGraph Check ist für genau diesen Workflow gebaut:
- Beliebige öffentliche HTTPS-URL einfügen
- Erkannte Meta-Tags im Code-Panel ansehen
- Gerenderte Vorschauen für Facebook, LinkedIn, X, WhatsApp und Discord vergleichen
- Fehlende Felder in den Ergebnissen erkennen
- Nach Fixes erneut scannen, ohne die Seite zu verlassen
Kein Account, keine Installation. Für Entwickler, Marketer und Support-Teams, die schnell eine Antwort brauchen.
Vorschau-Checks in den Workflow einbauen
Content-Kalender: „OG-Scan" als Checklisten-Punkt vor jeder geplanten Veröffentlichung.
CI-Pipeline (optional): Nach Deploy prüfen, ob og:image im Production-HTML existiert. Ersetzt keine visuelle Review.
QA-Handoff: Entwickler fügen Staging-URL in OpenGraph Check ein, bevor ein Ticket done ist.
Kunden-Reports: Preview-Grid als Screenshot als Nachweis, dass Tags vor Launch-Sign-off funktionieren.
Voller Test-Prozess: Open-Graph-Tags testen.
Typische Fragen, die Vorschau-Checker aufdecken
| Symptom im Checker | Wahrscheinliche Ursache | Fix |
|---|---|---|
| Kein og:image | Tag fehlt oder relative URL | Absolute HTTPS-URL setzen |
| Titel abgeschnitten | Über 60 Zeichen | og:title kürzen |
| Bild 403 oder 404 | Falscher Pfad oder Auth-Block | CDN-Berechtigungen fixen |
| Anderer Titel als erwartet | CMS-Override oder Cache | Plugin-Social-Einstellungen prüfen |
| WhatsApp weicht von Facebook ab | Sollte passen (Meta-Cache) | Im FB-Debugger re-scrapen |
FAQ
Ist ein Social-Media-Vorschau-Checker dasselbe wie ein OG-Validator?
Ähnlich. Beide lesen Open-Graph-Tags. Ein Vorschau-Checker betont visuelle Karten über Plattformen. Ein OG-Validator fokussiert Tag-Syntax und SEO-Regeln. OpenGraph Check macht beides.
Sind Vorschau-Checker genau?
Genau für Tag-Werte, approximiert für visuelles Layout. Kritische Launches immer mit privatem Test-Share bestätigen.
Brauche ich trotzdem den Facebook Sharing Debugger?
Ja, bei Posts auf Facebook, Instagram oder WhatsApp und zum Leeren von stale Cache. Der Vorschau-Checker ergänzt ihn.
Können Vorschau-Checker mehrere URLs gleichzeitig scannen?
Die meisten Free-Tools scannen eine URL pro Request. Batch-Check bedeutet mehrere Scans oder API für Automation.
Warum zeigt der Checker Tags, die ich in DevTools nicht sehe?
Von Client-JavaScript injizierte Tags erscheinen in DevTools, nicht im Seitenquelltext. Crawler und Checker sehen nur Server-HTML.
Ist es sicher, Kunden-URLs in Online-Checkern einzufügen?
Seriöse Tools laden nur öffentlich erreichbare Seiten. URLs mit Secret-Tokens in Query-Strings vermeiden.
Unterschied Vorschau-Checker und Screenshot-Tool?
Screenshot-Tools erfassen, wie eine Seite im Browser aussieht. Vorschau-Checker simulieren, wie Social-Plattformen Meta-Tags zu Share-Karten parsen. Unterschiedliche Fragen, unterschiedliche Tools.
Fazit
Ein Social-Media-Vorschau-Checker ist der schnellste Weg zu sehen, wie dein Link vor dem Post aussieht. Mit OpenGraph Check scannen, fehlende Tags fixen, bei Cache-Themen Plattform-Debugger bestätigen und mit Vertrauen teilen. Fünf Minuten Check verhindern, dass das falsche Bild deine Marke in jedem Feed repräsentiert.