WordPress の GZIP 圧縮を有効にする方法
公開: 2023-02-12遅い Web サイトは、多くの問題を引き起こす可能性があります。 潜在的な訪問者や顧客を遠ざけ、サイトのユーザー エクスペリエンス (UX) を損なうだけでなく、評判にも影響を与える可能性があります。
Web サイトのページのサイズを小さくすることは、読み込み速度を改善するための鍵です。 幸いなことに、GZIP 圧縮は、ページの読み込みを高速化し、ファイル サイズを縮小するための優れた方法です。
このガイドでは、GZIP 圧縮の概要とその機能を含め、GZIP 圧縮の基本について説明します。 次に、WordPress Web サイトで GZIP 圧縮を有効にする方法について詳しく説明します。 さっさと飛び込もう！
GZIP圧縮とは？
GZIP 圧縮は、ZIP や RAR に似たデータ圧縮の一種です。 テキスト、HTML、CSS、JavaScript、XML のいずれであっても、Web サイト上のすべてのファイルを圧縮するために使用できます。
GZIP 圧縮は、ファイルが訪問者の Web ブラウザーに提供される前に行われます。 この方法により、GZIP 圧縮はファイル サイズを縮小し、Web サイトの読み込み時間にプラスの効果をもたらす可能性があります。
GZIP 圧縮は何をしますか?
訪問者が Web サイトにアクセスすると、ブラウザーはサーバーからサイトのファイルを要求します。 サーバーはこれらのファイルをブラウザに送信する前に圧縮します。 GZIP 圧縮は、とりわけファイル圧縮の 1 つの方法です。
圧縮ファイルは、非圧縮ファイルよりも高速に転送されます。 これにより、ウェブサイトのパフォーマンスと読み込み速度が向上し、その結果、検索エンジン最適化 (SEO) が向上します。
GZIP 圧縮が有効になっているかどうかを確認する方法
GZIP 圧縮は一般的であり、多くの WordPress ホスティング プラットフォームではデフォルトで有効になっています。 サイトで GZIP 圧縮が機能しているかどうかを確認する方法がわからない場合は、サードパーティのソリューションまたはブラウザー内の開発者ツールを使用してテストできます。
GZIP 圧縮を有効にしていない場合、通常、GTmetrix などのツールで警告が表示されます。 GZIP 圧縮ツールを使用して、Web サイトが GZIP 圧縮を使用しているかどうかを確認することもできます。
ブラウザーの開発者ツールを使用して、GZIP 圧縮が機能しているかどうかを確認することもできます。 有効にすると、応答ヘッダーに「content-encoding: gzip」が含まれます。
Chrome で応答ヘッダーを見つけるには、DevTools を開いてNetworkに移動し、ページをリロードする必要があります。 Web サイトに一致する名前をクリックすると、応答ヘッダーが開きます。
WordPress で GZIP 圧縮を有効にする方法
WP Engine のすべての Web サイトは、GZIP 圧縮をデフォルトとして使用します。 テキスト ファイル、画像、CSS、JavaScript を含むすべての静的ファイルは、Web サイトのパフォーマンスを最適化するために自動的に圧縮されます。 この自動圧縮により、 .htaccessファイル内の GZIP ディレクティブの必要性が減少します。
ただし、すべての WordPress Web サイトが WP Engine でホストされているわけではなく、GZIP 圧縮をデフォルトで有効にしてもメリットはありません。 Web サイトが別のプラットフォームでホストされている場合は、GZIP 圧縮を手動で有効にする必要がある場合があります。 これを行うにはいくつかの方法がありますが、それについては次に説明します。
プラグインで GZIP 圧縮を有効にする
GZIP 圧縮を有効にする最も簡単な方法は、キャッシュ プラグインを使用することです。 WP Rocket などのツールは、コードを.htaccessファイルに追加することで圧縮を有効にしますが、W3 Total Cache などの他のツールでは、そのコードを手動で追加する必要があります。
これは通常、GZIP 圧縮を追加する最も簡単な方法ですが、サイトにプラグインを追加する必要があります。 プラグイン ライブラリをスリムに保ちたい場合は、代わりに次の解決策のいずれかを使用できます。
Nginx の GZIP 圧縮を有効にする
Web サイトで Nginx を使用している場合は、GZIP 圧縮を有効にするために使用できるコード スニペットがあります。 以下のコード スニペットをサイトのnginx.confファイルの「http」セクションに配置する必要があります。 このコード スニペットをサーバーまたはロケーション構成ブロックに配置することもできますが、一般的には http セクションをお勧めします。
gzip on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;
gzip_min_length 1000;
gzip_vary on;
gzip_proxied no-cache no-store private expired auth;
gzip_diable “MSIE [1-6];
ファイルを保存して閉じたら、Nginx を再起動する必要があります。 これを行うには、次のコマンドを使用します。
sudo service nginx restart
再起動後、前述の方法を使用して、GZIP 圧縮がアクティブであることを確認します。
Apache の GZIP 圧縮を有効にする (.htaccess ファイルを編集して)
Web ホストが Apache を使用している場合は、 .htaccessファイルを編集して GZIP 圧縮を有効にする必要があります。 このファイルは、ファイル転送プロトコル (FTP) またはファイル マネージャーを介して、WordPress インストールのルート ディレクトリにあります。 ほとんどの WordPress GZIP 圧縮方法では、 .htaccessファイルを編集する必要があります。
GZIP を有効にするために使用できる Apache mod は 2 つありますが、 mod_deflate は最も広くサポートされ、最もよく文書化されたオプションです。 mod_deflate を有効にするには、以下を追加します。
<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
</IfModule>
代わりにmod_gzip を有効にするには、以下を追加します。
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_include mime ^text/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_include handler ^cgi-script$
</ifModule>
いずれかの mod を使用する前に、 .htaccessファイルのバックアップを作成し、モジュールmod_filter がサーバー上にあることを確認する必要があります。そうしないと、500 エラーが発生する可能性があります。
WP Engineで学び続ける
Web サイトのページのサイズを小さくすると、読み込み時間が短縮され、全体的なパフォーマンスが向上します。 GZIP 圧縮はこの削減を有効にできますが、有効になっている場合のみです。
幸い、WP Engine ではデフォルトで GZIP 圧縮を有効にしています。 さらに、訪問者のために優れたデジタル体験を構築する方法を学ぶのに役立つ優れたリソースを提供しています!