Security
Securing Your Website with HTTP Security Headers: My Journey from Red Flags to A+

When it comes to web security, most people think of firewalls, strong passwords, or SSL certificates. But many overlook a critical aspect of frontend security: HTTP Security Headers. Recently, I tested my own site using SecurityHeaders.com and was met with a wall of red. Every recommended security header was missing. That was my wake-up call.

In this post, I want to share what these headers are, why they matter, what risks you’re exposed to if you ignore them, and how I implemented a set of headers that earned my site an A+ security score.

What Are HTTP Security Headers?

HTTP Security Headers are directives sent by a web server to a browser, telling it how to behave while handling your site. They help mitigate common threats like XSS (Cross-Site Scripting), clickjacking, MIME-type sniffing, and more.

Think of them as browser-level rules to reduce the attack surface of your website.

Why You Should Care

Ignoring security headers is like leaving your front door unlocked. Even if your site has an SSL certificate, it doesn’t mean it’s fully protected. Here’s what can go wrong:

  • Clickjacking Attacks: Without X-Frame-Options, your site can be embedded in iframes and trick users into clicking things unknowingly.
  • XSS Attacks: Without a proper Content-Security-Policy (CSP), attackers can inject malicious scripts.
  • Data Leaks: Missing Referrer-Policy can expose user data through referrer headers.
  • Browser Abuse: Without Permissions-Policy, browsers may grant access to features like the camera or microphone unnecessarily.

My Initial Results

SecurityHeaders.com gave my site an F grade. The system did not configure any of the essential headers, so it flagged them.:

  • Strict-Transport-Security
  • Content-Security-Policy
  • X-Frame-Options
  • X-Content-Type-Options
  • Referrer-Policy
  • Permissions-Policy

The Fix: Adding Headers via .htaccess

I use an Apache server, so I added the following to my .htaccess file:

# BEGIN Security Headers
<IfModule mod_headers.c>
    Header always set Strict-Transport-Security "max-age=31536000; includeSubDomains; preload"
    Header always set Content-Security-Policy "upgrade-insecure-requests"
    Header always set X-Frame-Options "SAMEORIGIN"
    Header always set X-Content-Type-Options "nosniff"
    Header always set Referrer-Policy "strict-origin-when-cross-origin"
    Header always set Permissions-Policy "geolocation=(), microphone=(), camera=(), fullscreen=(self), payment=()"
</IfModule>

<DirectoryMatch ".svn">
    Require all denied
</DirectoryMatch>
# END Security Headers

I tried several CSP policies, but many broke my site due to inline scripts and external assets. The current setup balances security and stability.

Results After Applying Headers

After implementing these, I re-tested on SecurityHeaders.com and got an A+. The system marked all six headers green, indicating full compliance.

Key Takeaways

  • Security headers are not optional in 2025.
  • Apply them carefully. Test thoroughly.
  • Use tools like SecurityHeaders.com and browser dev tools to verify.
  • Each header serves a specific purpose. Understand them instead of blindly copying rules.

Final Thoughts

Securing your website isn’t a one-time task. It’s an ongoing process. Start with HTTP headers — they’re powerful, lightweight, and effective. If you’re running a personal or client website, this small tweak can prevent major headaches down the line.