Meta Tags Generator

Head-Tags für SEO, hreflang, Open Graph, X Cards, Icons und JSON-LD plus Security-Header für nginx/Apache — mit Vorschau und Prüfhinweisen.

Alle Meta-Tags einer Seite an einem Ort

Der Meta Tags Generator baut dir den kompletten <head>-Block einer Seite zusammen: Titel, Description, Canonical und hreflang, Open-Graph- und X-Card-Daten, Favicons und Mobile-/PWA-Tags, Resource Hints, Verification-Codes und ein fertiges JSON-LD-Skript. Sicherheits-Header, die nur auf dem Server wirken, bekommst du zusätzlich als fertiges Snippet für nginx oder Apache. Du füllst ein Formular aus, siehst das Ergebnis sofort als sauber kommentiertes HTML — und kopierst oder lädst es herunter.

Das Tool nimmt dir genau die Fleißarbeit ab, bei der sich erfahrungsgemäß die meisten Fehler einschleichen: vergessene og:image-Maße, ein Titel jenseits der Snippet-Grenze, eine relative Canonical-URL, ein X-Frame-Options im <meta>, das kein Browser beachtet, ein von Hand getipptes JSON-LD mit fehlendem Komma. Statt jeden <meta>-Tag einzeln nachzuschlagen, klickst du die Bausteine zusammen, die du brauchst, und bekommst korrektes, einheitlich formatiertes Markup zurück — plus Prüfhinweise, wo etwas fehlt oder nicht wirken würde.

Gedacht ist es für alle, die Seiten ausliefern: Entwicklerinnen und Entwickler, die schnell einen vollständigen Head für ein neues Template brauchen; SEO- und Content-Leute, die Titel, Description und Social-Vorschau im Korridor halten wollen; und alle, die Structured Data ausprobieren, ohne die Schema.org-Syntax auswendig zu können. Kein Account, keine Installation, kostenlos.

Was der Generator erzeugt

Das Formular ist in neun thematische Bausteine (Accordion-Sektionen) gegliedert. Jede Sektion hat einen eigenen Schalter Include in output — du nimmst nur das in den Head, was du wirklich willst. Per Voreinstellung ist allein Essential aktiv; die übrigen acht schalten sich ein, sobald du in ihnen tippst, oder du schaltest sie von Hand dazu:

  • Essential — charset (immer UTF-8), <title>, Meta-Description, Canonical, Robots-Direktiven (noindex, nofollow, noarchive, nosnippet, noimageindex, max-snippet, max-image-preview), Viewport und die Sprachversionen per hreflang. Die Pflicht-Tags jeder Seite.
  • Open Graph — og:-Tags für Facebook, LinkedIn und WhatsApp: Typ, URL, Titel, Beschreibung, Bild (inklusive Maße und Alt-Text), Site-Name und Locale; bei og:type = article zusätzlich Veröffentlichungs-/Änderungsdatum, Autor, Rubrik und Tags.
  • X (Twitter) Card — Card-Typ, @site- und @creator-Handle (das Tool macht aus name oder einer Profil-URL automatisch @name), Titel, Beschreibung, Bild und Alt-Text. Leere X-Felder, die Open Graph ohnehin liefert, lässt das Tool standardmäßig weg — X liest sie von dort.
  • Icons, Mobile & App — favicon.ico, SVG-Icon, apple-touch-icon, Web-App-Manifest, theme-color (auf Wunsch getrennt für Hell und Dunkel), color-scheme, Standalone-Web-App-Tags, iOS-Statusleiste und format-detection.
  • Authorship — Autor, Copyright, Generator und das SafeSearch-Rating (adult bzw. RTA-Label).
  • Security — Content-Security-Policy (mit den Presets Strict/Moderate/Loose, wahlweise als <meta>, HTTP-Header oder beides) und Referrer-Policy; dazu die reinen HTTP-Header X-Frame-Options, X-Content-Type-Options: nosniff und eine Permissions-Policy, in der du per Checkbox Kamera, Mikrofon, Geolocation, Payment, USB und die Topics-API sperrst und Fullscreen auf die eigene Seite beschränkst.
  • Resource Hints — beliebig viele preconnect-, dns-prefetch-, preload- (mit fetchpriority), modulepreload- und prefetch-Zeilen.
  • Verification — Bestätigungs-Codes für Google Search Console, Bing, Pinterest, Yandex und die Facebook-(Meta-)Domain-Verifizierung; du kannst auch den kompletten Tag einfügen, den Code zieht das Tool heraus.
  • Structured Data (JSON-LD) — ein generiertes application/ld+json-Skript für 13 Schema-Typen, von WebPage, WebSite, Article und Organization über Product, Event und Recipe bis FAQPage, BreadcrumbList und LocalBusiness — mit Hinweisen auf die Angaben, die Google für Rich Results verlangt.

Live-Vorschau und Komfort

Ein eigener Preview-Tab zeigt dir vier Vorschauen aus deinen Eingaben: ein Google-Suchergebnis, das wie Google nach Pixelbreite kürzt und die Breite mitmisst, eine Open-Graph-Card, eine X-Card und das formatierte JSON-LD. So siehst du, wie Suchergebnis und Social-Vorschau ungefähr aussehen werden, bevor du die Seite ausspielst.

Leere Felder erben ihren Wert: og:title vom Seitentitel, og:url von der Canonical, die JSON-LD-Felder von Titel, Description, Canonical und og:image. Der geerbte Wert steht kursiv als Platzhalter im Feld, sodass du nichts doppelt tippen musst und trotzdem jederzeit überschreiben kannst. Zeichenzähler mit Farbbalken an Titel, Description und den Social-Feldern halten dich in den empfohlenen Längen, und unter der Ausgabe sammelt das Tool Prüfhinweise — von der relativen og:image-URL über ein ungequotetes CSP-Schlüsselwort bis zum Event ohne Adresse. Zwei zusätzliche Tabs — Tips und Reference — liefern Prioritäten, Längen, Test-Werkzeuge und eine Tag-Referenz direkt im Tool.

HTML und Server-Header

Manche Sicherheitsangaben wirken nur als echter HTTP-Header — X-Frame-Options, Permissions-Policy und X-Content-Type-Options ignorieren Browser im <meta>. Der Generator schreibt sie deshalb gar nicht erst ins HTML, sondern liefert sie über den Umschalter HTML | nginx | Apache als fertige Server-Konfiguration: add_header … always; für nginx bzw. Header always set … für Apache, jeweils korrekt maskiert. Die Content-Security-Policy kannst du wahlweise als <meta>, als Header oder in beiden Varianten ausgeben.

Alles im Browser — nichts verlässt dein Gerät

Der Generator ist rein clientseitig: Es gibt keinen Server-Roundtrip, keine API und keinen Upload. Markup und Header-Snippets entstehen vollständig in deinem Browser, und dein Formularstand wird ausschließlich lokal im localStorage gespeichert — schließt du den Tab und kommst zurück, ist alles noch da. Nichts von dem, was du eintippst, wird an einen Server geschickt; nur die Vorschau lädt die Bilder, deren URLs du angibst, direkt von deren Server. Wie der Stand zurückgesetzt wird und welche Felder welche Tags erzeugen, steht im Manual.

Jetzt ausprobieren

→ Meta Tags Generator öffnen — Felder füllen, fertiges HTML kopieren oder als meta-tags.html herunterladen, die Header als nginx- oder Apache-Konfiguration gleich dazu. Ohne Account, kostenlos, direkt im Browser.

Verwandte JPKCom-Tools

Erzeugen, dann gegenprüfen — diese Tools passen direkt dazu:

  • SEO & GEO Analyzer — die hier erzeugten Meta-, Open-Graph- und JSON-LD-Daten anschließend an einer echten URL prüfen und im Score grün abnehmen lassen.
  • robots.txt & Sitemap — Crawling-Regeln und Sitemap passend zu den Robots-Direktiven, die du hier setzt.
  • llms.txt-Generator — die KI-freundliche Ergänzung zu sauberem Structured Data.

Tiefer geht es auf den Unterseiten: das Manual mit jeder Sektion und jedem Feld im Detail, Beispiele aus der Praxis und gesammelte Tipps & Tricks.