Technical8 min read22 April 2026

HTTP Security Headers Explained: A Plain-English Guide

Security headers are the fastest way to improve your website's security posture. Here's what each one does, why it matters, and the exact code to add it.

What Are HTTP Security Headers?

When your web server responds to a browser request, it sends back HTTP headers alongside the page content. Most of these are invisible to users — they tell the browser things like "this content is HTML" or "cache this for 24 hours."

Security headers are a special category that tell the browser how to handle your content securely. They're one of the fastest, lowest-risk ways to improve your security posture — typically a single line of configuration per header.


The Essential Headers

1. Strict-Transport-Security (HSTS)

What it does: Tells browsers to always use HTTPS for your domain, even if the user types http://. Prevents SSL stripping attacks.

Recommended value:

Strict-Transport-Security: max-age=31536000; includeSubDomains; preload

What the options mean:

  • max-age=31536000 — remember this for 1 year
  • includeSubDomains — apply to all subdomains too
  • preload — submit to the HSTS preload list (browsers will enforce HTTPS before even making a request)

Risk level to add: Very low. Just make sure your HTTPS is working correctly first.


2. Content-Security-Policy (CSP)

What it does: Defines which sources of content (scripts, styles, images, fonts) are allowed to load on your page. Prevents cross-site scripting (XSS) attacks.

Starter value:

Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' https://fonts.gstatic.com;

Risk level to add: Medium. A too-strict CSP can break your site. Start permissive and tighten over time. Use Content-Security-Policy-Report-Only first to see what would be blocked.


3. X-Frame-Options

What it does: Prevents your page from being embedded in an <iframe> on another site. Stops clickjacking attacks where attackers overlay invisible frames on legitimate pages to trick users into clicking things.

Recommended value:

X-Frame-Options: DENY

Or if you need to allow framing from your own domain:

X-Frame-Options: SAMEORIGIN

Risk level to add: Very low.


4. X-Content-Type-Options

What it does: Prevents browsers from "MIME sniffing" — guessing the content type of a response. Without this, a browser might execute a text file as JavaScript if it looks like code.

Value (only one option):

X-Content-Type-Options: nosniff

Risk level to add: Very low.


5. Referrer-Policy

What it does: Controls how much referrer information is included when users click links from your site to other sites. Prevents leaking sensitive URL parameters (like session tokens or search queries) to third parties.

Recommended value:

Referrer-Policy: strict-origin-when-cross-origin

Risk level to add: Very low.


6. Permissions-Policy

What it does: Controls which browser features (camera, microphone, geolocation, payment) your page can use. Prevents malicious third-party scripts from silently accessing these features.

Recommended value:

Permissions-Policy: camera=(), microphone=(), geolocation=(), payment=()

Risk level to add: Low. Adjust if your site legitimately uses these features.


How to Add Headers

Nginx

nginx
add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
add_header X-Frame-Options "DENY" always;
add_header X-Content-Type-Options "nosniff" always;
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
add_header Permissions-Policy "camera=(), microphone=(), geolocation=()" always;

Apache

apache
Header always set Strict-Transport-Security "max-age=31536000; includeSubDomains"
Header always set X-Frame-Options "DENY"
Header always set X-Content-Type-Options "nosniff"
Header always set Referrer-Policy "strict-origin-when-cross-origin"

Cloudflare (Workers or Transform Rules)

Use Cloudflare's "Modify Response Header" Transform Rule to add headers without touching your server.

Node.js / Express

javascript
app.use((req, res, next) => {
  res.setHeader('Strict-Transport-Security', 'max-age=31536000; includeSubDomains');
  res.setHeader('X-Frame-Options', 'DENY');
  res.setHeader('X-Content-Type-Options', 'nosniff');
  res.setHeader('Referrer-Policy', 'strict-origin-when-cross-origin');
  next();
});

Or use the helmet package which sets sensible defaults automatically.


Check Your Headers

After adding headers, run a free scan at WebGuard [blocked] to verify they're correctly configured and see your updated security score.

Share this article

Check Your Website Now

Free scan, no account required. See exactly which issues affect your site.

Start Free Scan