btmup Blog

Web 制作のことを中心に、ちょっとした Tips などを掲載しています。「自分用メモ」が基本スタンス。

Web制作全般

.htaccess で gzip 圧縮してデータ転送量を少なくする方法。

投稿日:

メモ的エントリー。
タイトルのまんまです。

Web ページを表示するときには、まず HTML やら CSS やら JavaScript やら 画像やらをダウンロードする必要があります。
それら各ファイルを圧縮することで転送量を小さく抑え、結果的にパフォーマンス向上(時間短縮)に繋げましょう、というお話。
ページのつくりにもよりますが、70~80% くらいフツーに圧縮されちゃいます。強力。

自宅サーバーや専用サーバーを使ってる場合は Apache の設定を直接いじることも可能ですが、今回はとりあえずパス。
httpd.conf あたりを触ることになるんでしょうけど。

あと、「gzip」とは何ぞや、というのも、正直よく分かりません。
昔から使われてるし一番普及してるし圧縮率も高いし使用制限とかもフリーだし標準化もされてるし、っていう感じなので、あまり深く考えず乗っかった方が良さげかな、と。

.htaccess での gzip 圧縮設定方法

さて、gzip 圧縮するには、「mod_deflate」モジュールを使います。
(ただ、これは Apache 2.x 系の場合で、Apache 1.3 とかの場合は「mod_gzip」を使うそうです)
で、これを .htaccess で設定するワケですが、ただ圧縮するだけなら以下の一行を書いてアップするだけでOK。

AddOutputFilterByType DEFLATE text/html text/css application/x-javascript

他にも色々細かく設定できるみたいなんですけどね。圧縮率とか。
そんなにこだわらず「圧縮できりゃいいや」っていう(僕みたいな)人ならこの一行で充分でしょう。

「AddOutputFilterByType DEFLATE」の後に、圧縮の対象とするファイルの形式(メディア・タイプ、コンテント・タイプ)を指定します。
上記の指定は HTML と CSS と JavaScript の3種類で、画像は対象から外しています。
(jpg や gif やもともと圧縮してますし、png も一応最適化してるので、gzip 圧縮したところでそれほど効果は望めない)
まぁ、通常はこの 3 つで大丈夫なハズ。

ちなみに、PHP のページについても、「text/html」に含まれてます。
デフォルトでそうなのか、meta タグで「content=”text/html; charset=UTF-8″」というような設定をしているからなのか……。
詳しいことは分かりませんけど。

圧縮できてるかどうかの確認は、Firebug の「接続」タブや「YSlow」でも出来るのですが、↓のような便利なサイトもあります。

»GIDZipTest: Web Page Compression (Deflate / Gzip) Test – GIDNetwork

URL を入力したら、圧縮可否だけでなく、圧縮率やレスポンスヘッダーまで表示してくれます。

注意点など

アクセスのたびに圧縮して転送して……ということを繰り返すので、ユーザー数によってはサーバーにかなりの負荷がかかることも有り得ます。
サーバーのスペックや Web システムとの絡みもあるのでケースバイケースになるんでしょうけど、もし動作が重くなったりした場合は別な方法を検討した方が良いかも知れません。

WordPress で gzip 圧縮

WordPress が入ってるサイトに↑の方法を試してみたら、「Internal Server Error」が発生。
どうしたものかと思ったら、そのままズバリのプラグインがありました。

»WordPress › GZIP Output « WordPress Plugins

管理画面から「GZIP Output」を検索して、インストール→有効化するだけです。
設定は特に無し。いや便利。

WordPress 本体のバージョンについては、2.8.3 までしか動作確認されてないっぽいのですが、2.9.2 と 3.0 に入れても(今のところ)ちゃんと動作してます。

参考サイト







-Web制作全般
-, , , , ,

執筆者:


  1. […] .htaccess で gzip 圧縮してデータ転送量を少なくする  […]

  2. […] .htaccess で gzip 圧縮してデータ転送量を少なくする方法。 […]

  3. […] 圧縮等のパフォーマンスチューニングは、下記サイトが参考になりそうです WordPress(Page Speed対応) – 圧縮を有効にする .htaccess で gzip 圧縮してデータ転送量を少なくする方法。 | btmup Blog […]

  4. […] browser caching解決!さくらでmod_expiresが使えるように(Field Archive).htaccess で gzip 圧縮してデータ転送量を少なくする方法。(btmup […]

  5. […] を減らすことができます。」とかって言われたりする場合は.htaccessを編集してファイルの圧縮を有効にしてください。(.htaccess で gzip 圧縮してデータ転送量を少なくする方法。を参照) […]

  6. […] を減らすことができます。」とかって言われたりする場合は.htaccessを編集してファイルの圧縮を有効にしてください。 (.htaccess で gzip 圧縮してデータ転送量を少なくする方法。を参照) […]

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

Webサイト公開にあたってするべきことリスト。

Webサイトの制作が完了して公開するにあたって「これくらいはやっといた方がいいんじゃね?」と思うこと諸々。 書き留めておかないと忘れたり抜けたりしそうなので、まとめてみました。 やるべきことが増えれば …

no image

「Vitroperlo[ヴィトロペルロ]」というサイトを制作しました。

書こうかどうか迷ったんですが、やっぱり書いときます。 最近、ちょっと人に頼まれて Web サイトを制作しました。 »Vitroperlo[ヴィトロペルロ] 仕事ではなく、個人事業です。 事 …

no image

「Cyberduck」の動作が突然遅くなったときの対処法。

職場でメインのFTPソフトとして使っているのは、「アヒル」でおなじみの「Cyberduck」(現行バージョン:3.0.3)。 フリーソフトなのに機能はしっかりしていて、非常に使いやすくて重宝してます。 …

no image

.htaccessで「Redirect permanent」が使えない場合に「RewriteRule」を使ってリダイレクトする方法。

.htaccess でリダイレクトする場合、一般的に使うのはこんな↓書式だと思います。 Redirect permanent /old/ http://www.btmup.com/new/ 「/old …

no image

Dreamweaver のテンプレートで編集可能領域外の要素の属性を編集可能にする方法

いっっっっっつも「どこだっけなーーー」ってなるので、メモ。 Dreamweaver のテンプレートを適用したページは、テンプレートの方で設定した「編集可能領域」の中身しか編集できません。 でも、例えば …