HTML 圧縮ツール（HTML Minifier）
HTML を貼り付けると、コメントと余分な空白を削除し、インラインの CSS と JavaScript も圧縮します。<pre> と <textarea> の内容は書かれたとおりに残します。
ブラウザ内で動作登録不要アップロードなし
圧縮結果
HTML 圧縮ツールの使い方
- HTML ドキュメントや断片を貼り付けるか、
.htmlファイルを開きます。 - 削除するものを選びます：コメント、空白、そしてインラインの
<style>と<script>ブロックも圧縮するかどうか。 - 警告行を確認します。構文エラーのあるインラインスクリプトは、ページを壊さないよう変更せずに残されます。
- 圧縮した HTML をコピーするか、ダウンロードします。
何が削除されるのか？
- コメント：
<!-- … -->は削除されます。ただし Internet Explorer の条件付きコメントと、<!--!で始まるコメントは除きます。 - ブロック要素間の空白：
<div>、<li>、<head>などのタグ間の改行やインデントは表示されないため、完全に削除されます。 - テキスト内の連続した空白：1 つのスペースにまとめられます。ブラウザもそもそもそのように表示します。
- タグ内の空白：
<p class = "a">は<p class="a">になります。
何が保持されるのか？
空白が意味を持つ場所もあり、圧縮ツールはそれを尊重します。<pre> と <textarea> の内容は 1 バイトも変えずに保持されます。<b>bold</b> text のようなインライン要素間の 1 つのスペースは、削除すると単語がつながってしまうため残されます。属性値と引用符が変更されることはありません。
インライン CSS と JavaScript
インラインの <style> ブロックは CSSO で、インラインの <script> ブロックは Terser で最適化されます。どちらも CSS 圧縮ツールと JavaScript 圧縮ツールのページで使われているのと同じエンジンです。JSON-LD などの JSON スクリプトブロックはコンパクトにされ、不明なタイプのスクリプト（テンプレートなど）はそのまま残されます。
HTML の圧縮に意味はある？
サーバーレンダリングのページや静的サイトでは、HTML ドキュメントはブラウザが最初にダウンロードするものなので、削減した 1 バイトごとに初回描画までの時間が短くなります。圧縮前の段階で 10〜25% の削減はよくあり、インデントの深いテンプレートや大きなインラインスクリプトを含むページではさらに削減できます。
よくある質問
HTML を圧縮するとページの見た目は変わりますか？
いいえ。削除されるのはブラウザがいずれにせよまとめてしまう空白だけで、
<pre>/<textarea> の内容には手を付けません。CSS で要素に white-space: pre を指定している場合は、空白をまとめるをオフにしてください。インラインの JavaScript と CSS も圧縮しますか？
はい、オプションが有効な場合は圧縮します。インラインブロックに構文エラーがあれば変更せずに残して警告を表示するので、ページが壊れることはありません。
Handlebars、Jinja、Blade などのテンプレートファイルも圧縮できますか？
テンプレートタグがテキストや属性値の中にある限り、通常は可能です。タグ名の中や属性の間にロジックを置くテンプレートは、手動での確認が必要になる場合があります。
HTML はどこかに送信されますか？
いいえ。すべてブラウザ内でローカルに処理されます。