<style> and <script> blocks. Typical pages shrink 20–35% pre-gzip. Use it on static pages, email templates, and AMP documents — but skip it on server-rendered HTML where bytes matter less than build complexity. Our free HTML minifier runs html-minifier-terser in your browser with safe defaults you can override.HTML is the easiest place to leave bytes on the floor. Hand-authored markup carries indentation, comments, optional closing tags (</li>, </p>), and quoted attributes that could be unquoted. A 112 KB hand-written page minifies to 78 KB (−30%); add gzip and you’re at roughly 18 KB on the wire. For a marketing landing page or an email template that ships unchanged for months, those savings compound across every visit.
Our HTML minifier wraps html-minifier-terser — the de-facto Node.js engine since 2017 — and runs it entirely in your browser. It minifies inline CSS via csso and inline JS via Terser, both included. This guide covers what’s safe to strip, what to leave alone, and the gotchas that turn perfectly valid HTML into broken markup.
What HTML minification removes (and the size impact)
| Transform | Example | Savings |
|---|---|---|
| Collapse whitespace | Indentation between tags | 10–25% |
| Remove comments | <!-- ... --> |
2–8% |
| Drop optional tags | </li> at end of <li> |
1–3% |
| Unquote attributes | id="x" → id=x |
1–2% |
| Drop redundant attrs | type="text" on <input> |
<1% |
| Boolean attribute collapse | disabled="disabled" → disabled |
<1% |
| Minify inline CSS | csso on <style> blocks |
3–10% (depends on CSS) |
| Minify inline JS | Terser on <script> blocks |
3–8% (depends on JS) |
Safe vs aggressive: which options to enable
html-minifier-terser exposes about 30 boolean flags. Most are safe; a handful change rendering or break edge cases. Our default preset turns on these safe options:
collapseWhitespace— strip indentation between tags. Won’t collapse whitespace inside<pre>,<textarea>, or content marked withwhite-space: pre.removeComments— strip<!-- ... -->. Preserves IE conditionals (<!--[if IE]>) and lines marked with<!-- ! -->.removeRedundantAttributes— dropstype="text",method="get", etc.collapseBooleanAttributes—checked="checked"→checked.minifyCSS+minifyJS— minify inline blocks.
Options to enable only with care:
removeOptionalTags— drops</li>,</p>,</td>. Valid HTML5 but breaks XML-strict tooling and some legacy parsers.removeAttributeQuotes— saves a few bytes but breaks if an attribute value contains spaces or special characters.conservativeCollapse— preserves a single space at edges where collapsing might affect rendering. Safer but smaller savings.
How to minify HTML in your browser
- Open the HTML minifier
- Paste your HTML or drop in an
.htmlfile - Pick the preset: Safe (default), Aggressive, or Email-template-safe
- Click Minify — output appears with before/after sizes
- Copy or download as
.min.html
Email-template gotchas
HTML emails are the wild west: Outlook 2016 still parses HTML4 with quirks, Gmail strips <style> blocks under certain conditions, and Apple Mail rendering disagrees with iOS Mail in subtle ways. Aggressive minification breaks emails in ways that don’t show up in DesktopGmail but break in Outlook. Use the Email-template-safe preset, which:
- Keeps all attribute quotes (Outlook chokes on unquoted)
- Preserves IE conditional comments (
<!--[if mso]>) - Doesn’t drop optional tags
- Doesn’t minify inline CSS (some clients require expanded CSS)
- Preserves
<!--[if !mso]>andmso-*proprietary attributes
Test minified email templates with Litmus or Email on Acid before sending; visual inspection in Gmail web won’t catch Outlook breakage.
Common gotchas
- Whitespace inside
<pre>and<textarea>is significant. Minifiers preserve it by default; verify your output if you’ve added unusual elements withwhite-space: prestyling. - Inline templates (Vue, Handlebars, JSX) can break. Whitespace between adjacent text nodes carries meaning in some templating languages. Minify the rendered output, not the template source.
- Attribute order changes. Some minifiers reorder attributes alphabetically. If you have CSS or JS that depends on attribute order (rare but real), turn that off.
- JSON-LD inside
<script type="application/ld+json">is preserved. Minifiers shouldn’t touch JSON-LD content, but a buggy minifier may strip its leading whitespace and break parsing. Verify schema validates after minifying. - Don’t minify HTML you’ll edit later. Minified HTML is unreadable. Keep the source, generate the minified output as a build artefact, and never commit minified HTML to your repo unless that’s your only deployment artefact.
- Multi-byte characters get corrupted by some legacy minifiers. html-minifier-terser handles UTF-8 correctly. Older “html-tidy” tools strip emoji and non-Latin characters silently.
When NOT to use a browser HTML minifier
For server-rendered apps (Next.js, Nuxt, Remix, SvelteKit, Astro), HTML minification is automatic in production builds. For static site generators (Eleventy, Hugo, Jekyll), it’s a single config flag. For email templates, install html-minifier-terser locally and run it as part of your build with the email-safe preset baked in. Use this browser tool for one-off pages, snippets pasted from a CMS, AMP pages prepared by hand, and email templates you edit visually.
Frequently asked questions
Is minified HTML still valid?
Yes — html-minifier-terser produces valid HTML5. Even with optional-tag removal, the output passes the W3C validator. The exception is removeAttributeQuotes, which produces non-quoted attribute values that some old browsers (IE6/7) don’t handle correctly. Stick to the safe preset for maximum compatibility.
How much will gzip add on top of HTML minification?
Roughly another 60–70%. A 78 KB minified HTML file gzips to about 22 KB. HTML compresses extremely well because of repeated tag names and attribute values. Always serve .html with Content-Encoding: gzip or br.
Will minification break my Schema.org JSON-LD?
No — html-minifier-terser preserves <script type="application/ld+json"> contents intact. The JSON inside is passed through unchanged. If your schema breaks after minifying, the issue is elsewhere — usually whitespace stripping outside the script tag concatenating two adjacent script blocks.
Can I minify HTML emails for Mailchimp or SendGrid?
Yes, but use the email-template-safe preset. Modern email clients tolerate minified HTML, but Outlook 2016 and earlier choke on unquoted attributes and missing optional tags. Test in Litmus before sending.
Is my HTML uploaded?
No. The minifier runs in your browser via WebAssembly. Pasted markup never reaches our servers — useful when minifying pre-release pages, internal docs, or email templates with proprietary content.
What’s the difference between an HTML minifier and a CSS minifier?
HTML minifiers strip whitespace and tags from markup; CSS minifiers strip whitespace and shorten selectors inside stylesheets. Our HTML minifier also minifies inline <style> and <script> blocks, so for a single HTML file with embedded CSS/JS, one pass through the HTML minifier handles everything.
Related tools and guides