Zum Hauptinhalt springen
Bethemesh
Web & SEO

Meta-Tags erstellen

Erstellt wichtige HTML-Meta-Tags für SEO und Social Sharing aus wenigen Angaben.

  • Zwischenablage

Dieses Widget einbetten

Passe die Darstellung an, prüfe die Vorschau und kopiere anschließend den Code.

Vorschau

Art des Einbettungscodes

Zu kopierender Code

Responsive und automatisch von Bethemesh in der Größe angepasst.

Seitentitel

Titellänge

0

Beschreibungslänge

0

Erzeugter Code

War dieses Werkzeug hilfreich?

Wie funktioniert dieses Tool?

Dieser Generator erstellt den Tag-Block für den <head> einer Seite in einem Schritt: Title, Meta-Description, Robots, Canonical sowie die Open-Graph-Tags, die Facebook, LinkedIn oder WhatsApp lesen, und die Twitter/X-Card-Tags. Er maskiert Sonderzeichen und zeigt die Länge von Titel und Beschreibung, damit du sauberen Code in ein Template einfügen kannst.

Titel und Beschreibung sind Pflicht: Sie füllen das <title>-Tag, die Meta-Description, og:title, og:description, twitter:title und twitter:description.

Die Zeichen &, ", < und > werden in HTML-Entitäten umgewandelt: Ein Titel mit Anführungszeichen beschädigt das content-Attribut nicht.

Leere optionale Felder erzeugen kein Tag. Die kanonische URL dient auch als og:url, die URL des Social-Media-Bildes füllt og:image und twitter:image, og:type ist immer website.

Der Code ist in drei Blöcke gegliedert, getrennt durch eine Leerzeile: Basis-Tags, Open Graph und Twitter/X.

So verwenden Sie dieses Tool

  1. Titel und Beschreibung eingeben

    Die Zähler Titellänge und Beschreibungslänge aktualisieren sich.

  2. Kanonische URL und Social-Media-Bild ergänzen

    Verwende absolute URLs; das ideale Bild misst 1.200 × 630 px.

  3. Optionen festlegen

    Robots-Anweisungen, Twitter-/X-Karte, Konto der Website, Open-Graph-Locale und Theme-Farbe.

  4. Erstellen und kopieren

    Klicke auf Tags erstellen und füge den erzeugten Code in den <head> ein.

Anwendungsfälle

Tags für eine neue Seite erstellen

Einen vollständigen Head erhalten, ohne og:image oder das Canonical zu vergessen.

Teilen in sozialen Netzwerken verbessern

Titel, Zusammenfassung und Bild steuern, die beim Teilen eines Links auf LinkedIn, Facebook oder X erscheinen.

Statische Website ergänzen

Metadaten zu einer handgeschriebenen HTML-Seite oder einem Template ohne SEO-Plugin hinzufügen.

Beispiele

Produktseite bereit zum Teilen

Ein Titel und eine Beschreibung füllen alle drei Tag-Familien; die kanonische URL wird als og:url übernommen, das Bild als og:image und twitter:image.

Eingabe

Seitentitel: Isolierte Edelstahlflasche 750 ml | Trek
Beschreibung: Doppelwandige Flasche: 24 Stunden kalt, 12 Stunden heiß. BPA-frei, Versand ab 30 € kostenlos.
Kanonische URL: https://example.com/flaschen/edelstahl-750
Robots-Anweisungen: index, follow
Websitename: Trek
URL des Social-Media-Bildes: https://example.com/img/edelstahlflasche.jpg
Twitter-/X-Karte: summary_large_image
Twitter-/X-Konto der Website: @trek
Open-Graph-Locale: de_DE

Ergebnis

Titellänge: 40 · Beschreibungslänge: 93
<title>Isolierte Edelstahlflasche 750 ml | Trek</title>
<meta name="description" content="Doppelwandige Flasche: 24 Stunden kalt, 12 Stunden heiß. BPA-frei, Versand ab 30 € kostenlos.">
<meta name="robots" content="index, follow">
<meta name="theme-color" content="#4f46e5">
<link rel="canonical" href="https://example.com/flaschen/edelstahl-750">

<meta property="og:title" content="Isolierte Edelstahlflasche 750 ml | Trek">
<meta property="og:description" content="Doppelwandige Flasche: 24 Stunden kalt, 12 Stunden heiß. BPA-frei, Versand ab 30 € kostenlos.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/flaschen/edelstahl-750">
<meta property="og:site_name" content="Trek">
<meta property="og:locale" content="de_DE">
<meta property="og:image" content="https://example.com/img/edelstahlflasche.jpg">

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Isolierte Edelstahlflasche 750 ml | Trek">
<meta name="twitter:description" content="Doppelwandige Flasche: 24 Stunden kalt, 12 Stunden heiß. BPA-frei, Versand ab 30 € kostenlos.">
<meta name="twitter:site" content="@trek">
<meta name="twitter:image" content="https://example.com/img/edelstahlflasche.jpg">

Tipps und bewährte Vorgehensweisen

  • Für og:image brauchst du ein Bild von mindestens 1.200 × 630 px und eine absolute https-URL; relative URLs werden von sozialen Netzwerken nicht gelesen.
  • Die Karte summary_large_image zeigt ein großes Bild unter dem Link, summary ein quadratisches Vorschaubild neben dem Text.
  • Die Open-Graph-Locale wird mit Unterstrich geschrieben (de_DE), anders als das HTML-Attribut lang (de-DE).
  • Manche mobilen Browser färben mit der Theme-Farbe die Adressleiste ein.

Quellen und Referenzen

Häufig gestellte Fragen

Zählen Open-Graph-Tags für SEO?

Nicht direkt für das Ranking. Sie bestimmen die Vorschau eines geteilten Links in sozialen Netzwerken und Messengern, was die Klicks und damit die Sichtbarkeit der Seite beeinflusst.

Brauche ich twitter:-Tags, wenn og:-Tags vorhanden sind?

X greift ersatzweise auf Open-Graph-Tags zurück, aber twitter:card ist nötig, um das Kartenformat festzulegen. Das Tool erzeugt deshalb beide Familien.

Warum ist og:type immer website?

Das ist der passende Wert für die meisten Seiten. Für einen Blogartikel kannst du website im erzeugten Code durch article ersetzen.

Wohin füge ich den erzeugten Code ein?

In den <head>-Bereich der Seite, vor dem schließenden </head>. In einem CMS nutzt du das Feld für Header-Code oder die SEO-Einstellungen des Templates.

Werden meine Daten an einen Server gesendet?

Nein. Die Tags werden in deinem Browser erzeugt.

Verwandte Werkzeuge

Mit diesen Werkzeugen weitermachen

Werkzeuge, die diesem ähnlich sind oder es ergänzen.

Ähnliche Werkzeuge

SERP-Snippet-Simulator

Vorschau eines Suchergebnisses aus Title und Meta-Description.

Web & SEOEmpfohlenDieses Werkzeug verwenden

HTML-SEO-Analyse

Analysiere wichtige SEO-Signale lokal im HTML.

Web & SEOEmpfohlenDieses Werkzeug verwenden

Auch interessant