Sicherheit im Web – das klingt für viele nach Firewalls, Passwortregeln oder düsteren Hackerfilmen aus den frühen 2000ern. Nach Dingen, die irgendwie wichtig sind, aber eben auch sperrig, technisch, schwer greifbar.
Die Wahrheit? Sicherheit beginnt oft viel unscheinbarer – direkt im Kopf deiner Website. Genauer gesagt: in den sogenannten Security-Headern, die dein Server bei jedem Seitenaufruf mitsendet.
Diese Header sind keine sichtbaren Features. Sie verändern nichts am Design, am Layout oder an der Nutzerführung. Aber sie geben dem Browser klare Regeln, wie mit deiner Website umgegangen werden darf – und vor allem, was nicht erlaubt ist.
Was dabei herauskommt?
Ein stiller Schutzschild. Kein Aufsehen. Keine Animation. Aber eine wichtige Verteidigungslinie gegen Dinge wie Datenlecks, fremde Skripte oder manipulierte Tabs.
In diesem Beitrag zeigen wir dir:
- Was Security-Header sind
- Warum sie deine Website sicherer machen
- Welche drei du kennen solltest
- …und was wir dabei selbst eindrucksvoll falsch gemacht haben
Was sind Security-Header überhaupt?
Immer wenn jemand deine Website aufruft, startet im Hintergrund ein kleiner Dialog – zwischen deinem Server und dem Browser der Nutzerin oder des Nutzers. Ein Teil dieses Austauschs besteht aus sogenannten HTTP-Headern. Die meisten davon kümmern sich um technische Details: Sprache, Caching, Cookies.
Einige wenige Header aber kümmern sich um etwas sehr Menschliches: Sicherheit und Vertrauen.
Diese sogenannten Security-Header sagen dem Browser zum Beispiel:
„Bitte lade diese Seite nur über eine verschlüsselte Verbindung.“
„Erlaube keine fremden Skripte von anderen Domains.“
„Lass niemanden diese Seite in ein fremdes Frame einbetten.“
„Vertrau niemandem, der über einen fremden Tab zurückkommt.“
Mit anderen Worten: Der Server sagt dem Browser ganz genau, was erlaubt ist – und was nicht.
Und das Beste: Du brauchst dafür kein Sicherheitsteam und kein extra Tool.
Nur ein paar kluge Zeilen Konfiguration – und ein bisschen Wissen darüber, was sie bewirken.
Drei Header, die du kennen solltest
HSTS – Strict Transport Security
Verhindert, dass deine Seite unverschlüsselt (über HTTP) aufgerufen wird. Der Browser merkt sich: „Diese Domain ist nur über HTTPS erreichbar.“
Wichtig für alle, die ein SSL-Zertifikat haben – und das sollten heute alle sein.
Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
COOP – Cross-Origin Opener Policy
Verhindert, dass andere Seiten mit deinem Fenster herumspielen können. Klingt seltsam? Ist aber ein echter Angriffspunkt, z. B. bei „Reverse Tabnapping“. COOP schützt davor, dass Popups zurück in dein Fenster greifen.
Cross-Origin-Opener-Policy: same-origin
CSP – Content Security Policy
Der mächtigste – und auch sensibelste – Header. Er regelt, von welchen Quellen Inhalte geladen werden dürfen: Skripte, Fonts, Bilder, Stylesheets. Falsch konfiguriert blockiert er auch Dinge, die du eigentlich brauchst. Richtig eingestellt, ist er ein echter Bodyguard gegen Angriffe per JavaScript.
Content-Security-Policy: default-src 'self'; script-src 'self'
Was wir selbst erlebt haben
Klingt einfach? Ist es theoretisch auch. Aber praktisch?
Wir haben’s für unsere eigene Seite umgesetzt – und mussten dabei feststellen:
- Der BOTschafter war plötzlich stumm
- Die Schriftarten sahen aus wie Notfall-Typografie
- Matomo & Tracking liefen nicht mehr sauber
- Und nach einem Syntaxfehler in der
.htaccess
: Boom, Error 500
Erkenntnis: Security-Header sind mächtig, aber nichts zum Schnell-mal-reinwerfen. Sie müssen zur Website und zu den verwendeten Diensten passen.
Fazit: Sicherheit mit Plan, nicht mit Panik
Security-Header helfen dir, deine Seite besser abzusichern. Besonders dann, wenn du Formulare, eingebettete Dienste, Tracking oder eigene Webanwendungen einsetzt. Sie sind kein Ersatz für andere Sicherheitsmaßnahmen – aber ein wichtiger Baustein im Gesamtpaket.
Der Trick dabei: Nicht zu viel blocken. Und nicht zu wenig. Sondern: Genau das, was deine Seite braucht.