Zum Inhalt springen
FA
Alle Insights

OG-Image und Social-Preview für Kanzlei-Websites

Sobald jemand einen Link zur Kanzlei-Website teilt — in WhatsApp, per Mail, auf LinkedIn — baut die Plattform eine kleine Vorschau-Karte: Bild, Titel, Beschreibung. Diese Karte entscheidet über den ersten Eindruck, oft bevor jemand die Seite überhaupt öffnet. Bei den meisten Kanzlei-Seiten ist sie nicht definiert: ein abgeschnittenes Logo, ein zufälliges Bild oder gar nichts. Dabei ist es eine Frage von Detail-Sorgfalt, nicht von Aufwand. Dieser Artikel erklärt, wie die Vorschau entsteht — und zeigt an unseren eigenen Stadt-Seiten, wie man sie pro Seite individuell macht.

10 Min Lesezeitvon Alexander MockPerformance & Design

Was Sie aus diesem Artikel mitnehmen

Würdigung — der erste Eindruck passiert vor dem Klick

Eine geteilte Vorschau-Karte ist Werbung, die man nicht bezahlt — sie erscheint jedes Mal, wenn jemand den Link weitergibt. Empfiehlt eine zufriedene Mandantin die Kanzlei einer Kollegin per WhatsApp, ist die Vorschau das Erste, was die Kollegin sieht. Ist da ein scharfes, beschriftetes Bild mit Kanzlei-Name, wirkt das professionell. Ist da ein abgeschnittenes Logo auf grauem Grund oder nur die nackte URL, wirkt es nachlässig — und das überträgt sich auf die Erwartung an die Kanzlei.

Das Tückische: Auf den meisten Seiten ist die Vorschau nie bewusst gestaltet worden. Die Plattform nimmt sich dann irgendein Bild von der Seite oder zeigt gar keines. Das ist kein großer Mangel — aber ein vermeidbarer, und das Beheben ist eine Sache von Sorgfalt.

Hinweis:

Wie die Vorschau Ihrer Startseite aktuell aussieht, prüft unser kostenfreier URL-Audit mit — er liest die Open-Graph-Felder aus und meldet, wenn sie fehlen.

Das Open-Graph-Protokoll — wie die Vorschau entsteht

Hinter der Vorschau steht das Open-Graph-Protokoll (ursprünglich von Facebook, heute der gemeinsame Standard fast aller Plattformen). Eine Seite gibt im Kopf-Bereich des HTML einige Meta-Angaben mit:

  • og:title — der Titel auf der Karte
  • og:description — die kurze Beschreibung darunter
  • og:image — das Vorschau-Bild
  • og:url und og:type — Adresse und Art des Inhalts

Wenn ein Dienst den Link verarbeitet, liest sein Crawler diese Felder aus und baut daraus die Karte. Das empfohlene Bild-Maß ist 1200 × 630 Pixel — das Seitenverhältnis, das die meisten Plattformen ohne Beschneiden anzeigen. Fehlt og:image oder hat das Bild ein ungünstiges Format, sieht die Karte beschnitten oder leer aus.

Warum ein fehlendes OG-Bild Reichweite kostet

Eine Vorschau ohne Bild oder mit einem schlechten Bild bekommt weniger Aufmerksamkeit und weniger Klicks — das ist auf allen sozialen Kanälen messbar. Für eine Kanzlei zählt das an drei Stellen: bei Empfehlungen per Messenger, bei eigenen Beiträgen auf LinkedIn (etwa zu einem neuen Insight-Artikel) und bei geteilten Links in E-Mails. Überall dort ist die Karte der erste Kontakt.

Hinzu kommt die Konsistenz zum übrigen Auftritt. Eine Seite, die saubere strukturierte Daten für Google pflegt, aber beim Teilen eine kaputte Vorschau zeigt, wirkt halb fertig. Beides gehört zusammen: Die Seite soll überall, wo sie auftaucht, denselben durchdachten Eindruck machen.

Fallstudie — unsere Per-Stadt-OG-Bilder

Auf fahoch2.de haben wir für die Stadt-Landingpages — Forchheim, Bamberg, Erlangen — jeweils ein eigenes OG-Bild. Es ist kein statisch hinterlegtes Bild, sondern wird zur Laufzeit erzeugt: Eine kleine Funktion (Next.js ImageResponse aus next/og, auf der Edge-Laufzeit) rendert das Bild in 1200 × 630 aus dem jeweiligen Stadt-Datensatz — die FA²-Wortmarke, der Stadtname und ein dezenter Farbverlauf. Der Alternativtext wird passend gesetzt: „FA² – Websites für Steuerberater in Bamberg" beziehungsweise der jeweiligen Stadt.

Der Vorteil dieser Bauweise: Wir pflegen kein Dutzend Bild-Dateien von Hand. Kommt eine Stadt dazu, entsteht ihr OG-Bild automatisch aus den Daten — gleiche Gestaltung, korrekter Name, kein manueller Export in Photoshop. Das ist dieselbe Logik wie beim statischen Rendering: aus Daten generieren statt von Hand vervielfältigen. Für eine Kanzlei mit mehreren Standort-Seiten ist das der saubere Weg, jede Seite beim Teilen individuell und trotzdem konsistent aussehen zu lassen.

Das Crawler-Caching — warum die Vorschau manchmal alt aussieht

Ein praktischer Stolperstein zum Schluss: Plattformen cachen die Vorschau. Wer ein OG-Bild ändert und den Link danach teilt, sieht oft noch die alte Karte — weil Facebook, LinkedIn und Co. das Bild zwischengespeichert haben. Das ist kein Fehler, sondern Absicht (es spart den Plattformen Last). Die meisten Dienste bieten ein „Debug"- oder „Inspect"-Werkzeug, mit dem man den Cache für eine URL gezielt erneuern kann. Wer eine OG-Karte überarbeitet, sollte das nutzen, statt sich zu wundern, warum die alte Vorschau hartnäckig bleibt.

Beispiel:

Bei fahoch2.de selbst generieren wir pro Stadt-Landingpage und pro Insight ein eigenes OG-Bild zur Lauf-Zeit (Datei-Konvention opengraph-image.tsx). In URL-Audits anderer Kanzlei-Sites sehen wir dagegen häufig den umgekehrten Fall: ein geteilter Link erscheint mit zufällig beschnittenem Server-Foto statt einer gestalteten Karte. Ein definiertes OG-Bild im richtigen Maß macht aus dem Zufallstreffer eine saubere Visitenkarte. Wer seine geteilten Links einmal durchsehen lassen will: ein Erstgespräch (30 Minuten, kostenfrei) ordnet es ein.

Für eine vollständige Prüfung der Außenwirkung — OG-Karten, strukturierte Daten, Meta-Angaben — empfehlen wir den Hebel-Audit (890 €, bei Mandanten-Boost-Beauftragung innerhalb von 60 Tagen voll anrechenbar).

Zusammenfassung

Die Vorschau-Karte, die beim Teilen eines Links erscheint, ist der erste Eindruck — oft vor dem ersten Klick. Sie entsteht aus den Open-Graph-Feldern im HTML: Titel, Beschreibung und ein Bild im Maß 1200 × 630. Fehlt das Bild oder ist es schlecht, kostet das Reichweite und wirkt nachlässig. Wer mehrere Standort-Seiten hat, kann die OG-Bilder aus den Daten generieren statt von Hand pflegen — so machen wir es auf unseren Stadt-Seiten. Und wer eine Karte ändert, sollte den Crawler-Cache der Plattformen gezielt erneuern. Der erste Schritt ist, einmal die eigenen Links durch ein Vorschau-Werkzeug zu schicken und zu sehen, was andere sehen.

Quellen

Disclaimer: Allgemeine fachliche Information zum Zeitpunkt der Veröffentlichung. Die genauen Anzeige-Maße und das Caching-Verhalten legen die jeweiligen Plattformen fest und ändern sie gelegentlich.

Stand und rechtlicher Hinweis

Erstveröffentlichung
Autor
Alexander Mock
Lesezeit
10 Minuten

Allgemeine Information, keine individuelle Beratung. Dieser Artikel beschreibt steuer-, berufs- oder webrechtliche Grundsystematik zum oben genannten Stand. Er ist nicht mandantenspezifisch und ersetzt keine individuelle Rechts-, Steuer- oder Anlage-Beratung im Sinne § 2 Rechtsdienstleistungsgesetz (RDG), § 1 Steuerberatungsgesetz (StBerG) oder § 34d/f Gewerbeordnung (GewO). Vor jeder konkreten Entscheidung wenden Sie sich an einen zugelassenen Steuerberater, Rechtsanwalt oder die jeweils zuständige Behörde.

Zitate aus amtlichen Werken. Gesetzes-Texte, Verwaltungsanweisungen (BMF-Schreiben) und Gerichts-Entscheidungen (BFH, BGH, BVerfG, EuGH) sind nach § 5 Urheberrechtsgesetz gemeinfrei. Zitiert wird jeweils mit Aktenzeichen und Entscheidungs- bzw. Schreibens-Datum. Aktualität der Rechtslage bitte vor Bezugnahme gegen die jeweilige amtliche Veröffentlichung prüfen (gesetze-im-internet.de, bundesfinanzhof.de, bmf.bund.de).

Externe Quellen. Wo wir auf Studien, Branchenstatistiken oder Drittanbieter-Dokumente verweisen, ist das Abrufs-Datum jeweils beim Quellenverweis angegeben. Online-Inhalte können sich nach unserem Abruf geändert haben.

Haftung. Trotz sorgfältiger Recherche können Ungenauigkeiten oder Rechtsänderungen nach Veröffentlichung nicht ausgeschlossen werden. Eine Haftung für Schäden, die durch die Nutzung der Information ohne anwaltliche oder steuerberaterliche Gegenprüfung entstehen, ist ausgeschlossen — soweit gesetzlich zulässig.

Themen

OpenGraphSocial-Previewnext/ogDesignSEOSteuerberater

Auch zu lesen

Wenn Sie das in Ruhe besprechen möchten

Lassen Sie uns 30 Minuten zur Außen-Sicht Ihrer Kanzlei sprechen.

Erst gratis-Vorprüfung über das URL-Tool — dann entscheiden Sie, ob ein 890-€-Tiefen-Audit für Sie Sinn ergibt.

Kanzlei prüfen — gratisTermin direkt anfragen