2026年9月30日

WordPressのGZIP圧縮を有効化する方法・テキストファイルを圧縮して高速化

SEO・パフォーマンス

はじめに

「PageSpeed InsightsでテキストベースのリソースをGZIPで圧縮してくださいと言われた」「HTMLやCSS・JSの転送量を削減したい」——GZIP圧縮はサーバーが送信するテキストデータを圧縮することで、転送量を60〜80%削減し表示速度を改善します。

症状・原因

GZIP圧縮が無効になっていると、WordPressが出力するHTML・CSS・JS・XMLなどのテキストデータが非圧縮で転送されます。特にモバイル回線では転送量の削減がページ速度に直結します。ほとんどのモダンブラウザはGZIPに対応しており、サーバー側で設定するだけで効果を発揮します。

解決手順

ステップ1：GZIP圧縮の有効化を確認する

# curlでGZIP対応を確認
curl -I -H "Accept-Encoding: gzip" https://example.com | grep -i "content-encoding"
# → content-encoding: gzip  が返ればGZIP有効

# または Chrome DevTools で確認
# F12 → Network → 任意のリクエストを選択
# → Response Headers の Content-Encoding: gzip を確認

# オンラインツールで確認
# GZipWTF: gzipwtf.com
# Check GZIP: checkgzipcompression.com

ステップ2：Apache（.htaccess）でGZIPを有効化する

# .htaccess: mod_deflateでGZIP圧縮を設定
<IfModule mod_deflate.c>
    # 圧縮するMIMEタイプを指定
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE text/javascript
    AddOutputFilterByType DEFLATE text/xml
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/json
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/atom+xml
    AddOutputFilterByType DEFLATE image/svg+xml
    AddOutputFilterByType DEFLATE font/woff2
    AddOutputFilterByType DEFLATE font/woff

    # 古いブラウザ向けのブラウザ別設定
    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|webp|avif|zip|gz|bz2)$ no-gzip dont-vary
    Header append Vary User-Agent env=!dont-vary
</IfModule>

# mod_filterを使う方法（推奨、Apache 2.4+）
<IfModule mod_filter.c>
    FilterDeclare COMPRESS
    FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m|text/html|i"
    FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m|text/css|i"
    FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m|application/javascript|i"
    FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m|application/json|i"
    FilterChain COMPRESS
    FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no
</IfModule>

ステップ3：NginxでGZIP/Brotliを有効化する

# nginx.conf: GZIPを有効化
http {
    gzip on;
    gzip_vary on;
    gzip_proxied any;
    gzip_comp_level 6;   # 圧縮レベル（1-9、6が品質とCPU負荷のバランス）
    gzip_min_length 256; # 256バイト以上のファイルを圧縮
    gzip_buffers 16 8k;
    gzip_http_version 1.1;
    gzip_types
        text/plain
        text/css
        text/xml
        text/javascript
        application/json
        application/javascript
        application/xml
        application/rss+xml
        image/svg+xml
        font/woff2
        font/woff;
}

# Brotli圧縮（GZIPより高効率、ngx_brotliモジュールが必要）
http {
    brotli on;
    brotli_comp_level 6;
    brotli_types
        text/plain
        text/css
        application/json
        application/javascript
        image/svg+xml
        font/woff2;
}

ステップ4：PHPでGZIP出力を有効化する

// wp-config.php または functions.php
// ※ サーバーのGZIPが設定できない場合の代替手段

// PHPのob_gzhandlerを使ってGZIPを有効化
if ( ! is_admin() && extension_loaded( 'zlib' ) ) {
    ob_start( 'ob_gzhandler' );
}

// または .htaccessが使えない場合にphp.iniで設定
// zlib.output_compression = On
// zlib.output_compression_level = 6

// WordPressのwp-config.phpでは以下の定数で制御
define( 'COMPRESS_SCRIPTS', true );  // JS圧縮
define( 'COMPRESS_CSS', true );      // CSS圧縮
define( 'ENFORCE_GZIP', true );      // GZIP強制

ステップ5：圧縮効果を確認してブラウザキャッシュと組み合わせる

# .htaccess: GZIPとブラウザキャッシュを組み合わせる
# GZIPと合わせてVaryヘッダーを設定
<IfModule mod_headers.c>
    # 圧縮されたレスポンスをキャッシュさせる
    <FilesMatch "\.(css|js|html)$">
        Header append Vary: Accept-Encoding
    </FilesMatch>

    # 静的ファイルのブラウザキャッシュ
    <FilesMatch "\.(css|js)$">
        Header set Cache-Control "public, max-age=2592000"
    </FilesMatch>
    <FilesMatch "\.(woff2|woff)$">
        Header set Cache-Control "public, max-age=31536000"
    </FilesMatch>
</IfModule>

# 圧縮率の確認（ファイルサイズ比較）
# 圧縮前
curl -o /dev/null -s -w "%{size_download}" https://example.com/wp-content/themes/my-theme/style.css

# 圧縮後
curl -H "Accept-Encoding: gzip" -o /dev/null -s -w "%{size_download}" https://example.com/wp-content/themes/my-theme/style.css

# 典型的な圧縮率: CSSは60-70%、HTMLは70-80%、JSは60-75%削減

注意事項

すでに圧縮されている画像（JPEG・PNG・WebP）やPDFをGZIP対象にしても効果はなく、むしろCPU負荷が増えます。SetEnvIfNoCaseディレクティブで画像ファイルを除外してください。
PHP（ob_gzhandler）とApache（mod_deflate）の両方でGZIPを有効にすると二重圧縮が発生してエラーになる場合があります。どちらか一方のみを使ってください。
Cloudflare CDNを使用している場合は、Cloudflareが自動でGZIP/Brotli圧縮を行います。この場合はオリジンサーバー側のGZIP設定と競合しないよう確認してください。

まとめ

GZIP圧縮の有効化は「.htaccessにmod_deflate設定→NginxならGZIP/Brotli設定→圧縮確認ツールで動作確認→Varyヘッダーでキャッシュと組み合わせ」の流れで設定します。転送量が60〜80%削減され、特にモバイルユーザーの体験が大きく改善します。関連記事：WordPressのサイト速度を計測して改善する方法、WordPressでHTTP/2を活用してパフォーマンスを改善する方法。

Post Views: 8