Der Aha-Moment: du hast dieses Bild nie bewusst ausgewählt
Kopier mal die Adresse deiner Website und schick sie dir selbst per WhatsApp. Was da als Kachel auftaucht — Bild, Titel, Beschreibung — hast du in den seltensten Fällen bewusst festgelegt. Es kommt aus einem Meta-Tag im Quelltext deiner Seite:
<meta property="og:image" content="https://deine-domain.de/og/bild.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />Facebook, LinkedIn, X, WhatsApp, Slack, Discord — sie alle lesen dieses Tag aus, wenn dein Link geteilt wird. Fehlt es oder ist das Bild lieblos, sieht dein Link aus wie jeder andere. In einem vollen Feed ist das der Unterschied zwischen „drüber weggescrollt” und „draufgeklickt”.
Ich komme aus der Frontend- und Banking-Welt, bevor ich Websites gebaut habe. Da habe ich gelernt: Details, die niemand bewusst wahrnimmt, entscheiden trotzdem. Das og:image ist so ein Detail.
Die harten Specs — als Checkliste
Es gibt keine geheime Formel, aber es gibt Grenzen, an die sich die Plattformen halten. Das Wichtigste in Kurzform:
| Anforderung | Wert |
|---|---|
| Empfohlene Größe | 1200 × 630 Pixel |
| Seitenverhältnis | 1,91 : 1 |
| Mindestgröße | 600 × 315 px (unter 200 × 200 wird abgelehnt) |
| Format | JPG oder PNG |
| Dateigröße | maximal 8 MB — sinnvoll optimiert unter 300 KB |
Die 1200 × 630 sind die goldene Regel: groß genug für scharfe Darstellung auf Retina-Displays, exakt im Seitenverhältnis, das die großen Plattformen als „summary large image” ausspielen. Kleiner solltest du nicht gehen — unter 200 × 200 Pixel weigern sich manche Netzwerke schlicht, überhaupt eine Vorschau zu zeigen.
Und die Dateigröße ist kein Detail für Nerds: Ein 4-MB-Vorschaubild lädt im mobilen Feed spürbar träge. Ich ziele bei jedem Bild auf unter 300 KB — scharf, aber leicht.
Quellen zum Nachlesen: die SISTRIX-Anleitung zu Open Graph und der Styleguide der Bundesregierung zu Open-Graph-Tags.
Der 20-%-Text-Mythos
Fast immer taucht bei diesem Thema die Regel auf: „Maximal 20 % der Fläche dürfen Text sein.” Ehrlich gesagt — die ist überholt. Das war eine Vorgabe von Facebook für bezahlte Anzeigen, und Facebook hat sie 2020 selbst abgeschafft.
Für dein normales, organisch geteiltes og:image gibt es diese harte Grenze nicht. Was bleibt, ist der gesunde Menschenverstand dahinter: Ein Vorschaubild, das mit Text zugepflastert ist, liest im kleinen Feed-Format niemand. Ich behandle die 20 % also als Faustregel für Lesbarkeit, nicht als Gesetz. Eine klare Aussage, groß gesetzt, schlägt einen Absatz in Miniatur.
Warum die meisten Vorschaubilder blass sind — und was ich anders mache
Die üblichen Verdächtigen für langweilige og:images:
- Kein eigenes Bild — der Link zeigt irgendein zufälliges Foto von der Seite oder gar nichts.
- Falsche Schrift — viele automatische Generatoren fallen auf eine System-Standardschrift zurück. Das Ergebnis wirkt technisch und flach, nicht nach Marke.
- Kein Grund zu klicken — hübsch, aber ohne Aussage. Ein Bild ohne Nutzenversprechen ist Dekoration.
Ich baue meine Vorschaubilder deshalb nach drei Prinzipien:
Erstens: scharfe, echte Markenschrift. Ich rendere die Bilder mit den echten Schriften der Marke — als Vektorpfade, zusätzlich mit doppelter Auflösung berechnet und dann heruntergerechnet. Das ergibt gestochen scharfe Kanten, auch auf hochauflösenden Handys.
Zweitens: eine Aussage, kein Roman. Ein klares Nutzenversprechen und der Ort — „Ihr Elektriker in Regensburg.” Wer das im Feed sieht, weiß sofort, worum es geht.
Drittens: ein echtes Vertrauenssignal statt eines gemalten Buttons. Ein Vorschaubild ist nicht klickbar — ein aufgemalter „Jetzt klicken”-Knopf wirkt darum eher billig. Was wirklich zieht, ist ein Gesicht oder eine ehrliche Google-Bewertung („★ 4,9”). Vertrauen schlägt Deko.
Bei meinen eigenen Seiten gehe ich noch einen Schritt weiter: Da stehen die tagesaktuellen Google-PageSpeed-Werte direkt im Vorschaubild. Nicht als Behauptung — als Messwert mit Datum. Das passt zu dem, wofür Blitzsicht steht: beweisen statt behaupten. Für die Website eines Handwerkers wäre das der falsche Hebel — da zählt der Bewertungsstern, nicht der SEO-Score. Das richtige Signal hängt davon ab, wen du erreichen willst.
Was du selbst prüfen kannst
Drei schnelle Checks für deine eigene Seite:
- Teilen-Test: Schick deinen Link per WhatsApp an dich selbst. Kommt eine saubere Kachel mit Bild, Titel und Beschreibung? Oder nur nackter Text?
- Größe prüfen: Ist das Vorschaubild 1200 × 630 Pixel und unter 300 KB? (Rechtsklick → Bild in neuem Tab öffnen zeigt oft die Maße.)
- Aussage prüfen: Versteht jemand in einer Sekunde, was du anbietest und wo — ohne den Text daneben zu lesen?
Wenn einer dieser Punkte hakt, verschenkst du bei jedem geteilten Link Aufmerksamkeit.
Genau solche unscheinbaren Hebel schaue ich mir bei einem kostenlosen Website-Audit an — inklusive der Frage, wie deine Seite aussieht, wenn jemand sie teilt.