How to Implement Security Headers

Security headers tell browsers how to behave when loading your site. Adding them is one of the highest-impact, lowest-effort security improvements you can make. This guide walks through each header with verification using the Headers tool.

Where to Add Headers

Security headers are set in your web server configuration, CDN settings, or application middleware. The exact syntax depends on your stack:

Nginx - use the add_header directive in your server or location block:

add_header X-Content-Type-Options "nosniff" always;

Cloudflare Pages / Netlify - create a _headers file in your publish directory:

/*
  X-Content-Type-Options: nosniff

Vercel - add a headers array to vercel.json:

{
  "headers": [{
    "source": "/(.*)",
    "headers": [{ "key": "X-Content-Type-Options", "value": "nosniff" }]
  }]
}
1

Start with a baseline scan

Open the Headers tool and enter your site's URL. The tool will fetch the response headers and assign a grade based on which security headers are present. Note which headers are missing. This is your starting point.

2

Add X-Content-Type-Options

Set the header value to nosniff. This prevents browsers from MIME-type sniffing, which stops them from interpreting files as a different content type than what the server declared. There is zero risk and no configuration needed. It is always safe to add.

X-Content-Type-Options: nosniff

Deploy and rescan with the Headers tool to verify it appears.

3

Add X-Frame-Options

Set to DENY to prevent your site from being embedded in any iframe. If you need to iframe your own pages (for example, embedding a widget on your own domain), use SAMEORIGIN instead.

X-Frame-Options: DENY

If you need to allow embedding from specific third-party origins, skip this header and use the CSP frame-ancestors directive instead, which supports origin allowlists. Rescan to verify.

4

Add Referrer-Policy

Set to strict-origin-when-cross-origin. This is already the browser default, but setting it explicitly ensures consistent behavior and signals intent. It sends the full URL for same-origin requests but only the origin (no path) for cross-origin requests.

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

This prevents leaking full URL paths (which may contain tokens, IDs, or other sensitive data) to third-party sites. Rescan to verify.

5

Add Strict-Transport-Security (HSTS)

Start with a short max-age to confirm HTTPS works correctly across your entire site:

Strict-Transport-Security: max-age=86400

This tells browsers to use HTTPS for the next 24 hours. After you have confirmed that all pages, assets, and APIs work over HTTPS without mixed content issues, increase to one year and add includeSubDomains:

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

Only add the preload directive after carefully reviewing the implications. HSTS preloading is difficult to undo and affects all subdomains. See HSTS vs HSTS Preloading for details. Rescan to verify.

6

Add Permissions-Policy

Disable browser features your site does not use. This reduces the attack surface if a third-party script is compromised:

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

The empty parentheses () mean "no origins are allowed to use this feature." Add other features as needed: payment=(), usb=(), bluetooth=(). Only allow features you actually use, and scope them to specific origins when possible. Rescan to verify.

7

Add Content-Security-Policy

CSP is the most powerful security header but also the most likely to break things. Start with report-only mode:

Content-Security-Policy-Report-Only: default-src 'self'

This logs violations to the browser console without blocking anything. Open your site, use all features, and check the console for CSP violation reports. Each violation tells you which resource was blocked and why.

Gradually build your policy by adding allowed sources for scripts, styles, images, and fonts. For example:

Content-Security-Policy-Report-Only: default-src 'self'; script-src 'self' https://cdn.example.com; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self'

Once you have a policy that produces no violations, switch from Content-Security-Policy-Report-Only to Content-Security-Policy to enforce it. Rescan to verify.

8

Verify your final grade

Run a final scan with the Headers tool. With all headers in place, you should have an A or A+ grade. If any headers are missing or misconfigured, the tool will flag them. Use the Health Check tool for additional validation across DNS, TLS, and headers together.

Common Mistakes

Try these tools

Headers Scanner Health Check