Meta-Tag-Generator

HTML-Meta-Tags, Open-Graph- und Twitter-Card-Tags generieren

Was ist das und wie funktioniert es?

Ein Meta-Tag-Generator baut die HTML-Tags, die Suchmaschinen und sozialen Plattformen sagen, wie sie Ihre Seite beschreiben sollen — den Titel und die Beschreibung, die in Google-Ergebnissen erscheinen, plus die Open-Graph- und Twitter-Card-Tags, die die Vorschaukarte steuern, wenn ein Link geteilt wird. Diese Tags leben im <head> der Seite und sind für Besucher unsichtbar, doch sie entscheiden, ob Ihr Link eine reiche Vorschau mit Bild und Überschrift zeigt oder eine nackte, wenig ansprechende URL. Sie füllen die Details aus, und das Tool gibt die vollständigen Tags zum Einfügen aus.

Das richtig zu machen zählt, weil die Vorschau oft der erste Eindruck Ihrer Seite ist: Ein fehlendes oder falsches Open-Graph-Bild lässt einen geteilten Link auf Facebook, LinkedIn oder Slack kaputt aussehen, und eine schwache Meta-Beschreibung kostet Klicks in der Suche. Das Knifflige ist, dass dieselbe Information über mehrere Tag-Formate wiederholt werden muss — Standard-Meta, Open Graph (og:) und Twitter (twitter:) — jedes mit eigenen Eigenschaftsnamen. Dieses Tool erzeugt sie alle konsistent im Browser, sodass Sie einen korrekten Block kopieren, statt ihn von Hand zusammenzusetzen.

Anwendungsfälle

Häufige Fragen

Was ist der Unterschied zwischen Meta-Tags und Open-Graph-Tags?

Standard-Meta-Tags (Titel, Beschreibung) dienen vor allem Suchmaschinen. Open-Graph-Tags (og:title, og:image usw.) steuern, wie die Seite beim Teilen auf sozialen Plattformen aussieht. Twitter Cards sind ein ähnlicher Satz für X/Twitter. In der Regel wollen Sie alle drei, damit Suche und Teilen gut aussehen.

Warum zeigt mein geteilter Link kein Bild oder das falsche?

Meist fehlt das og:image-Tag, zeigt auf eine ungültige URL oder das Bild ist zu klein. Plattformen lesen og:image, um die Vorschaukarte zu bauen, es muss also ein gültiges, öffentlich erreichbares Bild ausreichender Größe sein — und manche Plattformen cachen es, ein erneutes Teilen kann also einen Cache-Refresh brauchen.

Wie lang sollten Titel und Beschreibung sein?

Suchmaschinen zeigen typischerweise etwa die ersten 50-60 Zeichen eines Titels und rund 150-160 einer Beschreibung, bevor sie kürzen. Halten Sie die wichtigen Wörter vorn, damit die Botschaft überlebt, falls sie in Ergebnissen oder Vorschauen abgeschnitten wird.

Brauche ich sowohl Open-Graph- als auch Twitter-Card-Tags?

Open Graph wird von den meisten Plattformen gelesen, auch als Fallback von X/Twitter, deckt also viel allein ab. Die twitter:-Tags hinzuzufügen gibt Ihnen feinere Kontrolle speziell über die Twitter-Karte, etwa den Kartentyp, beide einzuschließen ist also die sicherste Wahl.

Entwickler

UUID-Generator · Zeitstempel-Konverter · Base64-Encoder · Base64-Decoder · Hash-Generator · Farb-Konverter