# Open Graph Protokoll > Das Open Graph Protokoll steuert ueber og:-Meta-Tags, wie deine Seite als Vorschau (Titel, Bild, Beschreibung) in Social Media und Chats erscheint. **Quelle:** https://www.webtree.ch/lexikon/open-graph-protokoll --- Das **Open Graph Protokoll** (kurz OG) ist ein von Facebook eingefuehrter Standard, mit dem du steuerst, wie eine Webseite als **Vorschau** aussieht, wenn jemand ihren Link in sozialen Netzwerken, Messengern oder Chat-Tools teilt. Statt dass die Plattform sich irgendeinen Text und ein zufaelliges Bild von der Seite holt, definierst du ueber spezielle **Meta-Tags** im `` deiner Seite genau Titel, Beschreibung und Bild der sogenannten **Link-Vorschau** (Social Card). Die Tags folgen dem Schema `og:eigenschaft`. Die vier wichtigsten sind: - `` – der Titel der Vorschau - `` – der Beschreibungstext - `` – das Vorschaubild (idealerweise 1200x630 Pixel) - `` – die kanonische URL der Seite Ergaenzend gibt es `og:type` (z. B. `website` oder `article`) und `og:site_name`. ## Warum es wichtig ist Ein Link ohne Open-Graph-Tags wirkt in einem Feed oder Chat schnell unfertig: kein Bild, ein abgeschnittener Titel, eine kryptische URL. Eine saubere, ansprechende Vorschau dagegen faellt auf, schafft Vertrauen und wird deutlich oefter geklickt. Open Graph ist damit kein direkter Google-Ranking-Faktor, beeinflusst aber **Klicks und Reichweite** in allen Kanaelen ausserhalb der klassischen Suche – und damit indirekt auch Traffic und Anfragen. Wichtig: Plattformen wie LinkedIn, Facebook, WhatsApp oder Slack lesen diese Tags aus. X (Twitter) nutzt teilweise eigene `twitter:`-Tags, faellt aber auf Open Graph zurueck, wenn diese fehlen. Ein gepflegtes OG-Setup deckt also die meisten Kanaele zugleich ab. ## In der Praxis - **Bildmasse einhalten:** 1200x630 Pixel (Seitenverhaeltnis 1.91:1) verhindern Beschnitt und unscharfe Vorschauen. - **Absolute URLs verwenden:** Das Bild bei `og:image` braucht eine vollstaendige Adresse (`https://...`), kein relativer Pfad. - **Eigene Texte pro Seite:** `og:title` und `og:description` sollten zur Seite passen und duerfen sich vom **Meta-Title** und der **Meta-Description** unterscheiden. - **Caching beachten:** Plattformen speichern die Vorschau zwischen. Nach Aenderungen hilft ein Debugger (z. B. der Sharing Debugger von Meta oder der LinkedIn Post Inspector), um den Cache zu erneuern. In Next.js und aehnlichen Frameworks lassen sich OG-Tags zentral pro Seite generieren – sauber strukturiert und ohne Handarbeit pro Link. ## KMU-Bezug Fuer ein Schweizer KMU entscheidet die Link-Vorschau oft darueber, ob ein geteilter Beitrag auf LinkedIn oder in einer WhatsApp-Gruppe ueberhaupt angeklickt wird. Gerade beim Teilen von Offerten, Blogartikeln oder Referenzen wirkt eine professionelle Social Card serioes und markenkonform. Ein einmalig sauber aufgesetztes Open-Graph-Setup zahlt sich so bei jedem geteilten Link aufs Neue aus. --- ## Haeufige Fragen **Was ist der Unterschied zwischen Open Graph und der Meta-Description?** Die Meta-Description steuert das Snippet in den Google-Suchergebnissen. Open-Graph-Tags steuern dagegen die Link-Vorschau in sozialen Netzwerken, Messengern und Chats. Beide koennen unterschiedliche Texte verwenden, weil sie verschiedene Kontexte und Zielgruppen bedienen. **Welche Bildgroesse braucht das og:image?** Empfohlen sind 1200x630 Pixel im Seitenverhaeltnis 1.91:1. So wird das Bild auf den meisten Plattformen ohne Beschnitt und scharf dargestellt. Das Bild muss zudem ueber eine absolute URL (https://...) eingebunden sein, nicht ueber einen relativen Pfad. **Beeinflusst Open Graph mein Google-Ranking?** Nein, Open-Graph-Tags sind kein direkter Ranking-Faktor bei Google. Sie verbessern aber die Link-Vorschau in Social Media und Messengern, was zu mehr Klicks und Reichweite fuehrt und damit indirekt mehr Traffic auf deine Seite bringt.