Ttooleras
📦

HTML Minifier

Minifiers

Compress HTML by removing whitespace, comments, optional tags — 20-40% smaller. Free, private — all processing in your browser.

Advertisement

The HTML Minifier compresses HTML by removing unnecessary whitespace, comments, and optional closing tags — typically shrinking files by 20-40%. HTML has more built-in redundancy than CSS or JavaScript, so minification gains are smaller, but still meaningful for performance. Remove inter-tag whitespace (spaces between elements that do not affect rendering), strip HTML comments (except important ones like conditional comments for IE), optionally remove optional closing tags, and collapse boolean attributes. The output is valid HTML ready to serve or include inline.

HTML minification is most valuable for server-rendered pages (PHP, Rails, Django, server-side Next.js) where HTML is generated per request. A 50KB HTML page minified to 30KB saves bandwidth on every request, improves Time to First Byte (TTFB) and Largest Contentful Paint (LCP), and reduces CDN costs at scale. Less critical for single-page apps (where HTML is one small shell file), but always worth doing for SEO-heavy pages like blog posts, product listings, and documentation.

HTML Minifier — key features

Whitespace removal

Removes inter-tag whitespace, indentation, blank lines. Preserves whitespace in pre, textarea, code.

Comment removal

Regular comments removed. Conditional comments and license comments preserved.

Optional tag closure

Optional: remove closing tags where HTML5 allows. Controversial — off by default.

Boolean attribute shortening

disabled=disabled becomes just disabled. Required for HTML5.

Empty attribute removal

Empty attributes removed when they match default values.

Script and style preservation

Contents of script and style tags preserved exactly. Use JS/CSS minifier separately.

Size comparison

Shows before/after size and savings percentage.

100% client-side

Your HTML stays in browser. Nothing uploaded.

How to use the HTML Minifier

  1. 1

    Paste HTML

    Source HTML — can be full page, email template, or fragment.

  2. 2

    Configure options

    Preserve comments? Remove optional tags? Boolean attribute shortening?

  3. 3

    Click Minify

    Minified HTML appears with size stats.

  4. 4

    Review savings

    Typical 20-40% reduction. Verify output is valid HTML.

  5. 5

    Copy or download

    Copy to clipboard or download as .html file for production deploy.

Common use cases for the HTML Minifier

Static sites

  • →Build output optimization: Minify HTML at build step. Smaller files on CDN, faster loads.
  • →Blog post compression: Long articles benefit more from HTML minification than short pages.
  • →Documentation sites: Technical docs have lots of markup overhead. Minification helps.
  • →Marketing landing pages: Every byte matters for conversion. Minification improves page speed.

Server-side

  • →PHP and WordPress sites: Templates produce verbose HTML. Minify before sending to client.
  • →Django and Flask templates: Server-rendered templates — minify in response middleware.
  • →Rails ERB: Rails ActionPack can minify output. This tool for ad-hoc needs.
  • →ASP.NET pages: MVC and Razor pages — minify before serving.

Email

  • →Transactional email templates: Smaller emails transfer faster and avoid size limits.
  • →Marketing campaigns: Bulk email sending at scale — every KB costs bandwidth.
  • →Inline CSS emails: Email HTML has lots of inline CSS. Minify the CSS separately, then minify HTML.

Performance

  • →Reduce TTFB: Smaller HTML sends faster. Time to First Byte improves.
  • →Core Web Vitals: LCP (Largest Contentful Paint) benefits from smaller HTML.
  • →Mobile optimization: Mobile users on slow connections see dramatic improvement.
  • →CDN cost reduction: High-traffic sites save significantly on CDN bandwidth.

HTML Minifier — examples

Basic HTML minification

Typical page markup.

Input
<!DOCTYPE html>
<html>
  <head>
    <title>Page</title>
  </head>
  <body>
    <h1>Hello</h1>
    <p>World</p>
  </body>
</html>
Output
<!DOCTYPE html><html><head><title>Page</title></head><body><h1>Hello</h1><p>World</p></body></html>

Size: 95 bytes to 70 bytes (26% smaller)

With comments removed

Regular comments stripped.

Input
<!-- Header section -->
<header>
  <!-- Logo -->
  <img src="logo.png">
</header>
Output
<header><img src="logo.png"></header>

Boolean attributes

Disabled shortened.

Input
<input disabled="disabled" required="required">
Output
<input disabled required>

Pre content preserved

Whitespace in code blocks kept.

Input
<p>Code:</p>
<pre>function hello() {
    return 1;
}</pre>
Output
<p>Code:</p><pre>function hello() {
    return 1;
}</pre>

Script preserved

JavaScript content not touched.

Input
<script>
  function foo() {
    return 42;
  }
</script>
Output
<script>
  function foo() {
    return 42;
  }
</script>

(Minify JS separately with JavaScript Minifier.)

Real-world savings

Server-rendered page.

Input
WordPress blog post HTML (50KB with indentation)
Output
Minified: 32KB (36% smaller)
Gzipped: 8KB (84% total reduction vs source)

Technical details

HTML minification is less aggressive than CSS/JS minification because HTML has more whitespace-sensitive contexts (pre, textarea, inline elements).

Whitespace handling:

HTML whitespace collapses in most contexts but matters in:
- pre tags — preserves exactly
- textarea — preserves content
- Text between inline elements — space matters
- script, style — contents preserved verbatim

Safe to remove:
- Whitespace between block-level elements
- Whitespace at start/end of block elements
- Indentation
- Extra whitespace in attribute values

Comment removal:

- Regular comments removed
- Conditional comments for IE preserved
- Comments starting with exclamation mark (convention for license/important) preserved

Optional closing tags:

HTML5 allows omitting some closing tags (li, p, tr, td, option). Removing is valid per spec but reduces readability. Controversial — some minifiers do, some do not.

Attribute optimizations:

- Boolean attributes: disabled=disabled becomes just disabled
- Empty attributes removed when matching default
- Default type attributes (type=text on input) removed

Boolean attributes that can be shortened:

disabled, checked, selected, readonly, required, multiple, autoplay, controls, loop, muted, async, defer, hidden, contenteditable, draggable

What it preserves:

- Content of pre, code, textarea, script, style
- Conditional comments
- Attribute values with meaningful whitespace
- Text whose rendering depends on whitespace
- HTML5 doctype

Size reduction example:

Typical server-rendered HTML:
- Source: 50KB (with indentation, comments)
- Minified: 35KB (30% reduction)
- Gzipped: 10KB (80% total reduction)

When to minify:

- Server-rendered HTML — every request
- Static sites — at build time
- Email HTML — email clients re-process, but smaller is better
- Inlined HTML in JS strings

When not needed:

- SPA shells where HTML is 1-2KB
- Development — hard to debug minified HTML

Modern context:

Build tools (Next.js, Gatsby, Astro) handle HTML minification automatically. Raw HTML minification is for: old-school sites (PHP, WordPress themes without build pipelines), quick ad-hoc optimization, server-side frameworks without built-in minifier, email template production.

Common problems and solutions

⚠Whitespace between inline elements

Inline elements with text between them need whitespace preserved. Removing can destroy visible spacing. Good minifiers know this — aggressive ones may break it. Test before deploying.

⚠Email client quirks

Outlook and some webmail clients reprocess HTML, undoing minification. Still minify — reduces transfer size and handles most clients.

⚠Conditional comments lost

IE conditional comments are parsed by old IE. Good minifiers preserve; verify if you need IE compatibility.

⚠Optional tag removal controversy

Removing li, p, tr, td closing tags is valid HTML5 but reduces readability. Hard to debug. Off by default.

⚠Script/style minification needs separate tool

Content of script and style tags is preserved verbatim. Minify JS with JavaScript minifier, CSS with CSS minifier separately.

⚠Attribute value whitespace

Title attribute with space like Click here — space is meaningful. Aggressive minifiers preserve quotes around such values; relaxed ones might remove. Check after minification.

⚠Multiple class names

class with extra spaces between classes collapses to single space — safe.

⚠Minified HTML looks broken

Minified HTML is hard to read — single line. Verify in browser dev tools. If page looks wrong, may indicate minification bug or legitimate whitespace issue.

HTML Minifier — comparisons and alternatives

HTML Minifier vs HTML Formatter: Minifier compresses. Formatter expands for readability. Opposite operations, lossless roundtrip.

HTML minification vs CSS/JS minification: HTML saves less (20-40%) than CSS (60-80%) or JS (30-50%). HTML has built-in structure that is hard to compress. Still worth doing for performance.

This tool vs html-minifier-terser: html-minifier-terser is a Node.js library used in build pipelines. More aggressive options. This tool is browser-based for ad-hoc needs.

Server-side minification vs build-time: Build-time is faster (minified files served from disk/CDN). Server-side adds CPU overhead per request. Static sites should minify at build.

Minification vs gzip: Minification removes characters. Gzip compresses bytes. Both together — minification enables more gzip savings (fewer patterns to compress around).

Modern framework minification: Next.js, Gatsby, Astro, Eleventy minify HTML automatically. This tool is for ad-hoc needs, older codebases, or frameworks without built-in minifier.

Frequently asked questions about the HTML Minifier

▶What does HTML minification do?

Removes unnecessary whitespace (spaces between tags, indentation), comments, and optional attribute values. Typically 20-40% smaller. Output is still valid HTML that renders identically to source.

▶Is minification lossless?

Yes for well-configured minifiers. Rendering is unchanged. However, debugging is harder with minified HTML. Keep source for development; serve minified for production.

▶How much can I save?

Typical 20-40% reduction. Less for already-compact HTML. More for verbose server-rendered output with lots of indentation and comments. Combined with gzip, total HTTP reduction reaches 70-85%.

▶When should I minify HTML?

Production deployments — always. Server-rendered pages benefit most (bandwidth savings per request). Static site builds — minify at build time. Development — no, keep source for debugging.

▶Will this break my page?

Generally no if you use safe defaults. Edge cases: inline element whitespace can cause visual issues if over-aggressive. Test before deploying. This tool preserves inline whitespace by default.

▶Is my HTML safe to paste here?

Yes. Minification happens in your browser. HTML never uploads. Safe for server-rendered pages with user data, internal templates, etc.

▶Should I minify email templates?

Yes, but beware email clients often reprocess HTML and may undo some minification. Still worth it — reduces initial transfer size.

▶Does it minify inline CSS and JavaScript?

No. Contents of style and script blocks are preserved verbatim. Use CSS Minifier and JavaScript Minifier separately on those contents before the HTML minification if needed.

▶Can modern build tools handle this automatically?

Yes. Next.js, Gatsby, Astro, Hugo, Jekyll, Eleventy, Webpack, Vite — all minify HTML in production mode. Use this tool for ad-hoc needs or projects without build pipelines.

▶What about email clients?

Modern clients (Gmail, Apple Mail, Outlook 365) handle minified HTML fine. Some older clients (Outlook 2010) reprocess and add whitespace anyway. Still minify — smaller transfer size is always better.

Additional resources

Advertisement

Related tools

All Minifiers
📦

CSS Minifier

Compress CSS to minimum size — remove whitespace, comments, shorten values

🏷️

HTML Entity Encoder/Decoder

Encode special characters to HTML entities (&amp;, &lt;, &quot;, &copy;) or decode entities back to their literal characters.

📄

HTML Formatter

Format, indent, and beautify HTML, XHTML, and HTML5 markup

📊

HTML Table to CSV

Convert HTML tables to CSV format for data analysis. Handles rowspan, colspan, and extracts clean tabular data.

📝

HTML to Markdown

Convert HTML to clean, readable Markdown preserving structure and formatting

📦

JavaScript Minifier

Compress JavaScript for production — Terser-style minification, 30-50% smaller

Learn more

Next.js App Router: A Complete Beginner Tutorial

26 min read

How to Decode a JWT: A Practical Debugging Guide (with the Base64URL Gotcha Nobody Warns You About)

17 min read

UUID v4 vs v7: The Default Has Quietly Changed

22 min read

Explore more tools

200+ free tools that run in your browser.

Browse all tools →