Meta Tags Generator — Manual

Zurück zur Übersicht: Meta Tags Generator · Tool live öffnen: www.jpkc.com/tools/meta-tags/

Dieses Manual beschreibt den Meta Tags Generator vollständig: wie das Tool aufgebaut ist, welche neun Bausteine es gibt, welches Feld welchen <meta>- oder <link>-Tag (oder HTTP-Header) erzeugt, wie leere Felder Werte erben, welche Prüfhinweise das Tool gibt und wie du das Ergebnis speicherst. Die Oberfläche ist auf Englisch — die Tab-, Sektions- und Button-Bezeichnungen stehen deshalb in ihrer englischen Original-Schreibweise (mit deutscher Erläuterung), damit du dich im echten Interface zurechtfindest.

Aufbau und Bedienung

Das Tool hat oben vier Tabs: Generator, Preview, Tips und Reference. Die ganze Arbeit passiert im Generator-Tab, der zweigeteilt ist:

Links liegt ein Akkordeon mit neun Sektionen — den thematischen Tag-Gruppen.
Rechts liegt das Output-Panel: eine Aktionsleiste mit dem Umschalter HTML | nginx | Apache sowie Copy, Download und Reset, darunter ein schreibgeschützter Editor (ACE), der die Ausgabe zeigt, und darunter die Liste der Prüfhinweise. Auf breiten Bildschirmen bleibt dieses Panel beim Scrollen durch das Formular stehen (sticky).

Jede Sektion trägt oben einen Schalter Include in output („in die Ausgabe aufnehmen") und im Kopf ein Badge on/off. Nur eingeschaltete Sektionen landen in der Ausgabe. Voreingestellt ist allein Essential aktiv; die übrigen acht Sektionen sind anfangs ausgeschaltet und eingeklappt. Ausgeschaltete Sektionen erscheinen gedimmt, bleiben aber bedienbar: Sobald du in einer ausgeschalteten Sektion tippst oder über einen Add-Button eine Zeile anlegst, schaltet sie sich selbst ein. Das sagt auch der Hinweis über dem Akkordeon: „Typing in a section switches it on."

Der Output aktualisiert sich automatisch kurz nach jeder Eingabe (entprellt, rund 0,2 Sekunden). Es gibt keinen „Generieren"-Knopf. Innerhalb einer aktiven Sektion wird jedes Feld nur dann ausgegeben, wenn es einen Wert hat — einen eigenen oder einen geerbten (siehe Vererbung leerer Felder). Das HTML beginnt mit dem Kommentar  und ist in Kommentar-Blöcke gegliedert (,  usw.). Ist keine Sektion aktiv oder erzeugen die aktiven keine einzige Zeile, steht dort . Eine leere Sektion heißt dabei nicht immer leere Ausgabe: Essential schreibt stets <meta charset>, Open Graph stets og:type (Default website), X Card stets twitter:card, und eine eingeschaltete, aber leere Sektion Icons, Mobile & App liefert zumindest ihren Kommentar .

Architektur: alles im Browser

Wichtig für Verständnis und Datenschutz: Der Meta Tags Generator ist rein clientseitig. Es gibt keinen Server-Roundtrip, keinen Proxy, keine API und keinen Upload — Markup, Header-Snippets und Prüfhinweise entstehen vollständig in deinem Browser (Logik-Modul meta-tags-core.js). Dein Formularstand wird bei jeder Änderung automatisch lokal im localStorage deines Browsers gespeichert (Schlüssel jpktools_meta_tags) und beim nächsten Besuch wiederhergestellt; ein Stand aus der älteren Tool-Version wird dabei einmalig übernommen. Der Reset-Button löscht diesen lokalen Speicher wieder.

Eine Ausnahme gibt es: Der Preview-Tab lädt die Bilder, deren URLs du bei og:image bzw. dem X-Bild einträgst, direkt von dem angegebenen Server (nur http/https, ohne Referrer). Deine Formulardaten selbst verlassen dein Gerät nicht.

Vererbung leerer Felder

Viele Felder hängen voneinander ab. Statt Werte zu kopieren, lässt das Tool leere Felder zur Ausgabezeit erben. Der geerbte Wert erscheint im leeren Feld als kursiver Placeholder; sobald du selbst etwas einträgst, gilt dein Wert.

Leeres Feld	erbt von
Open Graph URL (`og:url`)	Canonical URL
Open Graph Title (`og:title`)	Page Title
Open Graph Description (`og:description`)	Meta Description
X Title, Description, Image URL	den Open-Graph-Werten, wenn Open Graph aktiv ist — sonst Page Title bzw. Meta Description (das Bild dann nicht)
JSON-LD URL	Canonical URL
JSON-LD Name / headline	Page Title
JSON-LD Description	Meta Description
JSON-LD Image URL	Open Graph Image URL

Die Vererbung gilt für die Ausgabe und für die Vorschau. Für die X-Card kommt eine Besonderheit hinzu: Mit der Option Leave out title, description and image when they equal Open Graph (siehe X (Twitter) Card) lässt das Tool die geerbten twitter:-Werte weg, weil X sie ohnehin aus Open Graph liest.

Die neun Bausteine im Detail

Essential

Die Pflicht-Tags jeder Seite — als einzige Sektion per Voreinstellung aktiv.

Charset — <meta charset="utf-8"> schreibt das Tool immer; eine Auswahl gibt es nicht, weil HTML nur UTF-8 erlaubt.
Page Title (Empfehlung 50–60 Zeichen) → <title>…</title>. Erscheint im Browser-Tab und als anklickbare Überschrift im Suchergebnis. Fehlt er, meldet das Tool „No page title".
Meta Description (Empfehlung 120–160 Zeichen) → <meta name="description">. Kein Ranking-Faktor, beeinflusst aber die Klickrate im Snippet.
Canonical URL → <link rel="canonical">. Zeigt auf die bevorzugte URL und beugt Duplicate Content vor. Eine relative Angabe meldet das Tool als Fehler.
Robots — zwei Radio-Paare index/noindex und follow/nofollow, dazu Checkboxen für noarchive, nosnippet, noimageindex, ein Select max-image-preview (— default —, large, standard, none) und ein Zahlenfeld max-snippet (−1 = kein Limit, 0 = kein Snippet) → <meta name="robots" content="…">. Geschrieben werden nur Direktiven, die vom Default index, follow abweichen — bleibt alles auf Standard, entsteht gar kein Robots-Tag.
Viewport — width=device-width, initial-scale=1 (recommended), Custom… (Freitextfeld Custom viewport) oder Disable zoom (maximum-scale=1 — not accessible) → <meta name="viewport">. Blockiert der Wert das Zoomen (maximum-scale unter 2 oder user-scalable=no), warnt das Tool mit Verweis auf WCAG 1.4.4.
Language versions (hreflang) — dynamische Liste über Add language, je Zeile ein Sprachcode (de, en-GB, x-default …) und eine absolute URL → <link rel="alternate" hreflang="…" href="…">. Ungültige Codes und relative URLs lässt das Tool weg und meldet sie als Fehler; doppelte Codes meldet es ebenfalls.

Prüfhinweise dieser Sektion: noindex zusammen mit einer Canonical URL (widersprüchliche Signale), nosnippet zusammen mit max-snippet (wirkungslos), ein max-snippet-Wert, der keine ganze Zahl ab −1 ist (Fehler; das Tool lässt die Direktive dann weg), eine hreflang-Liste ohne die Seite selbst, der Tipp zu einem x-default-Eintrag und die Erinnerung, dass jede gelistete Sprachversion mit denselben Tags zurückverlinken muss.

Open Graph

Die og:-Tags für Vorschaukarten auf Facebook, LinkedIn und WhatsApp.

Type — website, article, profile, book, video.movie, music.song → og:type (Default website).
URL → og:url (leer = Canonical URL); Title (≤ 95 Zeichen) → og:title (leer = Page Title); Description (≤ 200) → og:description (leer = Meta Description).
Image URL → og:image. Empfehlung laut Tool: 1200×630 px (mindestens 600×315), JPG/PNG/WebP, ≤ 8 MB, absolute URL. Dazu Image width (px)/Image height (px) → og:image:width/:height (nur ganze Zahlen) und Image alt text (≤ 420) → og:image:alt. Breite, Höhe und Alt-Text erscheinen nur, wenn ein Bild gesetzt ist.
Site name → og:site_name.
Locale → og:locale — ein Textfeld mit 13 Vorschlägen (en_US, en_GB, de_DE, de_AT, de_CH, fr_FR, es_ES, it_IT, nl_NL, pl_PL, pt_BR, ja_JP, zh_CN). Vorbelegt ist en_US — für deutsche Seiten änderst du das. Passt der Wert nicht zum Muster sprache_REGION, warnt das Tool.
Article-Felder (erscheinen nur bei Type = article): Published und Modified (Datum/Uhrzeit), Author (profile URL), Section und Tags (comma-separated). Aus den kommagetrennten Tags erzeugt das Tool je ein article:tag-Meta. → article:published_time, article:modified_time, article:author, article:section, article:tag.

Datums- und Zeitangaben schreibt das Tool als ISO 8601 mit dem UTC-Offset deiner Browser-Zeitzone zu genau diesem Datum (Sommer-/Winterzeit wird berücksichtigt), etwa 2026-11-01T19:00:00+01:00. Der Hinweis unter den Feldern nennt die erkannte Zeitzone.

Prüfhinweise: Open Graph ohne og:image (Shares ohne Bild), og:image oder og:url nicht absolut (Fehler) und fehlende Bildmaße (Info: Facebook rendert das Bild sonst erst ab dem zweiten Teilen).

X (Twitter) Card

Card type — summary_large_image (large image) oder summary (small square image) → twitter:card.
Leave out title, description and image when they equal Open Graph — Checkbox, standardmäßig an. Ist Open Graph aktiv und das jeweilige X-Feld leer, entfallen twitter:title, twitter:description und twitter:image, denn X greift auf og:title, og:description und og:image zurück. Dann stehen nur twitter:card, die Handles und — falls ausgefüllt — twitter:image:alt im Block.
Site @handle und Creator @handle → twitter:site/twitter:creator. Das Tool normalisiert die Eingabe: name, @name, https://x.com/name oder twitter.com/name werden zu @name. Hat der Handle mehr als 15 Zeichen oder andere Zeichen als Buchstaben, Ziffern und _, warnt es.
Title (≤ 70) → twitter:title; Description (≤ 200) → twitter:description; Image URL → twitter:image (Empfehlung: groß 2:1, etwa 1200×600; summary 1:1, mindestens 144×144); Image alt text (≤ 420) → twitter:image:alt.

Prüfhinweise: summary_large_image ohne Bild und eine relative Bild-URL.

Icons, Mobile & App

favicon.ico → <link rel="icon" href="…" sizes="32x32">.
SVG icon → <link rel="icon" href="…" type="image/svg+xml">.
apple-touch-icon (180×180) → <link rel="apple-touch-icon">.
Web app manifest → <link rel="manifest">.
Theme color (browser UI on mobile) — Schalter mit Farbwähler Light (Default #0d6efd) → <meta name="theme-color">. Mit Separate dark-mode color kommt ein zweiter Farbwähler Dark (Default #212529) dazu; dann schreibt das Tool zwei theme-color-Tags mit media="(prefers-color-scheme: light)" bzw. dark.
color-scheme — light dark, dark light, light, dark oder only light → <meta name="color-scheme">.
Standalone web app — yes (mobile-web-app-capable) → mobile-web-app-capable und die ältere iOS-Variante apple-mobile-web-app-capable. Fehlt das Manifest, erinnert ein Hinweis daran.
iOS status bar style — default, black, black-translucent → apple-mobile-web-app-status-bar-style.
Home screen title (Counter bis 30) → apple-mobile-web-app-title.
Turn off automatic linking (Safari) — Checkboxen für phone numbers, dates, addresses und e-mail addresses → ein gemeinsames <meta name="format-detection" content="telephone=no, date=no, …">.

Authorship

Author → <meta name="author">; Copyright → <meta name="copyright">; Generator → <meta name="generator">.
Rating (SafeSearch) — adult oder das RTA-Label (RTA-5042-1996-1400-1577-RTA) → <meta name="rating">. Laut Tool versteht Google nur diese beiden Werte; sie markieren Seiten mit Inhalten für Erwachsene.

Security

Die Sektion (Untertitel „meta + HTTP headers") trennt sauber zwischen dem, was als <meta> wirkt, und dem, was nur als HTTP-Header funktioniert. Die Header-Anteile zeigt der Umschalter nginx bzw. Apache im Output-Panel (siehe Output, Speichern und Zurücksetzen).

Content-Security-Policy — Freitext mit drei Preset-Buttons:
- Strict: default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; object-src 'none'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'
- Moderate: wie Strict, aber 'unsafe-inline' für Skripte und Styles, Bilder auch von https:, Fonts auch von https://fonts.gstatic.com, ohne form-action und frame-ancestors
- Loose: default-src 'self' https: data: 'unsafe-inline'; object-src 'none'
Deliver CSP as — <meta> tag, HTTP header oder <meta> tag and HTTP header. Im <meta> entfernt das Tool automatisch frame-ancestors, report-uri, report-to und sandbox, weil Browser sie dort ignorieren, und meldet das. Die Meta-CSP setzt es direkt hinter Charset und Viewport (vor den <title>), denn eine Meta-Policy gilt nur für das, was nach ihr kommt.
Referrer-Policy — strict-origin-when-cross-origin (browser default), no-referrer, same-origin, strict-origin, origin, origin-when-cross-origin, no-referrer-when-downgrade, unsafe-url → <meta name="referrer"> und als Header Referrer-Policy.
Nur als HTTP-Header (Browser ignorieren sie im <meta>, deshalb erscheinen sie nur in den nginx-/Apache-Snippets):
- X-Frame-Options — DENY oder SAMEORIGIN (Schutz vor Clickjacking; modernes Gegenstück ist CSP frame-ancestors).
- X-Content-Type-Options: nosniff — Checkbox.
- Permissions-Policy (deny) — Checkboxen für camera, microphone, geolocation, payment, usb, browsing-topics (jeweils =()) und fullscreen (self only) (fullscreen=(self)).

CSP-Prüfung: Unbekannte Direktiven meldet das Tool als Warnung, ungequotete Schlüsselwörter wie self oder none als Fehler — ohne Anführungszeichen wären sie ein Hostname.

Resource Hints

Fünf dynamische Listen, jede mit eigenem Add-Button; das ✕ entfernt eine Zeile wieder.

preconnect (Origin + optional crossorigin: anonymous oder use-credentials) → <link rel="preconnect"> (DNS, TCP und TLS früh aufbauen — nur für wenige kritische Origins).
dns-prefetch (Origin) → <link rel="dns-prefetch"> (nur die DNS-Auflösung, für weniger wichtige Drittanbieter).
preload (URL, as = font, image, style, script, fetch oder track, optional MIME-type, crossorigin und fetchpriority auto/high/low) → <link rel="preload">. Für as="font" und as="fetch" ergänzt das Tool crossorigin automatisch, sonst lädt der Browser die Datei doppelt.
modulepreload (URL) → <link rel="modulepreload"> (lädt und parst ein JavaScript-Modul vorab).
prefetch (URL) → <link rel="prefetch"> (niedrige Priorität, für die nächste Navigation).

Bei preconnect und dns-prefetch zählt nur der Origin: Gibst du einen Pfad mit an, kürzt das Tool auf https://host und sagt es dir; ohne erkennbaren Origin lässt es die Zeile weg. In der Ausgabe stehen die Hints in der Reihenfolge dns-prefetch, preconnect, preload, modulepreload, prefetch.

Verification

Domain-/Besitz-Bestätigungen der Webmaster-Dienste. Du kannst den Code einfügen oder den ganzen Tag, den dir der Dienst gibt — das Tool zieht den Wert aus content="…" heraus. Enthält der Code danach noch Leerzeichen oder Tag-Reste, warnt es.

Google Search Console → google-site-verification
Bing Webmaster Tools → msvalidate.01
Pinterest → p:domain_verify
Yandex Webmaster → yandex-verification
Facebook (Meta) domain verification → facebook-domain-verification

Structured Data (JSON-LD)

Erzeugt ein <script type="application/ld+json"> mit @context: https://schema.org. Oben wählst du den Schema type; je nach Auswahl blendet das Tool die passenden Felder ein. Ein < in Werten schreibt es als \u003c (dazu U+2028/U+2029 maskiert), sodass ein Wert mit </script> den Block nicht beenden kann. Platzhalter-Daten setzt das Tool nie ein — leere Felder bleiben draußen.

Schema type — — None —, WebPage, WebSite (site name in Google), Article, BlogPosting, NewsArticle, Organization, LocalBusiness, Person, Product, Event, Recipe, FAQPage und BreadcrumbList.
Gemeinsame Felder (eingeblendet für alle Typen außer BreadcrumbList): URL (leer = Canonical; eine relative URL meldet das Tool als Warnung), Name / headline (leer = Page Title; Artikel-Typen schreiben headline statt name), Description (leer = Meta Description).
Image URL (Artikel-Typen, Product, Event, Recipe, LocalBusiness, Person; leer = og:image).
WebSite: Alternate name (Kurzname oder Akronym) → alternateName.
Article / BlogPosting / NewsArticle: Author name und Author URL (→ verschachteltes Person-Objekt), Published und Modified (→ datePublished/dateModified mit Zeitzonen-Offset).
Recipe: Author name, Published, Prep (min) und Cook (min) (→ prepTime, cookTime und totalTime als ISO-8601-Dauer, aus 90 Minuten wird PT1H30M), Yield (recipeYield), Ingredients (one per line) (→ recipeIngredient) und Steps (one per line) (→ recipeInstructions aus HowToStep).
Organization / LocalBusiness: @id (relative Werte wie #organization löst das Tool gegen die URL auf), Logo URL, Address (Street, Postal code, City, Region, Country → PostalAddress) und Contact (Telephone, Contact type, Contact page → ContactPoint; bei LocalBusiness steht die Telefonnummer zusätzlich als telephone).
sameAs (profiles elsewhere) (Organization, LocalBusiness, Person): beliebig viele URLs über Add URL; relative URLs meldet das Tool.
LocalBusiness zusätzlich: Price range, Opening hours (Liste über Add hours, Format Mo-Fr 09:00-17:00 oder Sa 10:00-14:00, abweichende Schreibweisen meldet das Tool), Latitude/Longitude (Komma oder Punkt; außerhalb ±90 bzw. ±180 lässt das Tool die Koordinaten weg und meldet einen Fehler) und Map URL (hasMap).
Person: Job title.
Product: Brand (→ Brand), SKU, Price (Komma oder Punkt), Currency (dreistelliger ISO-4217-Code wie EUR) und Availability (In stock, Out of stock, Pre-order, Back order, Limited, Discontinued) → offers vom Typ Offer, mit der URL der Seite. Ohne gültige Währung oder bei einem Preis, der keine Zahl ist, lässt das Tool das Angebot weg — eine Default-Währung gibt es nicht.
Event: Start und End, Attendance (On site, Online, On site + online → eventAttendanceMode), Status (Scheduled, Postponed, Rescheduled, Moved online, Cancelled → eventStatus), bei Online-Anteil Stream URL (→ VirtualLocation), bei Vor-Ort-Anteil Venue name und Address (→ Place). Hybrid-Events bekommen beide Orte als Liste.
FAQPage: Frage-/Antwort-Paare über Add question → mainEntity aus Question/acceptedAnswer. Paare, bei denen Frage oder Antwort fehlt, lässt das Tool weg und warnt.
BreadcrumbList: Einträge über Add item (Name + URL, von der Startseite bis zur aktuellen Seite) → itemListElement aus ListItem mit fortlaufender position. Nur der letzte Eintrag darf ohne URL bleiben. Das URL-Feld der gemeinsamen Felder ist für diesen Typ ausgeblendet, ein url schreibt das Tool trotzdem — aus der Canonical URL oder aus einem Wert, der noch im jetzt ausgeblendeten Feld URL steht (etwa von einem zuvor gewählten Typ).

Das Tool erzeugt pro Durchlauf einen Schema-Typ. Fehlende Pflicht- und Empfehlungsangaben nach Google meldet es unter der Ausgabe:

Typ	Fehler (Pflicht)	Warnung / Info (empfohlen)
Article, BlogPosting, NewsArticle	—	Bild (Warnung), `datePublished`, Autor (Info)
LocalBusiness	Adresse	—
Product	Preis ohne Zahl, Preis ohne Währung	ohne `offers` keine Produkt-Snippets
Event	Startdatum; Adresse des Veranstaltungsorts; Stream-URL bei Online-Anteil	—
Recipe	Bild	Zutaten und Schritte (Info)
FAQPage	mindestens ein vollständiges Paar	unvollständiges Paar (Warnung); FAQ-Rich-Results zeigt Google seit 2023 nur für bekannte Behörden- und Gesundheitsseiten (Info)
BreadcrumbList	mindestens ein Eintrag; Name je Eintrag; URL bei allen außer dem letzten	relative URL (Warnung)

Der Preview-Tab

Der Preview-Tab zeigt vier Vorschauen aus den effektiven Werten — also mit derselben Vererbung wie die Ausgabe:

Google search result — Breadcrumb aus Host und Pfad deiner Canonical URL (ersatzweise og:url), Titel und Description. Gekürzt wird wie bei Google nach Pixelbreite: Der Titel in 20 px Arial bei rund 600 px, die Description in 14 px Arial bei rund 920 px (Desktop), jeweils mit „ …". Eine Messzeile zeigt die Breiten, etwa „Title 512 px of ~600 · Description 1004 px of ~920 (cut)". Ohne Description steht dort ein Hinweis, dass Google dann selbst Text aus der Seite wählt. Google kann Titel und Description außerdem umschreiben — die Vorschau ist eine Näherung.
Open Graph card — Bildfläche (lädt dein og:image, Platzhalter-Icon bei relativer URL oder Ladefehler), Site-Name (ersatzweise der Host), Titel und Description.
X card — Bild, Host, Titel und Description; bei Card-Typ summary im kompakten Layout mit kleinem Bild. Da X keinen Card-Validator mehr anbietet, empfiehlt das Tool, die URL vor der Veröffentlichung in einen neuen Post einzufügen.
JSON-LD — das formatierte Schema, sonst der Hinweis, Structured Data einzuschalten und einen Typ zu wählen. Darunter Links zum Google Rich Results Test und zum Schema Markup Validator.

Die Vorschau wird beim Öffnen des Tabs aus dem aktuellen Stand berechnet und, solange der Tab offen ist, bei jeder Eingabe nachgeführt — du siehst also immer deine letzten Eingaben.

Tips- und Reference-Tab

Zwei Nachschlage-Tabs runden das Tool ab und funktionieren ohne Eingabe:

Tips — eine Priority Guide-Tabelle (Must have / Important / Recommended / Optional), Do-/Don't-Listen, eine Tabelle Length guidelines (Empfehlung und ungefähre Abschneidegrenze je Feld) und Testing Tools: Google Rich Results Test, Schema Markup Validator, Facebook Sharing Debugger, LinkedIn Post Inspector, SecurityHeaders.com und der SEO Analyzer der JPKCom Tools.
Reference — Tabellen je Kategorie (Essential, Open Graph, X Card, Icons/Mobile, Security, Resource Hints, Verification, JSON-LD): welcher Tag, welcher Wert, welche Bedeutung. Die Security-Tabelle zeigt, welche Policy im <meta> wirkt und welche nur als Header; die JSON-LD-Tabelle, was Google je Typ verlangt und welches Rich Result daraus werden kann.

Zeichenlimits und Komfortfunktionen

An den längenkritischen Feldern sitzen Zeichenzähler („Characters n / Maximum") mit einem Fortschrittsbalken in vier Farben: grün, gelb, orange und rot, sobald das Maximum überschritten ist. Gezählt werden sichtbare Zeichen (ein Emoji zählt einmal); ist das Feld leer, zählt der geerbte Wert. Die Zähler begrenzen nicht hart — du kannst weitertippen. Die Stufen aus dem Tool:

Feld	Empfehlung	grün bis	gelb bis	orange bis	rot ab
Page Title (`<title>`)	50–60	50	55	60	61
Meta Description	120–160	130	150	160	161
`og:title`	≤ 95	75	85	95	96
`og:description`	≤ 200	160	180	200	201
`og:image:alt`, `twitter:image:alt`	≤ 420	350	400	420	421
`twitter:title`	≤ 70	55	65	70	71
`twitter:description`	≤ 200	160	180	200	201
Home screen title	≤ 12 (Tips-Tab)	12	20	30	31

Weitere Komfortfunktionen: die Vererbung leerer Felder, die CSP-Presets, das automatische Einschalten einer Sektion beim Tippen und die Prüfhinweise unter der Ausgabe. Diese sind nach Schwere sortiert — erst Fehler, dann Warnungen, dann Infos, jeweils mit eigenem Symbol — und doppelte Meldungen erscheinen nur einmal.

Output, Speichern und Zurücksetzen

HTML | nginx | Apache — schaltet den Editor zwischen den Head-Tags und den Header-Snippets um:
- nginx: add_header Name "Wert" always; für server { … } oder location { … }, mit dem Hinweis, dass ein location-Block mit eigenem add_header alle geerbten Header verwirft. Werte mit $ lässt das Tool dort mit Kommentar weg, weil nginx sie als Variable auswertet und kein Escaping kennt.
- Apache: Header always set Name "Wert" in <IfModule mod_headers.c> für VirtualHost oder .htaccess. Prozentzeichen werden als %% geschrieben, weil mod_headers % als Formatzeichen liest.
- Ins Header-Snippet kommen die CSP (bei HTTP header oder both), Referrer-Policy, X-Frame-Options, X-Content-Type-Options und Permissions-Policy. Ist nichts davon gewählt, steht dort # No HTTP headers selected — see the Security section.
Copy — kopiert die gerade angezeigte Ausgabe in die Zwischenablage.
Download — speichert sie als meta-tags.html, security-headers.nginx.conf oder security-headers.apache.conf, je nach Ansicht.
Reset — fragt „Reset all fields and clear saved data?" und setzt danach alle Felder auf die Voreinstellungen zurück, leert die dynamischen Listen, aktiviert wieder nur Essential und löscht den lokalen Speicher.
Persistenz — ohne Reset bleibt dein Stand im localStorage erhalten und ist beim nächsten Öffnen wieder da.

Für den Einstieg, die Zielgruppen und das große Bild siehe die Übersichtsseite. Konkrete Durchläufe stehen in den Beispielen, Strategie und Stolperfallen in den Tipps & Tricks. Ausprobieren kannst du alles direkt im Tool.