HTMLファイルをフォルダごと一括で圧縮する方法

Googleは、ウェブサイトの表示速度が検索エンジンの表示順位に影響すると公式にアナウンスしています。

HTMLファイルの圧縮は表示速度の向上に明らかな効果があるため、SEOの観点からは、是非とも実施しておきたいです。

ウェブサービスは時間と手間がかかる

多くの人は、HTMLファイルを圧縮してくれるウェブサービスを利用していると思います。わたしがよく使うのは、こちらのサイト。

＞ html-minifier

無料で誰でも使えて、圧縮効果も高く、細かいカスタマイズもできるので、とてもスグレモノのサイトです。

利用方法は、過去に一度記事にしていますので、そちらをご参照ください。

＞ HTMLの縮小 – フリーのWebツールでHTMLを圧縮

フォルダごと一括処理する方法

上記のウェブサービスはとてもオススメなのですが、ページ数が多くなると時間がかかります。

一ページごとにHTMLをウェブサイト上にコピペして、圧縮ボタンを押して、生成された結果をコピーしてパソコン上のテキストエディタにペーストする。200ページのサイトなら、これを200回繰り返す必要があります。

ボタン一つで、200ページまとめてHTMLを圧縮できないだろうか。その方法を考えてみました。

Macの場合

まず、Macの場合は、専用のソフトウエアがあるようです。

＞ Minify

アイコンにフォルダをドロップするだけで、フォルダ内のファイルを一括で圧縮できます。

わたしはWindowsユーザーなので、このソフトは使えません。かわりに考えたのが、以下の方法です。

検索置換ソフトによる処理

使うのは、検索置換ソフトTextSSです。

＞ TextSS.net　公式サイト

指定したフォルダフォルダ内のファイル（テキストファイル、HTMLファイル）を一括で検索、置換できるソフトウエアです。無料で使えます。

このソフトの置換機能を使って、

改行コード
余分なスペース
コメント

をHTMLファイルから除去します。

操作方法

正規表現を使って検索・置換します。正規表現という言葉は、プログラミングをやっていない人にとっては意味不明でしょうが（実は私もよくわかっていない）、意味不明でも大丈夫です。以下の手順ですすめれば、ちゃんとできます。

拡張子とフォルダを指定

TextSSはインストール不要なので、ダウンロードしたらアイコンをクリックするだけで起動します。

TextSSの初期画面で、圧縮するHTMLファイルのリストを作成します。

左上のプルダウンメニューで、「*.htm;.html」を選択します。
フォルダ追加をクリックし、HTMLファイルが入っているフォルダを指定します。フォルダは複数指定できます。サイトまるごと指定してもOKです。

フォルダ内に存在するHTMLファイルがリスト表示されたらOKです。

検索語を指定

右下の「次へ」をクリックし、検索語の指定画面に進みます。

左上の「置換方法」で、「文字列の置換（正規表現）」を指定します。
「検索パターン」のテキストボックスに、検索語を下記のとおり記入します。

\r\n|\n|\r| {2,}||\t

このままコピペして貼り付けてください。

簡単に意味を説明します。

縦棒「|」は、「または」を意味します。
「\r\n」「\n」「\r」は、いずれも「改行コード」を意味します。
「 {2,}」は、「{」の前に半角スペースが入っています。これ全体で、半角スペースが2つ以上連続した場合を意味します。
「」は、HTMLファイル内のコメント部分を意味します。なお、「?」は最短で一致する箇所を探す記号です。これをつけ忘れると、ファイル内の最初の「」までの間が全部削除されてしまいます。
\tは、タブコードを意味します。

置換を実行

置換語のテキストボックスは空欄のままにします。

右下の「次へ」をクリックして実行画面に進み、右下の「開始」をクリックして置換を実行します。

検索語で指定した、改行コード、余分なスペース、コメントが除去され、全体が一行になった圧縮後のHTMLファイルができあがります。

この方法なら、数百ページのHTMLの圧縮が数秒で完了します。

ファイルが開いたままだと置換できず失敗します。指定したフォルダ内のファイルが開かれていないことを確認してから実行してください。

「復元」ボタンを押せば一括でもとに復元できますが、復元が可能なのはTextSSを閉じるまでです。一回ソフトを閉じてしまうと、バックアップファイルが破棄されるため、復元できなくなります。

バックアップは必須です

圧縮後のHTMLファイルは上書きされるので、もとのHTMLファイルは必ずコピーを別に保存しておきましょう。

圧縮されたものをもとに戻すことはできないので、コピーを残しておかないと再編集が極めて困難になります。

Javascriptが動作するか確認を

上記の方法を使うと、HTMLファイル内に記述されたJavascriptも同時に圧縮されます。Javascriptの記述方法によっては、これにより動作しなくなることがありえます。

圧縮後に、Javascriptが動作するか確認してください。