Password protect an HTML page, properly
A raw HTML file can't gate itself, and a JavaScript password check is security theatre. Host the page behind something that checks the password before sending bytes - drop it on Hostsmith and turn on a real gate on Pro.
Hosted in the EU on request - EU data partitions available on Pro.
The public link is free. You'll sign in free to publish it - no card needed.
This one comes up constantly: someone has a single index.html - a proposal, a lookbook, a one-page site - and wants a password in front of it. They search, find a snippet of JavaScript that prompts for a password, and ship it. Please don't. Here is why, and what to do instead.
Why a raw HTML page can't gate itself
An HTML file is markup the browser downloads and renders. There is no point in that process where it can ask "who are you?" and refuse to load. So every client-side "password" gate works the same way: the password and the secret URL live in the page you already sent. Open the dev tools, read the source, done. It is a speed bump, not a lock.
Real protection happens before the bytes leave the server. The server checks the password (or your identity) and only then sends the page. The browser never sees protected content unless you are allowed in.
The real options
.htaccess+.htpasswdon an Apache server is genuine server-side protection. It is also the most setup: you need Apache, server access, and to be comfortable editing hidden files and hashing a password. If that sentence sounded fine, it is a perfectly good answer.- A host with built-in protection does the same server-side check as a toggle. No server admin, no config files.
How Hostsmith handles it
- Drop your
.htmlfile - or a ZIP with its images and assets - onto Hostsmith for a free public link. - On the Pro plan, turn on Private Sites.
- Choose a shared password, or an email whitelist so only specific addresses get in.
The gate runs on the server, so the page is never sent to someone who hasn't passed it. Password protection, custom domains and EU partitions are Pro features; the free tier gives you a public link, not a gate.
| Approach | What it really gives you | Hostsmith |
|---|---|---|
| JavaScript password prompt | No real protection - password and URL are in the page source | Server-side gate; nothing sent until the password checks out |
| .htaccess + .htpasswd | Strong, but needs Apache, server access and config | One toggle, no server admin |
| Shared-password link | Depends on your host | Built in on Pro |
| Email-whitelist access | Rarely available without extra tooling | Yes, list the allowed emails (Pro) |
| EU data partition | Depends on your host | EU partition on Pro |
| Free public link | Yes, on most static hosts | Yes - free tier, public link |
Frequently asked questions
Can an HTML page password-protect itself?
No. An HTML file is just markup the browser renders; it has no way to check a credential before it loads. Any 'password' you add in client-side JavaScript ships inside the page - the password, the comparison and the protected URL are all readable in the browser's dev tools. That is obscurity, not protection.
Isn't a JavaScript password gate good enough for low stakes?
It stops a casual passer-by and nobody else. Search engines can crawl the redirect target, cached copies leak, and anyone curious opens dev tools. If it genuinely doesn't matter who sees the page, you don't need a gate; if it does, you need a real one.
What's the simplest real way to gate one HTML page?
Host it somewhere that checks the password on the server. Drop the .html file (or a ZIP with its assets) onto Hostsmith for a free public link, then on Pro turn on Private Sites with a shared password or an email whitelist. The gate runs before any content is sent.
Gate one HTML page in two minutes
Drop the file for a free link, then add a real password on Pro.
Free public links. Password protection, custom domains and EU data partitions are on Pro.