こんにちは、Webプログラマの篠田です。
今日から12月となり、2017年も残すところあと僅かとなりましたね。
先月には、新しい自社サービス「KUKUL（ククル）」を無事リリースしましたが、12月もALAKIとして更に攻めていけるよう頑張っていきます！
今回は、SEOやWebサイトの表示速度にも影響する「gzip圧縮（mod_deflate）」について、設定方法などをまとめていきます。
「gzip圧縮」とは何ぞ？
「圧縮」と名前に付いていることからイメージできるように「gzip」という圧縮形式の１つを表します。
ですが、普段よく耳にする「zip圧縮」や「rar圧縮」などとは異なり、アーカイブ機能（複数のファイルをまとめて圧縮する）を持たない圧縮形式です。
アーカイブ機能を持ちませんが、Webページで利用している「HTMLファイル」や「CSSファイル」などをファイルごとで圧縮してブラウザに読み込ませることができるので、通常の読み込み（未圧縮）よりも高速にデータを送ることができるようになります。
間違っても、「gzip圧縮してメール添付で送ってね」というような依頼を友人や同僚にしないようにしてくださいね。
「gzip圧縮」に適さないファイル
「gzip圧縮」は、テキストファイル全般に対して効果が期待できます。
Webページで使われるテキストファイルというと「HTML」「CSS」「JavaScript」などが該当します。
逆に「gzip圧縮」に適さないファイルもあります。
それが「画像」や「PDF」といった最初から圧縮されているファイル群です。
「画像」や「PDF」などの圧縮済みファイルを更に「gzip圧縮」を行うとファイルサイズが増大して本来の意味を失ってしまう場合があります。
そのため「gzip圧縮」を利用する場合は予め、どのようなファイルを「gzip圧縮」して送信するかを細かく指示を出す必要があります。
サーバーで「gzip圧縮」を有効化しなければ意味がない
サーバー側で「gzip圧縮」を有効化する必要があります。
何もしないと、せっかくブラウザが「gzip圧縮」対応であっても、サーバーは「gzip圧縮」されていないファイルをブラウザに送りつけてしまいます。
これでは、ブラウザのパフォーマンスを引き出すことができず、ユーザーにストレスを与える可能性があります。
「gzip圧縮」有効化設定は「.htaccess」で行う
サーバー側で「gzip圧縮」を有効化する内容は、「.htaccess」に記述します。
「.htaccess」であれば、多くのレンタルサーバーでも利用が可能な手法となります。
今回は随時「gzip圧縮」を行う「mod_deflate」での設定方法をまとめていきます。
「mod_deflate」で「gzip圧縮」を設定する
「mod_deflate」を使った「.htaccess」の設定は下記になります。
<IfModule mod_deflate.c>
# mod_deflateを有効にする記述
SetOutputFilter DEFLATE
# 古いMozillaなどの古いブラウザでは無効にする。例外としてIEは有効にする
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
# 画像は2重圧縮になるので圧縮しない
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
# 圧縮するファイル形式を列挙
AddOutputFilterByType DEFLATE text/plain #テキストファイル
AddOutputFilterByType DEFLATE text/html #HTMLファイル
AddOutputFilterByType DEFLATE text/xml #XMLファイル(1)
AddOutputFilterByType DEFLATE text/css #CSSファイル
AddOutputFilterByType DEFLATE application/xhtml+xml #XHTMLファイル
AddOutputFilterByType DEFLATE application/xml #XMLファイル(2)
AddOutputFilterByType DEFLATE application/rss+xml #XMLファイル(3:rss形式)
AddOutputFilterByType DEFLATE application/atom_xml #XMLファイル(4:atom形式)
AddOutputFilterByType DEFLATE application/x-javascript #JavaScriptファイル
AddOutputFilterByType DEFLATE application/x-httpd-php #PHPファイル
</IfModule>
記述内容に関して解説していきます。
古いMozillaブラウザは「gzip圧縮」しない
BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
この３つは、ユーザーエージェントで「Mozilla4」と判断されたブラウザに対する処理になります。
「Mozilla4.06」〜「Mozilla4.08」のバージョンにはエラーがあり「gzip圧縮」が利用できないので「no-gzip」で圧縮を行わないとします。
それ以外の「Mozilla4系」ブラウザは「text/html」のみを「gzip圧縮」します。
ただし、「Mozilla4系」の例外として「IE」は「gzip圧縮」に対応したブラウザなので「gzip圧縮」を行うために、既に設定された「no-gzip」と「gzip-only-text/html」を打ち消します。
画像は「gzip圧縮」しない
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
画像は既に圧縮されているので、２重で圧縮しないため「gzip圧縮」を行わない設定にします。
対象としている画像の拡張子は「gif」「jpeg」「jpg」「png」「ico（アイコンファイル）」としています。
「gzip圧縮」するファイルを列挙する
最後に、圧縮対象とするファイルを１つ１つ列挙していきます。
書き方は「AddOutputFilterByType DEFLATE 【MIMEタイプ】」となります。
ポイントは、拡張子ではなく「MIMEタイプ」形式を記述することです。
「mod_deflate」の注意点
「mod_deflate」を利用する場合、レンタルサーバーによっては、サーバーに負荷がかかることを理由に利用できない場合があります。
その場合は、「mod_rewrite」を利用した方法で「gzip圧縮」を行うことができます。
※「mod_rewrite」を利用した「gzip圧縮」は次回ご紹介したいと思います。
まとめ
「gzip圧縮」を利用しているかどうかというのは、いくつかのサイトチェックサービスでは必須のチェック項目となっています。
また、「mod_deflate」は手軽に実装しやすい反面、サーバー負荷が発生する分、利用できるサーバーに制約がある場合があります。
このあたりも踏まえて、次回は負荷を軽減しつつ「gzip圧縮」の恩恵を受けることができる「mod_rewrite」を使った設定方法についてご紹介したいとおもいます。
