【通信量削減率6割以上!】Gzip圧縮でWordPressブログを高速化する方法

gzip-eye-catch高速化

ブログが遅くて困っていませんか?

サイトを構築するファイルサイズが大きいと、データのやりとりに時間がかかってしまい、読者に「ああ、このサイトは信頼できないなぁ」と思われてしまいます。

本記事では、WordPressでテキストファイル(HTML、CSS、JavaScript)のデータサイズを小さくする「Gzip圧縮」のやり方を解説します。

☑サイトの表示が遅くて困っている

☑サクサク動くブログを運営したい

☑PVが上がらない

PV数が上がらない理由は、ブログが遅いからかもしれません。ページの読み込みが1秒から3秒になると、ページからすぐに離脱してしまう人はなんと32%も増えると言われています。

Gzip圧縮とは

Gzip圧縮とは、人が読めるファイルのテキストコードを、人に読めないテキストコードにすることで、データサイズを小さくする圧縮方法です。

Gzip圧縮の長所

可逆圧縮→圧縮しても完全に元に戻すことが可能

高い圧縮率→Ggip圧縮による削減率は何と60~90%と非常に大きい

処理が高速→計算手順が簡単なので圧縮や解凍にかかる時間が少ない

Gzip圧縮の短所

画像ファイルを圧縮するとデータサイズが肥大化してしまう場合がある

サーバーのCPUに負担をかける場合がある

Ggip圧縮による削減率は60~90%と高く、優先的に行いたい高速化処理です。

ただし、画像ファイルは圧縮するとデータサイズが肥大化してしまう場合があるため、原則テキストファイルのみ圧縮してください。

Gzip圧縮のやり方

それでは具体的にGzip圧縮の方法を解説します。

WordPressでのGzip圧縮は以下のいずれかの方法で行うことができます。

方法① PHPの出力をGzip圧縮する(簡単)

方法②.htaccessにmodde_deflate.cを記述する(誰でもできる)

方法③ プラグインを使う(あまりお勧めしない)

ファイルをGzip圧縮するのは、ブラウザからのリクエストを受けたサーバーです。よって、基本的にはサーバーの設定を編集する必要があります。

たむ
たむ

専門用語分からないという方でも設定は簡単にできるので安心してください。

方法① PHPの出力をGzip圧縮する

PHPを設定することで、サーバーがブラウザに返すファイルをGzip圧縮する方法です

PHPとはサーバーサイドでWebページを構築するプログラミング言語で難しそうですが、言語について詳しく知る必要はないため、この方法が最も簡単です。

やり方は、PHPの設定をつかさどる「php.ini」を編集します。レンタルサーバーをお使いの方は、サーバーのダッシュボードなどに編集項目があります。

その中に「zlib.output_compression = On」といった項目があれば有効にすることで、Gzip圧縮の設定が完了です。

方法② .htaccessにmodde_deflate.cを記述する

.htaccessとは(編集の仕方が分かれば読み飛ばし可)

.htaccess(ドットエイチティアクセス)とは、もともと「Apache」というWebサーバー(レンタルサーバーの仕様)の基本的な動作を制御するためのファイルです。ただし、最近は、その他のWebサーバーでも.htaccessで制御できるのが基本です。

基本的にどのレンタルサーバーでも、.htaccessに対応していますが、サーバーパネルで編集できないレンタルサーバーの場合は、エディタソフトでファイルを作成しアップロードする必要があります。

以下は、エディタソフトなしでも.hacceessの記述を編集できるレンタル―サーバーです。

サーバー名(サービス会社)Webサーバー.htaccess編集画面
エックスサーバーApache2.4.x編集画面あり
ConoHa WINGApache + nginx編集画面あり
お名前.comApache 2.2.34編集画面あり
リトルサーバーApache(詳細不明)エディタなしで編集可
ColorfulBox
LiteSpeed 5.x.x
編集画面あり
ロリホップApache又はLightSpeed
(プランによって変動)
エディタなしで編集可
たむ
たむ

最近のレンタルサーバーは、基本的にどれでもテキストエディタソフトを使う必要はなさそうですね。

編集の方法は、各レンタルサーバー会社の公式ページで詳しく解説してあります。ちなみに僕が使っているエックスサーバーは、以下のようにサーバーパネルから編集画面にアクセスできます。

記述するコード

記述するコードはワンパターンではないですが、とりあえず以下のコードを.htacccessにコピペすれば、一連の設定はできるので大丈夫です。

<IfModule mod_deflate.c>
# Mod_deflateを有効にする
SetOutputFilter DEFLATE
# レガシーブラウザはgiip圧縮を行わない
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
 #画像は圧縮しない
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png)$ no-gzip dont-vary
#ユーザーエージェントごとにキャッシュさせる
# Make sure proxies don't deliver the wrong content
Header append Vary User-Agent env=!dont-vary
</IfModule>

この記述は、Apacheの公式Webサイトから引用したものです。記述の詳細についてさらに詳しく知りたい方は以下のリンクからアクセスしてください。

>>Apache モジュール mod_deflate

方法③ プラグインを使う

プラグインの導入によるGzip圧縮はおすすめしませんが、他の二つの方法でできない方のために、念のためやり方を紹介しておきます。

WP Fastest Cacheを使う

WordPressのダッシュボードで「WP Fastest Cache」というプラグインをダウンロードしてください。

プラグインを有効化すると、ダッシュボードのメニューにWP Fastest Cacheが追加されるので、開いて「Gzip」というチェックボックスにチェックしてください。

これで、設定は完了です。ちなみに、設定完了後に、.hteaccessのコードを確認すると、以下のように記述が加えられています。

エックスサーバーのサーバーパネルの編集画面

最後に

いずれにしても、Gzip圧縮はサイトのデータサイズを簡単かつ大幅に削減してくれるため、ブログを開設したら早めにやっておくことをおすすめします。

最後まで読んでいただきありがとうございました。また、今後もよろしくお願いします。

コメント

タイトルとURLをコピーしました