Web & Marketing

Meta-Tag-Generator

Erzeugen Sie SEO-Meta-Tags, Open-Graph- und Twitter-Card-Markup — mit Live-Vorschau und Validierungs-Tipps.

Seitentitel

0/60

Site-Name

Beschreibung

0/160

Kanonische URL

Bild-URL (og:image)

og:type

website article video.movie

twitter:card

summary summary_large_image app player

Twitter-Handle

Generierte Meta-Tags

Was Meta-Tags tun

Meta-Tags sitzen im <head> deines HTML und teilen Suchmaschinen und Social-Plattformen mit, wie sie deine Seite betiteln, beschreiben und illustrieren sollen, wenn sie außerhalb deiner Site erscheint. Der einfache title und die meta description steuern den Snippet bei Google. Open Graph-Tags (die og:*-Familie) steuern die Rich-Preview-Karten auf Facebook, LinkedIn, WhatsApp, Slack, Discord und den meisten anderen Plattformen — sie lesen standardmäßig OG. Twitter Card-Tags machen dasselbe für X/Twitter. Ohne sie wählt die Plattform, was sie scrapen kann, was selten das ist, was du willst.

So nutzen Sie diesen Generator

Fülle die Felder aus — Titel, Beschreibung, kanonische URL der Seite, eine absolute URL für das Bild. Wähle ein og:type (verwende article für Blogposts, website für alles andere) und einen Twitter-Card-Typ (summary_large_image ist der beste Standard für Inhalte mit Featured Image). Die Ausgabebox aktualisiert sich beim Tippen und zeigt die exakten Tags, die du zwischen deine <head>-Tags einfügen kannst. Verwende den Kopieren-Button, wenn du bereit bist, und füge sie dann in dein Template oder CMS ein.

Nach der Veröffentlichung validieren

Verlasse dich nicht allein auf diese Vorschau — jede Plattform cacht ihre eigene Version der Daten. Lasse die URL nach dem Deploy durch den Facebook Sharing Debugger (developers.facebook.com/tools/debug), den Twitter / X Card Validator und den LinkedIn Post Inspector laufen. Diese Tools rufen die Seite live ab, zeigen dir, was sie geparst haben, und erlauben dir, einen Cache-Refresh zu erzwingen. Validiere immer, wenn du das OG-Bild änderst — Caches können das alte Bild tagelang halten.

Häufig gestellte Fragen

Wie lang sollten Titel und Beschreibung sein?

Strebe unter 60 Zeichen für den Titel und 150–160 für die Beschreibung an. Google schneidet alles Längere mit einem Auslassungszeichen ab. Social-Plattformen sind noch aggressiver — Twitter zeigt etwa 70 Zeichen des Titels in einer Karte. Die Zeichenzähler oben werden rot, wenn du darüber liegst.

Welche Größe sollte das og:image haben?

1200×630 ist der Sweet Spot — es passt zu Facebook, LinkedIn, Slack und Twitters summary_large_image-Karte ohne unangenehmes Beschneiden. Halte es unter ~5 MB und bevorzuge JPG oder PNG. Platziere die wichtigsten Inhalte (Logo, Headline) sicher in den zentralen zwei Dritteln, da einige Plattformen die Ränder beschneiden.

Brauche ich für SEO immer noch eine Meta-Beschreibung?

Ja — Google schreibt sie oft aus dem Seitentext um, wenn deine nicht zur Anfrage passt, aber eine klare, gut formulierte Beschreibung gewinnt häufiger Klicks und erscheint wörtlich beim Teilen in sozialen Netzwerken. Behandle sie wie Werbetext: Setze den Mehrwert nach vorn, vermeide Keyword-Stuffing.

Kann ich Twitter-Tags weglassen, wenn ich Open Graph habe?

X/Twitter greift bei den meisten Feldern auf Open Graph zurück, daher reicht meist ein einzelnes twitter:card-Tag plus dein OG-Markup. Explizite twitter:title, twitter:description und twitter:image hinzuzufügen ist nur dann wichtig, wenn du eine andere Version der Inhalte für Twitter willst als anderswo.

Was ist der Unterschied zwischen den og:type-Werten?

Verwende article für Blogposts und News; damit kann Open Graph Autor, Sektion und Veröffentlichungszeit als Metadaten transportieren. Verwende website für Landingpages, Produktseiten, Marketingseiten — im Grunde der Standard. video.movie, video.episode, book, profile und Ähnliche existieren für reichhaltigere Integrationen auf unterstützenden Plattformen, aber das soziale Web kümmert sich meist nur um den Unterschied zwischen article und website.

Warum sieht meine Vorschau auf WhatsApp/Slack falsch aus?

Fast immer Cache. Beim ersten Teilen einer URL holt und cacht die Plattform die OG-Daten; nachfolgende Shares zeigen die gecachte Version, selbst nachdem du die Seite korrigiert hast. Teile die URL erneut über den Facebook-Debugger, der einen Refresh erzwingt, der sich an Messenger, WhatsApp und Instagram weitergibt. Für Slack hänge an den Link ?v=2, um deren Cache zu umgehen.

Meta-Tag-Generator