How to Share an HTML File as a Link

hdply · 2026-08-15

You have an HTML page and you want to show it to someone. The obvious move — attach the file to an email or drop it in a chat — fails more often than it works, in ways that are confusing because the file opens perfectly on your own machine. Here's why, what the common workarounds actually do, and the approach that just works.

Why sending the file doesn't work

Four separate things go wrong, and usually more than one at once.

Mail providers distrust HTML attachments. An .html file is a classic phishing vector, so Gmail and others strip it, quarantine it, or bury it behind a warning. Your recipient may never see it.
Chat apps download instead of display. Slack, WhatsApp and Teams treat it as a file to save, not a page to open. The recipient now has a file in their Downloads folder and a decision to make.
Phones often can't open it at all. iOS and Android have no comfortable way to open a downloaded HTML file; on iOS it may not open in a browser at all.
Relative references break. If your page loads style.css or logo.png from alongside itself, the recipient gets an unstyled wall of text, because you sent one file out of several.

Even when it works, it's a bad experience: the recipient sees file:///Users/them/Downloads/index.html, can't bookmark it, and gets a stale copy the moment you change anything.

The workarounds, honestly assessed

Cloud storage links (Drive, Dropbox, OneDrive)

These mostly force a download or show a preview of the source code rather than rendering the page. Google Drive removed its ability to serve web pages years ago. Useful for handing over a file, useless for showing a page.

Code sandboxes (CodePen, JSFiddle, CodeSandbox)

These do render your page, and they're great for sharing a snippet with another developer. But the visitor lands in an editor UI with your code beside the result, which is wrong for showing a client a landing page or sending a relative an invitation.

A data URI

You can technically encode a whole page into a data:text/html;base64,... URL. Don't: modern browsers block top-level navigation to data URIs precisely because it was used for phishing, and the resulting link is thousands of characters long.

Publishing it

The thing every one of these is approximating: put the file where the web can serve it, and send a normal URL. It opens in any browser on any device, renders as designed, can be bookmarked and forwarded, and updates when you update it.

Getting a URL in about a minute

Using hdply:

Drop your index.html in, or paste the code.
Pick an address — proposal.hdply.com, maria-and-sam.hdply.com.
Save, copy the link, send it.

You can do this without an account to test it; those trial sites expire after an hour. With a free account the address is yours, and editing the page later updates what everyone sees at the same link — no "please ignore the last attachment, here's v3".

One thing to prepare first, because one-file hosting means exactly one file. Check your HTML for references to files sitting next to it on your disk:

<!-- these arrive broken, because you only sent the HTML -->
<link rel="stylesheet" href="style.css">
<script src="app.js"></script>
<img src="images/portrait.jpg">

<!-- these travel fine -->
<style> body { font-family: system-ui; } </style>
<script> /* ... */ </script>
<img src="https://images.example.com/portrait.jpg" alt="Portrait">

Paste the CSS and JS inline, and move images to a URL or embed small ones as data URIs. If your page is genuinely a folder of files, a Git-based host is the better fit — see the comparison.

Sharing the link once you have it

A few things make a URL easier for other people to use:

Choose a readable subdomain. maria-and-sam.hdply.com survives being read aloud over the phone; a random string doesn't.
Send the full https:// URL in emails and documents. Some clients won't linkify a bare hostname, leaving your recipient to type it.
A QR code for anything physical — a poster, a slide, a business card. Generate one from the URL; it saves people transcribing it.
Skip the link shortener unless you need click counts. Shorteners hide the destination, which makes cautious recipients less likely to click, and they add a service that can disappear and take your link with it.

Before you send it

Open the link on a phone. This catches layout problems immediately — see making a page mobile-friendly.
Paste the link into a chat with yourself. If you get a blank grey box instead of a title and image, you're missing Open Graph tags. For something you're sending to a client, that preview is the first impression.
Decide whether search engines should find it. A private proposal shouldn't be indexable. hdply keeps sites out of search by default and lets you opt each one in.

Common questions

Can I password-protect it? Not with static hosting alone — anything enforced in client-side JavaScript is trivially bypassed by viewing source. Treat a static URL as "unlisted, not secret": hard to guess, but public to anyone who has it. For genuinely confidential material, use a service with real access control.

Will the link keep working? On a free account with a claimed subdomain, yes — it stays until you delete it. Anonymous trial sites are deliberately temporary.

Can I see if they opened it? Yes, at the level of visits and unique visitors — see tracking visitors. You won't get "Maria opened it at 14:02"; static hosting doesn't identify people, and you shouldn't build on the assumption that it could.