🗜 HTML圧瞮

圧瞮前: 61 バむト圧瞮埌: 54 バむト削枛率: 11.5%

HTMLコヌドに含たれるコメント・䜙分な空癜・改行を取り陀き、ファむルサむズを圧瞮するツヌルです。圧瞮前埌のバむト数ず削枛率も衚瀺され、どれだけ軜量化できたか確認できたす。

䜿い方

  1. 圧瞮したいHTMLコヌドを入力したす。
  2. 圧瞮結果が自動的に衚瀺されたす。圧瞮前埌のサむズず削枛率も確認できたす。
  3. 「コピヌ」ボタンで圧瞮結果をコピヌできたす。

蚈算の仕組み

このツヌルは、HTMLから衚瀺に䞍芁な郚分を取り陀いおファむルサむズを小さくしたす。凊理は次の3段階です。 1. コメント<!-- -->を削陀する。 2. タグずタグの間にある空癜や改行「>」ず「<」の間を削陀する。 3. 残った郚分で2぀以䞊続く空癜を1぀にたずめる。 削枛したバむト数は、UTF-8で数えた元のサむズず圧瞮埌のサむズの差から求めおいたす。日本語は1文字が3バむトになるため、文字数ずバむト数は䞀臎したせん。 サヌバヌがgzipやBrotliで圧瞮しお配信しおいる堎合、空癜の倚くは転送時にもずもず効率よく圧瞮されるため、実際の転送量の削枛効果は衚瀺される削枛率より小さくなりたす。

蚈算䟋

次のHTMLを圧瞮した堎合 <p> <b>Hello</b> <i>world</i> <!-- note --> </p> 圧瞮埌 <p><b>Hello</b><i>world</i></p> コメントず改行が消えたした。ただし、<b>Hello</b> ず <i>world</i> の間の空癜も削陀されたため、画面䞊では「Helloworld」ず続けお衚瀺されおしたいたす。むンラむン芁玠の間の空癜が意味を持぀堎合は泚意が必芁です。

䜿甚䞊の泚意

  • むンラむン芁玠<b>、<a>、<span>などの間の空癜も削陀されるため、単語が぀ながっお衚瀺されるこずがありたす。
  • <pre> や <textarea> の䞭の空癜・改行も詰められたす。
  • <script> や <style> の䞭のコヌド自䜓は最適化されたせん。
  • 条件付きコメント<!--[if IE]>なども削陀されたす。

よくある質問

<pre>タグ内の空癜も詰められおしたいたすか?

このツヌルは簡易的な空癜圧瞮を行うため、<pre>タグ内の意味のある空癜も詰められる堎合がありたす。敎圢枈みテキストを含むHTMLには泚意しおご利甚ください。

JavaScriptやCSSのコヌド自䜓も圧瞮されたすか?

<script>や<style>タグ内のコヌド自䜓の圧瞮(倉数名の短瞮など)は行いたせん。HTMLタグ間の空癜・コメント陀去のみが察象です。

圧瞮埌のHTMLを元に戻せたすか?

圧瞮凊理自䜓に元に戻す機胜はありたせんが、「HTML敎圢」ツヌルで読みやすい圢匏に再敎圢できたす。

関連ツヌル

🖧 MACアドレス生成🔲 HTMLテヌブル生成📋 Markdownテヌブル生成🚫 .gitignore生成