HTML Minifier

How do you minify HTML and check the result?

Paste markup into HTML Input, choose which comments to retain, and click Minify HTML. You get compact source plus counts of removed comments and changed whitespace runs. For a reproducible example, use the following input with Conditional + license (default). The example has four lines, two spaces before the paragraph, and three spaces between Hello and world. Do not add a trailing newline when comparing byte counts.

<!-- note -->
<div>
  <p>Hello   world</p>
</div>

The output is:

<div><p>Hello world</p></div>

Results for the exact ASCII example above

Summary field	Result	Meaning
Comments removed	1	The ordinary note comment is discarded.
Whitespace runs collapsed	4	Three line-break runs disappear and the word separator shrinks.
Optional quotes removed	0	This tokenizer does not remove attribute quotes.
Original / Minified	49 / 29 bytes	Both values measure UTF-8 encoded source.
Saved	20 bytes (41%)	The percentage is rounded to a whole number.

This small input demonstrates the mechanism rather than predicting your file's savings. A file already written compactly may change very little. Copy the result into a separate working file and inspect it with the stylesheet and scripts that normally accompany it before replacing a production artifact.

What does HTML minification remove here?

The transformation has two main jobs: filter HTML comments according to your selection and reduce ordinary text whitespace. It does not reconstruct the document through a browser DOM or rewrite every tag into a canonical form. Opening and closing tag source is retained, including attribute values, attribute quotes, and spacing within the tag itself. A quoted greater-than sign in an attribute does not prematurely terminate that tag.

In ordinary text, the whitespace set is tab, newline, form feed, carriage return, and the regular space character. A run normally becomes one space. Whitespace at the outer source boundaries is removed, as is a whitespace-only text token whose neighboring tags are both in the recognized block-tag set. Examples of recognized tags include div, p, section, li, table, and td. This is a fixed name list, rather than a calculation of computed display styles.

The tool leaves entity spellings and attribute values as supplied; it does not shorten them to chase a smaller byte count. Keep the original readable source for maintenance. The compact result is a derived artifact, and removing indentation makes subsequent manual edits harder to review.

Which comment policy should you choose?

Keep comments offers five choices. Conditional + license (default) retains both recognized marker types while removing ordinary HTML comments. None removes all HTML comments encountered by the tokenizer. License retains only comments beginning with <!--! or <!--/*!. Conditional retains comments beginning with <!--[if, matched without case sensitivity. All retains every HTML comment it encounters.

Recognition is based on these exact opening patterns. A comment that merely contains the word license somewhere in its text is not automatically protected. A space between the opening comment delimiter and the exclamation mark also changes whether it matches. If you need every notice or template marker regardless of syntax, select All and review the remaining whitespace changes separately.

Comments can be meaningful to downstream processing even when they are invisible in ordinary rendering. Before removing them from generated templates, check whether another processing stage expects those markers. The policy is not a legal assessment of which notices you must retain; it is a source filtering rule you control.

How are inline spaces and preformatted text handled?

Inline separation is preserved conservatively. For example, <span>Hello</span> <span>world</span> becomes <span>Hello</span> <span>world</span>. The words keep one separating space. In contrast, a whitespace-only separator between two div elements is removed because both neighboring tags are recognized as block tags.

Whitespace within a pre element is preserved, but actual HTML comments inside it still follow Keep comments. For example, <pre>a<!-- note --> b</pre> becomes <pre>a b</pre> under the default policy: one comment is removed and zero whitespace runs collapse. Use escaped delimiters when you intend to display a literal comment as example code rather than include an actual HTML comment.

CSS can make either rule significant. A div styled as inline-block may depend on inter-element whitespace, while a paragraph using white-space: pre-wrap may depend on repeated text spaces outside a pre element. The tokenizer does not read stylesheets or evaluate those declarations. Test text flow, navigation spacing, and any layout that deliberately relies on source whitespace.

How does minification interact with CSS and JavaScript?

Script, style, and textarea elements are copied through their matching closing tags with their contents unchanged. Strings, comments, indentation, and line breaks in those regions are not reduced. A large inline stylesheet or script can therefore dominate the output size even after ordinary HTML comments and layout whitespace have been removed.

Style attributes and event-handler attributes also remain unchanged because all tag source is preserved. This tool does not offer a switch to minify those embedded languages. Use the CSS Minifier for CSS source you want to process separately. The JS Beautifier is useful when you need to inspect JavaScript before deciding how to integrate it.

Do not interpret an unchanged script block as a failed HTML run. Read the summary alongside the source: zero removed comments or very small savings can be correct when most of the input belongs to protected regions.

When is HTML minification effective, and what do savings mean?

Generated pages with repeated indentation and ordinary comments provide more removable material than compact snippets. Template output, static page exports, and repeated layout sections are useful candidates for a manual comparison. There is no fixed saving percentage: the result depends on the exact source and selected comment policy. Switching to All may reduce savings while preserving markers you need.

Original and Minified measure UTF-8 bytes using TextEncoder. This differs from counting letters on screen when the source contains accented characters, symbols, or emoji. Whitespace runs collapsed counts changed runs, not characters removed. One long indentation sequence and one short repeated-space sequence each count as a single changed run.

The Saved percentage is rounded from saved bytes divided by original bytes. It does not measure compressed transfer, request overhead, rendering time, or loading performance. HTTP gzip or Brotli compression is a separate operation, and the download here is HTML rather than a compressed archive. Compare actual delivered files separately if network transfer is your goal.

What are the practical limits and export options?

Open HTML file reads a local file as text and checks that its name ends in .html, without case sensitivity. A .htm filename fails that check; paste its contents instead. There is no URL import or batch file control in this interface. Processing runs locally in the component's JavaScript path, and the implementation sets no explicit file-size ceiling. Large inputs still depend on available browser memory and processing time.

Changing HTML Input or Keep comments clears the previous result and summary. Click Minify HTML again to produce a result for the new settings. The button is disabled for an input containing only whitespace. If Paste is blocked by clipboard permissions, use the normal Ctrl/Cmd+V shortcut inside the input field.

Copy places the output text on the clipboard. Download HTML creates a UTF-8 HTML file: an imported page.html becomes page.min.html, and page.min.html stays page.min.html rather than gaining another min suffix. The Paste button sets the source name to document.html. The source file itself is not overwritten.

How does this differ from aggressive HTML optimization?

This tool focuses on comment selection and whitespace reduction. It retains optional closing tags, boolean attribute syntax, and attribute quotes. The Optional quotes removed counter remains zero. It does not validate or repair malformed HTML, resolve template expressions, or compare rendered screenshots. A compact output therefore does not certify that the source is valid or that every application behavior is unchanged.

Use it for a controlled, reviewable transformation of a snippet or local export. Keep your editable templates, test the downloaded output with its real assets, and automate repeated production work in your existing build process when appropriate. For changing the document's representation rather than its size, use HTML to Markdown; that conversion serves a different purpose and does not preserve HTML source structure.