HTML ミニファイアー

HTML を安全に圧縮。コメントを削除し、空白をまとめ、ブロックタグの周りのスペースを取り除きつつ、pre、textarea、script、style はそのまま保ちます。

HTML の入力

出力

すべてブラウザ内で実行されます。データがアップロードされることはありません。

HTML ミニファイアーとは？

HTML ミニファイアーは、保守的で表示に影響しない変換で HTML を小さくします。コメントは削除され、連続する空白は 1 つのスペースになり、ブロックレベルのタグの隣の空白は取り除かれます。<pre>、<textarea>、<script>、<style> の内容は、バイト単位でそのまま保たれます。

HTML ミニファイアーの使い方

HTML を入力欄に貼り付けます。
圧縮をクリックします（入力中も出力は更新されます）。
サイズの行で、どれだけ削減されたかを確認します。
圧縮された HTML をコピーまたはダウンロードします。

例

入力

<div>
  <!-- c -->
  <p>Hello   <b>big</b>
 world</p>
  <pre>  a
 b</pre>
</div>

出力

<div><p>Hello <b>big</b> world</p><pre>  a
 b</pre></div>

HTML ミニファイアーを使うべき場面

静的なページ、メールテンプレート、コードに埋め込む HTML スニペットに使います。gzip/brotli と比べると効果は控えめです。省略可能なタグや属性の引用符は削除しないため、出力は有効で予測しやすいままです。

HTML ミニファイアーの仕組み

小さなトークナイザーが入力をタグ、テキスト、コメント、生テキストのブロックに分割します。コメントは、Internet Explorer の条件付きコメント（<!--[if …]>）を除いて削除されます。テキストでは、連続する空白は 1 つのスペースになります。前後のスペースは、隣が div、p、li、table などのブロックレベルのタグの場合は削除されますが、見える状態であるインライン要素の間（<b>a</b> <i>b</i>）では残されます。タグ内の空白は正規化され、属性値は変更されません。ページ内の JavaScript と CSS は圧縮されません。それには JS や CSS のミニファイアーを使ってください。