Was erzeugt der Meta-Tag-Generator?

Er erzeugt einen kopierfertigen Block von HTML-Head-Tags — einen , standardmäßige SEO- -Tags, einen canonical , plus Open Graph- und Twitter Card- -Tags — gebaut aus den Werten, die du in das Formular tippst.

Wie unterscheiden sich Open Graph- und Twitter Card-Tags von normalen Meta-Tags?

Standard-Tags wie description und robots zielen auf Suchmaschinen. Open Graph- (og:) Tags steuern, wie ein Link aussieht, wenn er auf Facebook, LinkedIn und ähnlichem geteilt wird, während Twitter Card-Tags die Vorschau auf X/Twitter steuern. Dieses Tool gibt alle drei aus einem Formular aus.

Muss ich jedes Feld ausfüllen, um gültige Meta-Tags zu bekommen?

Nein. Lass ein Feld leer, und sein Tag wird einfach aus der Ausgabe weggelassen. Open Graph-Titel, -Beschreibung und -URL fallen auch auf deinen Standard-Titel, deine Standard-Beschreibung und die kanonische URL zurück, wenn sie leer gelassen werden.

Maskiert der Generator Sonderzeichen in meinem Titel und meiner Beschreibung?

Ja. Anführungszeichen, Kaufmanns-Und und spitze Klammern werden in jedem Attributwert HTML-maskiert (zum Beispiel wird " zu " und & zu &), sodass die Tags auch mit Satzzeichen in deinem Text gültig bleiben.

Wohin setze ich die erzeugten Meta-Tags?

Füge den ganzen Block in das -Element deiner HTML-Seite ein, vor dem schließenden . Du kannst ihn kopieren oder als HTML-Snippet herunterladen, um ihn in deine Vorlage einzusetzen.

Werden meine Seiteninformationen an einen Server gesendet?

Nein. Der Meta-Tag-Generator läuft vollständig in deinem Browser. Der Titel, die Beschreibung, die URLs und die anderen Felder, die du eingibst, verlassen dein Gerät nie und werden nicht zu ArrayKit hochgeladen.

Meta-Tag-Generator

Erzeuge SEO-, Open Graph- und Twitter Card-Meta-Tags aus einem einfachen Formular in deinem Browser. Deine Seitendetails bleiben auf deinem Gerät.

Der Meta-Tag-Generator läuft vollständig in deinem Browser. Der Titel, die Beschreibung, die URLs und die anderen Seitendetails, die du eingibst, verlassen dein Gerät nie und nichts wird zu ArrayKit hochgeladen.

Open Graph Generator öffnen

Über Meta-Tag-Generator

Der Meta-Tag-Generator verwandelt ein kurzes Formular in einen kopierfertigen Block von HTML-Head-Tags für Suchmaschinen und Social Sharing. Fülle einen Titel, eine Beschreibung, eine kanonische URL, Autor, Keywords, eine robots-Direktive und theme-color aus, füge dann Open Graph- und Twitter Card-Felder für reiche Link-Vorschauen hinzu. Er gibt einen sauberen Satz von <meta>- und <link>-Tags aus, HTML-maskiert jedes Attribut, sodass Anführungszeichen und Kaufmanns-Und gültig bleiben, und lässt Felder aus, die du leer lässt. Open Graph-Titel, -Beschreibung und -URL fallen auf ihre Standard-Gegenstücke zurück, sodass ein ausgefüllter Titel deine Social-Card weiterhin speist. Eine Live-Vorschau zeigt ungefähr, wie die Card aussieht, bevor du die Tags in den <head> einfügst. Gebaut für Entwickelnde, SEO-Leute und Content-Teams. Alles läuft auf deinem Gerät — nichts über deine Seite wird hochgeladen.

Funktionen

Baut SEO-Tags: Titel, Beschreibung, Keywords, Autor, robots und canonical link
Erzeugt Open Graph-Tags für Titel, Beschreibung, Bild, URL und Typ
Erzeugt Twitter Card-Tags inklusive Card-Typ, Site und Creator
HTML-maskiert Anführungszeichen und Kaufmanns-Und, sodass jeder Attributwert gültig bleibt
Lässt leere Felder aus, sodass die Ausgabe nur Tags enthält, die du tatsächlich gesetzt hast
Open Graph-Titel, -Beschreibung und -URL fallen auf die Standardfelder zurück
Live-Vorschau der Social-Card nähert an, wie der Link rendern wird
Kopiere den ganzen Block oder lade ihn als HTML-Snippet herunter

So verwendest du Meta-Tag-Generator

Gib deinen Titel, deine Beschreibung und die kanonische URL ein
Füge Autor, Keywords, robots und theme-color hinzu, wenn du sie möchtest
Fülle die Open Graph- und Twitter Card-Felder für Social-Vorschauen aus
Kopiere den erzeugten Block und füge ihn in den <head> deiner Seite ein

Beispiel

Eingabe

title: My Page
description: A short summary
og:image: https://example.com/og.png

Ausgabe

<title>My Page</title>
<meta name="description" content="A short summary" />
<meta property="og:image" content="https://example.com/og.png" />

Formularfelder werden zu <title>-, <meta>- und <link>-Tags für den Head.

Häufige Fehler & Fehlerbehebung

Das Social-Vorschaubild zeigt sich nicht, wenn der Link geteilt wird. — Nutze eine absolute og:image-URL (beginnend mit https://) und ein ausreichend großes Bild; viele Plattformen cachen Vorschauen, also scrape mit dem Debugger der Plattform nach Änderungen erneut.
Die Beschreibung oder der Titel sieht kaputt aus, weil sie ein Anführungszeichen oder Kaufmanns-Und enthalten. — Hier gibt es nichts zu beheben — der Generator HTML-maskiert Anführungszeichen zu " und Kaufmanns-Und zu & automatisch, also füge die Ausgabe unverändert ein.
Suchmaschinen indexieren eine Seite, die du verbergen wolltest. — Setze robots auf noindex, follow (oder noindex, nofollow). Denk daran, dass robots-Meta-Tags eine Bitte sind, keine Zugriffskontrolle, und nur für Seiten gelten, die Crawler erreichen können.
Duplicate-Content-Warnungen über ähnliche URLs hinweg. — Setze die kanonische URL auf die einzige bevorzugte Adresse der Seite, sodass Suchmaschinen die Ranking-Signale auf einer URL konsolidieren.

Häufig gestellte Fragen

Was erzeugt der Meta-Tag-Generator?: Er erzeugt einen kopierfertigen Block von HTML-Head-Tags — einen <title>, standardmäßige SEO-<meta>-Tags, einen canonical <link>, plus Open Graph- und Twitter Card-<meta>-Tags — gebaut aus den Werten, die du in das Formular tippst.
Wie unterscheiden sich Open Graph- und Twitter Card-Tags von normalen Meta-Tags?: Standard-Tags wie description und robots zielen auf Suchmaschinen. Open Graph- (og:) Tags steuern, wie ein Link aussieht, wenn er auf Facebook, LinkedIn und ähnlichem geteilt wird, während Twitter Card-Tags die Vorschau auf X/Twitter steuern. Dieses Tool gibt alle drei aus einem Formular aus.
Muss ich jedes Feld ausfüllen, um gültige Meta-Tags zu bekommen?: Nein. Lass ein Feld leer, und sein Tag wird einfach aus der Ausgabe weggelassen. Open Graph-Titel, -Beschreibung und -URL fallen auch auf deinen Standard-Titel, deine Standard-Beschreibung und die kanonische URL zurück, wenn sie leer gelassen werden.
Maskiert der Generator Sonderzeichen in meinem Titel und meiner Beschreibung?: Ja. Anführungszeichen, Kaufmanns-Und und spitze Klammern werden in jedem Attributwert HTML-maskiert (zum Beispiel wird " zu " und & zu &), sodass die Tags auch mit Satzzeichen in deinem Text gültig bleiben.
Wohin setze ich die erzeugten Meta-Tags?: Füge den ganzen Block in das <head>-Element deiner HTML-Seite ein, vor dem schließenden </head>. Du kannst ihn kopieren oder als HTML-Snippet herunterladen, um ihn in deine Vorlage einzusetzen.
Werden meine Seiteninformationen an einen Server gesendet?: Nein. Der Meta-Tag-Generator läuft vollständig in deinem Browser. Der Titel, die Beschreibung, die URLs und die anderen Felder, die du eingibst, verlassen dein Gerät nie und werden nicht zu ArrayKit hochgeladen.