← Blog

Security Headers Guide: HSTS, CSP, and X-Frame-Options Explained

3 min read
#security#headers#hsts#csp

HTTP security headers are a subset of HTTP response headers that tell a browser how to behave when handling your website's content. By implementing just a few lines of configuration, you can protect your users from 90% of common client-side vulnerabilities like Cross-Site Scripting (XSS), Clickjacking, and Protocol Downgrades.

Security headers are the "invisible shield" of your website. They cost nothing to implement but provide immense value in protecting your data and your users.

1. Strict-Transport-Security (HSTS)

HSTS tells the browser that the website should only be accessed using HTTPS. Even if a user types http://, the browser will automatically convert it to https:// before the request ever leaves the user's computer.

Why it matters

It prevents "Man-in-the-Middle" attacks where an attacker intercepts an unencrypted HTTP connection.

How to implement (Nginx)

add_header Strict-Transport-Security "max-age=31536000; includeSubDomains; preload" always;

2. Content-Security-Policy (CSP)

CSP is the most powerful security header. It allows you to define an "allowlist" of trusted sources for scripts, styles, and images.

Why it matters

It effectively kills most Cross-Site Scripting (XSS) attacks by refusing to execute any script that doesn't come from a trusted source.

Example Policy

Content-Security-Policy: default-src 'self'; script-src 'self' https://apis.google.com; img-src 'self' data:;

3. X-Frame-Options

This header tells the browser whether it is allowed to render your page in a <frame>, <iframe>, or <object>.

Why it matters

It prevents Clickjacking attacks, where an attacker tricks a user into clicking something on your site by overlaying it with a transparent layer.

X-Frame-Options: DENY

4. X-Content-Type-Options

This header stops the browser from "sniffing" the content type of a file and trying to guess what it is.

Why it matters

It prevents an attacker from uploading a malicious script disguised as an image and having the browser execute it.

X-Content-Type-Options: nosniff

5. Referrer-Policy

This header controls how much information the browser includes in the Referer header when a user clicks a link that leaves your site.

Why it matters

It prevents leaking sensitive information (like session IDs in the URL) to third-party websites.

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

How to Verify Your Headers

You can check your website's security header score instantly using our free tool.

Audit your security headers now →

Conclusion

Implementing security headers is one of the highest-ROI tasks a developer can perform. It takes less than 10 minutes to configure but significantly hardens your website against modern web attacks.