GZIP圧縮を使用してWordPressサイトを高速化する方法

公開: 2018-10-05

Webサイトで強力なユーザーエクスペリエンスを提供する場合、パフォーマンスが重要です。 サイトの読み込みに時間がかかる場合は、適切に体験する前に「バウンスされた」ユーザーが増える可能性があります。 これが、サイトの速度を最適化することが非常に重要である理由です。

サイトの読み込み時間を最小限に抑える方法はたくさんありますが、あまり知られていない(まだ便利な)オプションの1つはGZIP圧縮です。 これにより、サイトのファイルが圧縮されて転送が速くなり、読み込み時間が短縮されます。

この記事では、GZIP圧縮の基本とその仕組みを紹介します。 次に、WordPressサイトに実装する方法を説明します。 さあ行こう!

  • サイトの読み込み時間が重要な理由
  • GZIP圧縮の概要
  • WordPressサイトでGZIP圧縮を使用する方法(3ステップ)
  • 結論

サイトの読み込み時間が重要な理由

GZIP圧縮がサイトの高速化にどのように役立つかについて詳しく説明する前に、まずその重要性を見てみましょう。 実際、オンラインで時間を費やしたことがある場合は、読み込み時間が遅いとWebサイトに与える影響をすでによく知っているはずです。

実際、インターネットユーザーのほぼ半数は、サイトがわずか2秒以内に読み込まれることを期待しています。 それを超えると、1秒ごとにページの放棄が指数関数的に高くなり、コンバージョン率に悪影響を与える可能性があります。 そのため、サイトで訪問者を待たせないようにすることが最優先事項です。

幸い、サイトの速度を最適化するためにできることはたくさんあります。 最も一般的に議論されているもののいくつかには、画像の圧縮、コンテンツ配信ネットワーク(CDN)の使用、およびキャッシュの実装が含まれます。 ただし、見過ごされがちな(ただし、同様に価値のある)1つの方法は、GZIP圧縮です。 これが何であるか、そしてそれがどのように機能するかをもう少し詳しく見てみましょう。

GZIP圧縮の概要

GZIP圧縮でワードプレスサイトを高速化する方法に関するフライホイールアプリチュートリアル付きのシルバーとオレンジの家具のラップトップ

基本的に、GZIPは、ZIPファイルやRARファイルなどの他の圧縮タイプに似ています。 基本的に、サイトのファイルを圧縮して大幅に小さくするため、送信が高速になります。 その後、ファイルはエンドユーザーのデバイスによって解凍されます。

WordPressサイトの速度とパフォーマンスを向上させるための4つのヒント

サイトの読み込みが遅いほど、人々が離れる可能性が高くなることは証明された事実です。 したがって、ページの読み込みに永遠に時間がかかる場合は、潜在的なコンバージョンと顧客の両方が失われます。 特に...

これは、サイトの読み込み時間を短縮するだけでなく、帯域幅の使用量を抑えるのにも役立ちます。 転送する必要のあるデータが少ないため、サーバーにかかる負担が少なくなります。 GZIP圧縮は非常に大きくなる可能性があるため、読み込み時間を短縮する上で非常に重要な側面です。

GZIP圧縮は通常、サーバーレベルで有効になっているため、既に有効になっているかどうかを再確認してください。 ただし、そうでない場合は、仕事に取り掛かる必要があります。

WordPressサイトでGZIP圧縮を使用する方法(3ステップ)

WordPressでGZIP圧縮を実装する最も簡単な方法は、そのまま使用できるWebホストを使用することです。 たとえば、 Flywheelは、すべてのWordPressサイトでデフォルトでGZIP圧縮を有効にし、組み込みのキャッシュソリューションとCDNを有効にします。 これにより、これらのソリューションを自分で実装することを心配することなく、サイトが常に良好に機能することが保証されます。

ただし、ホストがこの機能を提供していない場合は、自分で問題を解決する必要があります。 WordPressで一般的であるように、WP Fastest Cacheなど、機能セットの一部としてGZIP圧縮を提供するプラグインがあります。 ただし、プラグインに依存したくない場合は、手動で使用できる方法もあります。

1.サイトの.htaccessファイルを開きます

GZIP圧縮を手動で設定するには、サイトの.htaccessファイルを編集する必要があります。 これは、WordPressサイトがサーバーとどのように相互作用するかなど、WordPressサイトを強化する多くの重要な機能を担っています。

続行する前に、サイトのバックアップを作成することをお勧めします。 .htaccessがWordPressコアファイルであることを考えると、バックアップを用意しておくと、このような比較的小さな変更であっても、最悪の事態が発生した場合に備えて自分自身を保護するのに役立ちます。

準備ができたら、ファイル転送プロトコル(FTP)を使用してサイトのサーバーにアクセスする必要があります。 無料のオープンソースのFileZillaをお勧めします。スキルを磨くこともできます。 Webホストから提供されたFTPクレデンシャルを使用してログインする必要があります。ログインすると、次の画面が表示されます。

gzip圧縮ファイルシステムのスクリーンショットでワードプレスサイトを高速化する方法

サイトのルートディレクトリ(通常はpublic_htmlと呼ばれますが、サイトの名前またはwwwの場合もあります)で.htaccessファイルを確認できるはずです。 それを右クリックし、[表示/編集]を選択して、デフォルトのテキストエディタでファイルを開きます。

gzip圧縮.htaccessファイルのスクリーンショットでワードプレスサイトを高速化する方法

次に、このファイルにコードを追加します。

2.ファイルを編集してGZIP圧縮を有効にします

次に、サーバーにWebサイトのファイルをGZIPとして圧縮して配信するように指示するために、数行のコードを追加する必要があります。

# END WordPressの上に新しい行を追加し、次のコードを貼り付けます。

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/opentype
# For Older Browsers Which Can't Handle Compression
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>

上記はほとんどのサーバーで機能するはずです。 ただし、そうでない場合(次のセクションでこれをテストする方法について説明します)、代わりに次のスニペットが機能するはずです。

<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>

終了したら、 .htaccessファイルを保存します。 FileZillaは、サイト上のファイルを新しいバージョンに置き換えるかどうかを尋ねるので、プロンプトが表示されたら[はい]を選択します。

3.GZIP圧縮が正しく実装されているかどうかをテストします

この時点で、指示どおりにサイトでGZIP圧縮が使用されているかどうかをテストする必要があります。 これについては、この記事の前半で簡単に説明しましたが、実際には、このプロセスで最も簡単なステップです。 これを行うには、CheckGZIP圧縮などのサイトを使用できます。

gzip圧縮でワードプレスサイトを高速化する方法gzip圧縮ツールのスクリーンショットチュートリアルを確認してください

サイトのURLを入力し、虫眼鏡アイコンをクリックするだけです。 次に、サイトはファイルがGZIP経由で配信されているかどうかを確認し、結果を返します。 うまくいけば、次のメッセージが表示されます。

gzip圧縮でワードプレスサイトを高速化する方法GZIP圧縮ツールのスクリーンショット

ただし、結果にサイトでGZIPが使用されていないことが示されている場合は、3つのルートがあります。 1つは、前に概説したようにスニペットを置き換えることです。 または、変更がアクティブになるまでしばらく待つ必要がある場合や、サイトのキャッシュを削除する必要がある場合もあります。

それでも問題が解決しない場合は、 .htaccessファイルのコードでエラーがないか再確認してください。 それでも困っている場合は、ウェブホストのサポートチームに連絡してサポートを依頼することをお勧めします。

結論

WordPressサイトの速度を最適化することになると、GZIP圧縮は、最も話題になっていないが、利用可能な最も有用な方法の1つです。 サイトのファイルを圧縮することで、読み込み時間を短くし、ユーザーが不必要な速度低下に悩まされることを防ぐことができます。

この記事では、WordPressサイトでGZIP圧縮を有効にする方法について説明しました。 圧縮がすでに有効になっているサーバーでサイトをホストするのが最も簡単なオプションですが、次の手順を使用して自分でサイトを設定することもできます。

  1. サイトの.htaccessファイルを開きます。
  2. ファイルを編集してGZIP圧縮を有効にします。
  3. GZIP圧縮が正しく実装されているかどうかをテストします。

GZIP圧縮について質問がありますか? 以下のコメントセクションでお知らせください。