Back to blog

Share HTML Prototypes with Clients Without Deploying Anything

Stop zipping files and deploying staging servers just to get client feedback. Learn the fastest ways to share HTML prototypes, from email attachments to purpose-built tools like Handoff.

H
Handoff
· · 8 min read

Share HTML Prototypes with Clients Without Deploying Anything

You have built something. Maybe it is a landing page concept, a UI component, an HTML slide deck for a pitch, or a full interactive prototype you coded up in an afternoon. Now you need to show it to a client, get feedback, and iterate.

This is the moment where the momentum dies.

Instead of talking about the design, you are suddenly troubleshooting deployment pipelines, configuring DNS, or writing an email that says "please open the attached ZIP file, extract it, and then open index.html in your browser." Your client, understandably, does not do that.

If you are a frontend developer or designer who regularly shares work-in-progress with clients, you know how much friction sits between "it works on my machine" and "here, take a look." This post breaks down the common approaches, their tradeoffs, and a faster path that does not require deploying anything at all.

The Problem: Sharing Should Be Simple, But It Never Is

Client review workflows are surprisingly broken. The core task is straightforward: you have an HTML file and you want another person to see it in their browser. But the gap between having a file on your machine and giving someone a reliable link is filled with unnecessary steps: zipping files, deploying staging servers, pasting screenshots into Google Docs. Every one of these adds friction between finishing the work and getting feedback on it.

Common Approaches (and Where They Fall Short)

Let's walk through the tools people typically reach for and where each one starts to break down.

Email Attachments

The oldest method. You attach the HTML file (or a ZIP of the project folder) directly to an email. Zero tools required.

The problems are significant. Many email providers block HTML attachments for security reasons. Even if delivery works, the recipient has to save the file, find it in their downloads, and open it manually. Anything that relies on a web server (AJAX calls, ES modules, relative font paths) will break when opened as a local file. And there is no version trail. When you send a second iteration, it is just another attachment in another email, disconnected from the first.

CodePen and JSFiddle

These tools are fantastic for sharing isolated code snippets and small demos. If your prototype fits into a single HTML/CSS/JS view, they work well. The shareable URLs are instant, and the client does not need an account to view them.

But they fall apart for anything beyond a single-file demo. Multi-file projects with separate stylesheets, JavaScript modules, or image assets do not map cleanly to the CodePen model. The editing interface is also visible by default, which can confuse non-technical clients who just want to see the result, not the code behind it. And there is no built-in concept of versions or iterations. Each save overwrites the previous state.

GitHub Pages

GitHub Pages gives you a proper hosted URL for free. For long-lived projects and documentation sites, it is a solid choice.

For quick prototype sharing, though, the overhead is real. You need a repository, you need to push changes, configure Pages settings (or set up a GitHub Action), and then wait for the build. The URL is tied to your GitHub username and repo name, which you may not want to expose to a client. Every iteration means another commit-push-wait cycle. It is a deployment tool. When you just need to share a file, deployment is more ceremony than the task requires.

Figma

Figma dominates design review workflows, and for good reason. Commenting, version history, and multiplayer collaboration are best-in-class. If your prototype lives in Figma, sharing it is seamless.

The limitation shows up when your prototype is actual code. Responsive breakpoints, real data rendering, scroll behaviors, CSS animations: these exist in code but not in a Figma frame. If you have already built the thing in HTML, going backward to Figma means recreating work or losing fidelity. Figma is the right tool for design-stage review. For code-stage review, you need something that serves the actual HTML.

Dedicated Quick-Hosting Tools

This is the category that has grown fastest in the past couple of years. Tools like Tiiny.host, PageDrop, and Handoff exist specifically to solve the "I have a file, I need a link" problem.

The general workflow: you upload an HTML file (or drag and drop it), and you get a shareable URL back within seconds. No Git, no CI/CD, no DNS configuration. The file is served over HTTPS, so everything that depends on a proper web server context works correctly.

Where these tools differ is in the details. Some have file size limits, some expire links after a set period, some require accounts, and some include features like versioning that matter a lot for iterative client work.

What an Ideal Prototype-Sharing Workflow Looks Like

Before picking a tool, it helps to define what "good" actually looks like for this use case:

  1. Speed. Going from "file on your machine" to "link in your client's browser" should take seconds, not minutes.
  2. Fidelity. The client should see exactly what you built. The real HTML, rendered in a real browser.
  3. Clean viewing experience. No code editors, no deployment dashboards. Just your prototype on whatever device the client is using.
  4. Versioning. When you share version two, the client should be able to compare it to version one. No more prototype-v2-final-FINAL folders.
  5. No friction for the viewer. No account required. No software to install. Just a link that works.

How Handoff Fits This Workflow

Handoff was built around this exact problem. It gives HTML pages, Markdown documents, and images instant shareable URLs with built-in version control.

Here is what the workflow looks like in practice:

You upload your HTML file. You get a clean URL at handoff.host/@yourname/prototype-name. You send that link to your client. They open it and see your prototype, rendered properly, responsive on whatever device they are using. No extraction, no deployment, no waiting.

When you make changes and upload a new version, Handoff tracks the iteration automatically. Your client can see the current version and browse the history of previous versions. This is the part that matters most for prototype review: the conversation shifts from "which version are we looking at?" to actually discussing the design.

A few specifics worth noting:

  • URL structure is human-readable. handoff.host/@studio/homepage-v2 is something you can put in a Slack message or a project brief without it looking like a random hash.

  • The viewer is clean. Clients see your work in a responsive interface. No code editors, no dashboards, no distractions.

  • It is free during the beta. No credit card, no trial limits. You can use it right now.

  • It handles more than HTML. If you need to share a Markdown spec alongside your prototype, or include image assets, the same tool covers all three.

Versioning Changes the Client Conversation

Without versioning, every share is a standalone event. You email "prototype_v3.html" and the client opens it. A week later, they want to revisit the first version. Where is it? Maybe in an old email thread. Maybe lost.

With versioning built into the URL, the history is always accessible. Version one, version two, version five: they all live at the same address, with a clear timeline. This matters in the messy reality of client work, where feedback cycles stretch over weeks and stakeholders join conversations late.

It also protects you. When a client says "I liked the first version better," you can point them to it directly instead of digging through Git history or folder backups.

Choosing the Right Approach for Your Situation

Not every tool is wrong. The right choice depends on what you are sharing and who you are sharing it with.

Use CodePen or JSFiddle when you are sharing a single-component demo with a technical audience who understands those tools.

Use GitHub Pages when the project is long-lived, the repository is already set up, and you need persistent hosting with CI/CD integration.

Use Figma when you are still in the design phase and the work has not been coded yet.

Use Handoff when you have an HTML prototype (or a set of files) that you need a client to see right now, with version tracking for the iterations that will follow.

The common mistake is using a heavyweight tool for a lightweight task. Match the tool to the task.

Getting Started

If you are in the middle of a project right now and have a prototype sitting on your machine waiting for client feedback, try the simplest path first:

  1. Go to handoff.host.
  2. Upload your HTML file.
  3. Copy the URL.
  4. Send it.

That is the entire workflow. No environment variables, no build step, no YAML configuration. Your client gets a working link, you get version tracking for free, and you can both get back to the part that actually matters: making the design better.

Ready to share your work?

Upload a file, get a link. Free during beta.

Start Sharing Free