HTTP-Header

Definition: HTTP-Header sind Schlüssel-Wert-Paare, die als Metadaten in HTTP-Anfragen (Request-Header) und HTTP-Antworten (Response-Header) zwischen Browser und Webserver übertragen werden. Sie steuern Caching-Verhalten, Inhaltstypen, Komprimierung, Sicherheitsrichtlinien, Authentifizierung und Cross-Origin-Regeln. HTTP-Header sind für den Endnutzer unsichtbar, aber technisch entscheidend: falsch konfigurierte Cache-Control-Header führen zu veralteten Seiten, fehlende Sicherheitsheader ermöglichen XSS-Angriffe, und restriktive Content-Security-Policy-Header können Tracking-Skripte blockieren. Browser DevTools (Network-Tab) zeigen alle Request- und Response-Header für jede HTTP-Anfrage.

Erläuterung

HTTP-Header begleiten jeden einzelnen Request – beim Laden einer Webseite werden für HTML, CSS, JavaScript, Bilder und APIs separate HTTP-Anfragen mit eigenen Headern gestellt. Für Marketing-Teams sind zwei Bereiche direkt relevant: (1) Cache-Control-Header bestimmen ob Nutzer aktuelle oder veraltete Versionen von Landingpages und Tracking-Skripten sehen; (2) Content-Security-Policy kann externe Tracking-Skripte (GTM, Meta Pixel, GA4) erlauben oder blockieren.

Request-Header

User-Agent: Identifiziert Browser, OS und Gerätetyp; Beispiel: «Mozilla/5.0 (iPhone; CPU iPhone OS 17_0) AppleWebKit/537.36»; Server können darauf basierend unterschiedliche Inhalte ausliefern; moderner Ansatz: Client Hints statt User-Agent für besseren Datenschutz
Accept-Encoding: Teilt Server mit welche Komprimierungsformate der Browser unterstützt; «gzip, deflate, br» = Brotli unterstützt; Server antwortet mit komprimierter Version wenn unterstützt; Brotli bis 20 % kleiner als gzip
Referer: URL der vorherigen Seite (Tippfehler in RFC bewusst beibehalten); wichtig für Kampagnen-Attribution und Analytics; Referrer-Policy-Header steuert wie viel Referer-Information übertragen wird; HTTPS→HTTP: kein Referer; HTTPS→HTTPS: standardmäßig full URL
Cookie: Browser sendet alle relevanten Cookies im Request-Header; First-Party-Cookies: selbe Domain; Third-Party-Cookies: Cross-Origin (von Browsern zunehmend blockiert); Basis für Session-Management, Tracking und Personalisierung

Response-Header für Caching

Cache-Control: Wichtigster Caching-Header; «max-age=31536000, immutable» für versioned Assets (JS/CSS mit Hash im Dateinamen); «no-store» für sensible Seiten (Checkout, Account); «no-cache, must-revalidate» für HTML-Seiten die immer aktuell sein müssen; «s-maxage» für CDN-spezifisches Caching
ETag: Fingerprint des Ressourcen-Inhalts; Browser sendet ETag beim nächsten Request; Server antwortet mit 304 Not Modified wenn unverändert; spart Bandbreite ohne Content-Transfer; Alternative: Last-Modified-Header
Vary: Teilt Cache mit dass Antwort von bestimmten Request-Headern abhängt; «Vary: Accept-Encoding» = separate Cache-Einträge für gzip und Brotli; «Vary: User-Agent» performt schlecht (zu viele Cache-Einträge); falsch gesetzt: CDN liefert falsche Versionen

Sicherheitsrelevante Response-Header

Content-Security-Policy (CSP): Definiert welche Ressourcen (Scripts, Styles, Frames, Fonts) geladen werden dürfen; «script-src 'self' https://www.googletagmanager.com https://connect.facebook.net» erlaubt GTM und Meta Pixel; zu restriktive CSP blockiert Tracking-Skripte ohne Fehlermeldung im UI; CSP-Fehler in Browser-Konsole sichtbar; securityheaders.com für Grading
Strict-Transport-Security (HSTS): Erzwingt HTTPS für zukünftige Requests; «max-age=31536000; includeSubDomains» für 1 Jahr; verhindert SSL-Stripping-Angriffe; nach Aktivierung: Browser ignoriert HTTP und wechselt automatisch zu HTTPS; in HSTS-Preload-Liste eintragen für maximale Sicherheit
X-Frame-Options: Verhindert Einbettung in <iframe> (Clickjacking-Schutz); «SAMEORIGIN» oder «DENY»; moderner Ersatz: CSP frame-ancestors Direktive; wichtig für Login-Seiten und Checkout
Permissions-Policy: Steuert Browser-Features (Kamera, Mikrofon, Geolocation); relevant für Datenschutz-Compliance; kann Interest-Cohort-API (FLoC) deaktivieren: «interest-cohort=()»; für Marketing: steuert ob Tracking-relevante Browser-APIs nutzbar sind

CORS und Tracking-Relevanz

CORS (Cross-Origin Resource Sharing): Access-Control-Allow-Origin: erlaubt Cross-Origin-Requests; für Server-Side Tagging APIs notwendig; «*» erlaubt alle Origins (unsicher für authentifizierte Requests); Preflight-Requests (OPTIONS) bei komplexen CORS-Anfragen; falsch konfiguriert: Tracking-Pixels und API-Calls schlagen fehl
Tracking-Scripts und CSP: Google Analytics 4: script-src https://www.googletagmanager.com https://www.google-analytics.com; Meta Pixel: script-src https://connect.facebook.net; TikTok Pixel: script-src https://analytics.tiktok.com; img-src für Pixel-Fallbacks; connect-src für Beacon-Requests und fetch-Calls
Diagnose in DevTools: Chrome DevTools → Network-Tab → Header-Ansicht; «Blocked by CSP» oder «CORS error» direkt sichtbar; Console-Tab zeigt CSP-Violation-Meldungen; curl -I https://example.com gibt Response-Header im Terminal aus; securityheaders.com scannt alle Sicherheitsheader und gibt Schulnoten

Praxistipp: Scannen Sie Ihre Website auf securityheaders.com und implementieren Sie mindestens: (1) Strict-Transport-Security für HTTPS-Erzwingung; (2) X-Frame-Options: SAMEORIGIN gegen Clickjacking; (3) Content-Security-Policy – aber Achtung: eine zu restriktive CSP blockiert GTM, Analytics und alle Drittanbieter-Tracking-Skripte. Bauen Sie die CSP schrittweise auf: Starten Sie mit CSP im Report-Only-Modus («Content-Security-Policy-Report-Only»), der Verletzungen nur loggt ohne zu blockieren, und erweitern Sie die Allowlist bis keine Tracking-Skripte mehr reportet werden. Erst dann in den Enforcement-Modus wechseln.