HTML Minifier and Compressor Online

Use this HTML minifier to minify or compress page markup and speed up delivery. Write, paste or upload your HTML, select compression options, and get a minified markup file. The tool strips unnecessary bytes while keeping scripts and styles working, so pages load faster on mobile and desktop.

Core capabilities

  • Compress HTML by removing extra whitespace and redundant characters
  • Remove comments and optional closing tags to cut file size
  • Minify inline CSS and inline JavaScript when enabled
  • Collapse boolean attributes and drop empty attributes safely
  • Convert absolute links to relative links using a base if you provide one
  • Option to preserve single line breaks for readability when needed
  • Keep important markup intact so behavior and layout remain unchanged
  • Run entirely in your browser so no server upload is required

How to use this onlin HTML Compressor?

  1. Paste, drag, or open your HTML in the editor
  2. Enable options like inline CSS or JS minify
  3. Select trimming rules for comments and tags
  4. Click Minify HTML to get optimized output
  5. Preview, then copy or download the compressed file

Why use an HTML Minifier or Optimizer?

Smaller HTML reduces bandwidth and improves perceived performance. Faster markup lowers time to first meaningful paint and first contentful paint which helps user experience and search engine performance. You can also use an HTML5 formatter before minifying to ensure clean and consistent markup for debugging.

Minification also helps when you bundle many components and want consistent production builds. For mobile users and slow networks the savings are often most noticeable.

Key differences: original HTML Vs Minified Markup

  • Original HTML is readable with clear spacing and comments
  • Minified HTML removes comments and extra spacing to reduce bytes
  • Optional tags may be removed where safe to do so
  • Functionality and rendering remain the same when minification is correct

Example 1: Simple page

Original HTML

Copy
HTML Markup Size Before Minification: 0.34 KB
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Sample Page</title>
    <style>
      body { font-family: Arial, sans-serif; margin: 20px; }
    </style>
  </head>
  <body>
    <!-- Main header -->
    <h1>Welcome</h1>
    <p>This is a sample page that demonstrates HTML before compression.</p>
  </body>
</html>

Minified HTML

Copy
HTML Markup Size After Minification: 0.21 KB
<!doctype html><html lang=en><meta charset=utf-8><title>Sample Page</title><style>body{font-family:Arial,sans-serif;margin:20px}</style><h1>Welcome</h1><p>This is a sample page that demonstrates HTML before compression.

Example 2: Inline CSS and JS

Original HTML

Copy
HTML Markup Size Before Minification: 0.29 KB
<html>
  <head>
    <style>
      .btn { padding: 10px 20px; background: #007acc; color: #fff; }
    </style>
    <script>
      function greet() {
        console.log("Hello world");
      }
    </script>
  </head>
  <body>
    <button class="btn" onclick="greet()">Click</button>
  </body>
</html>

Minified HTML

Copy
HTML Markup Size After Minification: 0.17 KB
<style>.btn{padding:10px 20px;background:#007acc;color:#fff}</style><script>function greet(){console.log("Hello world")}</script><button class=btn onclick=greet()>Click</button>

Customization options

The minifier provides flexible options so you can control how aggressively the HTML is reduced. Pick the combination that matches your workflow and testing strategy.

OptionDefaultDescription
Case MatchFalseTreat tags and attributes as case sensitive when true
Minify CSSTrueCompress inline style blocks and style attributes
Minify JSTrueCompress inline scripts and event handler code
Strip CommentsTrueRemove HTML comments from the output
Strip QuotesTrueDrop safe attribute quotes when allowed by HTML rules
Keep BreaksFalsePreserve one line break in places where it improves readability
Strip Empty AttrsTrueRemove attributes that have no value
Collapse BooleansTrueOmit values for boolean attributes such as checked or disabled
Collapse SpaceTrueReduce redundant whitespace without altering inline text where it matters
Inline WhitespaceFalseCollapse space between inline elements when safe
Strip Tag SpaceFalseRemove space between tags and attributes to shrink markup
Safe CollapseFalseConsolidate multiple spaces to one while preserving layout where needed
Decode EntitiesFalseConvert certain HTML entities back to characters
Omit TagsTrueRemove optional closing tags where HTML rules allow it
Keep SlashFalseRetain trailing slash on self closing tags for compatibility
Minify URLsemptyBase URL to rewrite absolute links to relative when provided
No Attr EscapeFalsePrevent escaping of characters inside attribute values
Handle IE CommentsFalseProcess conditional comments used for legacy Internet Explorer support
Quote StyleDouble QuoteChoose double or single quote for attribute values in output
Ignore RegexemptyFragments that match this pattern will not be altered
Strip Empty TagsFalseRemove elements that have no content and no attributes
Strip DefaultsTrueRemove attributes that match default values in HTML specifications
Strip Script TypeTrueRemove type attributes from script tags for modern HTML
Strip Style TypeTrueRemove type attributes from style and link tags when safe

Best practices

  • Keep a readable source and use minified files in production
  • Test inline CSS and JS before minifying
  • Use source maps for complex scripts
  • Check third-party scripts before minification
  • Test pages on mobile after compression
  • Automate minification in your build pipeline

Conclusion

This HTML minifier and compressor helps you reduce and minify HTML output and improve load times. Choose the right balance of options for your site and test the result across devices.