Minify
HTML Minifier
An HTML minifier is for when the template is done and you still want fewer bytes on the wire. Paste a fragment, watch comments and extra space disappear, copy something you can still read enough to trust.
Drop a file on the left. Drafts stay in this browser. Shortcut: Ctrl or Cmd + Enter to run.
How this html minifier works
- Paste or drop a .html file into the input on the left.
- Flip options if you see them (comments, indent, case). Defaults are the safe ones.
- Hit Run, or Ctrl / Cmd + Enter. Leave “Process on server” off unless you mean it.
- Read the status line, then copy, download, or jump to a related tool.
What HTML minification actually changes
Mostly subtraction. Comments (except the dusty IE conditionals you still need), extra space between block tags, leftover line breaks. The DOM should parse the same. If the page “looks different,” you probably crushed a space that an inline tag was using as a gap — a link and a period, two <a> tags sitting next to each other.
This pass is conservative on purpose. It will not rename classes, inline your CSS, or flip every experimental flag in html-minifier-terser. Emails, CMS snippets, and static includes hate “clever.”
When to minify HTML (and when to wait)
Do it when the HTML is going live: a static export, a newsletter table, a widget embed. Do not live in minified HTML. Keep the readable file in git. Minify in a build step — or here, when you do not have a step.
Gzip, images, and JavaScript still move the needle more than HTML whitespace. Use this to stop putting tutorial comments and forty blank lines on the live page. That is the job.
A simple loop
Paste. Leave “remove comments” on unless you need those IE conditionals. Hit Run. Read the savings line. If CSS and JS live inside the same file, the mixed HTML/CSS/JS minifier will touch nested <style> and <script> in one go.
Apps with a bundler should keep minifying there. A one-off landing page or a support article with a sample? This editor is the whole pipeline, and that is fine.
Frequently asked questions
What does an HTML minifier remove?
Mostly comments and extra whitespace between tags. <header>\n <h1>Hello</h1>\n</header> becomes <header><h1>Hello</h1></header>. Your browser already treats those line breaks as optional. What it must not eat: the text inside <pre>, <textarea>, and usually <script> / <style> blocks that are not “HTML-shaped.”
Can minifying HTML break my layout?
Yes — when a space was doing layout work. <a>Docs</a> <a>API</a> has a real gap. <a>Docs</a><a>API</a> does not. Inline elements, punctuation after links, and display: inline-block gutters are the usual suspects. Block elements (div, p, header) almost never care.
HTML minify vs gzip — which one shrinks the page?
Both, in different rooms. Minify deletes comments and pretty spaces from the file. Gzip then crushes repeated tags like <div across the whole response. A 40 KB template might become 28 KB minified and ~8 KB on the wire. Skipping minify still gzips; skipping gzip wastes more than skipping minify.
Should I minify HTML emails?
Carefully. Email HTML is a museum of table layouts. Some clients are picky about comments you were using as Outlook conditionals (<!--[if mso]>). Strip regular <!-- notes -->. Keep the conditional comments if you still support that dinosaur.
Is it safe to minify inside <pre> and <code>?
Leave <pre> and <textarea> alone. That whitespace is content — indentation in a code sample, poetry, ASCII art. A minifier that collapses it turns a tutorial into a single embarrassing line.
Any fun HTML whitespace fact?
Fun fact: HTML was designed so authors could indent source without indenting the webpage. That is why two spaces in your .html file are not two spaces on screen — except when the spec says they are, which is exactly the inline-gap trap above.
Do I minify HTML in development or only for production?
Keep pretty HTML while you edit. Minify the artifact you deploy or embed. If the minified file is the only copy you have, you will hate future-you. Same rule as CSS and JS, friendlier than JS because you are less likely to hit ASI bugs.
What about HTML with CSS and JavaScript in the same file?
A mixed file needs three different rules: HTML space between tags, CSS comments in <style>, JS comments in <script>. The combined HTML/CSS/JS minifier exists for that paste. A pure HTML minifier should not “cleverly” rewrite your jQuery.