こんな方に読んで欲しい!
- webサイトの表示速度を改善したい!
- webサイトの直帰率が高いので改善したい!
- Google Page speedでのモバイルの点数を高めてSEOに役立てたい!
質の高い記事をたくさん書いても、Google検索などの検索結果の上位に表示されないときは、「サイトの表示速度」を改善する必要があるかもしれません。
Google検索で上位に表示されるためには、記事の質やサイトの直帰率など様々な要素がありますが、Webサイトの「表示スピード」もその1つです。
表示順位に大きく影響を与えると言われています。
そこで今回は、Webサイトの表示スピードを改善できる「W3 Total Cache」をご紹介したいと思います。
さらに詳しく!
Webサイトの高速化は、読み込みを遅延させる「Lazy Load」プラグインも効果的です。
[blogcard url=”https://iblab.net/lazy-load/”]
1. webサイトの表示を高速化する「W3 Total Cache」とは?
名前に「Cache(キャッシュ)」とあるように、キャッシュを利用して高速化するプラグインです。
キャッシュとは?
Webサイト関係だけでなく、業務用のWebシステムなどにも利用される技術です。
キーボードの「Ctrl+F5」を押すと、ブラウザのキャッシュを使わずに、サーバーにある最新の情報を読み込んで画面を表示します。キャッシュをスーパーリロードとも言います。
WordPressはデータベースに記事の情報を保存しています。誰かがwebサイトを見に来ると、毎回データベースから記事を取り出してくる仕組みなので、たくさんの人が見ようとすると、混雑し記事の取り出しが遅くなってしまうのです。
そんな時、あらかじめ保存しておいた「キャッシュ(Cache)」を替わりに渡すことで高速化できるわけです。
この効果を最大限に発揮できるプラグインとして「W3 Total Cache」はサイト運営者から人気があります。
2. W3 Total Cacheの導入方法
「W3 Total Cache」はWordPress公式プラグインのため、WordPress管理画面 > プラグイン >新規追加 から簡単に導入できます。
検索ボックスに「W3 Total Cache」と入力すると、上位に表示されます。表示されない場合は、製作者名「BoldGrid」で検索するのが効率的です。
「今すぐインストール」→「有効化」をクリックすれば完了です。
3. W3 Total Cacheの使い方
W3 Total Cacheを使うためには設定が必要です。今回は「初心者向けの簡単設定」と「中級者以上向けの詳細設定」に分けて説明をします。
設定ページで、プラグイン>インストール済みプラグイン> W3 Total Cache 欄の「 Settings 」 をクリックします。
3-1. W3 Total Cache の設定(初心者向け)
設定項目がたくさんありますが、初心者の方は「ページキャッシュ」と「ブラウザーキャッシュ」だけでも効果を期待できます。
3-1-1. 「ページキャッシュ」の設定
「ページキャッシュ」までスクロールし、「Page Cache」にチェックを入れ有効化します。チェックが終わったら、画面左下の「すべての設定を保存」をクリックします。
3-1-1. Browser Cacheの有効化
またWebページを下にスクロールをします。
「ブラウザーキャッシュ」の「ブラウザーキャッシュ」にチェックを入れ有効化します。チェックが終わったら、画面左下の「すべての設定を保存」をクリックします。
以上で、初心者向けの簡単な設定です。こちらの設定でも十分に効果を発揮します!
3-2. W3 Total Cacheをカスタマイズ(中級者以上向けの詳細設定)
初心者向けと同様に、プラグイン>インストール済みプラグイン> W3 Total Cache 欄の「 Settings 」 をクリックします。
3-2-1. 「一般設定 > 一般」の設定
「一般」の項目には「Preview mode」があり、設定を変更する前にWordpressプラグインの干渉が起きないかチェックできます。
重要なサイトであれば、こちらの機能を利用することをオススメします。
「Preview mode」の「有効化」ボタンをクリックして有効化します。
クリックをすると、画面上部に「プレビューモードの有効化に成功しました」と表示されます。
成功したら、そのまま同じ画面の下の方の設定を変更してみてください。
設定変更後に「プレビュー」をクリックすると、あなたのWebサイトが表示されます。
Webサイトの見た目が崩れていなければ、問題ありません。もしも、Webサイトの見た目が崩れていれば、何かしらが干渉・競合してしまっているので、設定を戻しましょう。
プレビューでの確認が終わったら、「無効化」もしくは「デプロイ」をクリックします。
ここに注意!
「無効化」は、設定内容を破棄して元に戻します。
「デプロイ」をクリックすると、プレビューモードで変更された設定をサイトに適用します。クリックするときは注意をしてください。
3-2-2. 「一般設定 >ページキャッシュ」の設定(重要)
同じページをまた下にスクロールすると、「ページキャッシュ」の項目があります。
Page Cacheの「有効化」は必ずチェックをしましょう。この設定が、本プラグインで特に重要な設定です。
また「Page Cache Method」は、「ディスク:拡張」がデフォルトですが、そのままでOKです。設定したら、忘れずに保存してくださいね。
さらに詳しく!
3-2-4. 「一般設定 >圧縮」の設定
同じページをまた下にスクロールすると、「圧縮」の項目があります。
「圧縮」の設定では、特に設定することはありません。圧縮欄の「有効化」にチェックがついていないことを確認しましょう。
圧縮の設定をすると、CSS・JavaScriptのファイルを圧縮してサイトの高速化を図ることができます。
ただ、同じ機能がWordpressのテーマに含まれていることがあり、テーマの機能とプラグインが干渉しあって、不具合が起きる可能性があります。
3-2-5. 「一般設定 >Opcode Cache」の設定
設定不要です。
3-2-6. 「一般設定 >データベースキャッシュ:」の設定
「データベースキャッシュ:」の設定をすると、サーバーがデータベースにアクセスをして情報を処理する時間を減らすことができます。
ただ、サーバーマシンのスペックによって、この設定をすることで動作が重たくなってしまうことがあります。そのため、こちらの設定は「OFF」のままにしておくことをオススメします。
3-2-7. 「一般設定 >object Cache」の設定
「オブジェクトキャッシュ」の機能は、データベースへアクセスをして動的にWebページを作成する仕組みのサイトで効果を発揮します。
通常のブログであれば、利用する必要がありませんので、「有効化」欄にチェックがないことを確認します。
3-2-8. 「一般設定 >ブラウザーキャッシュ」の設定
「ブラウザーキャッシュ」欄の「ブラウザーキャッシュ」をチェックします。チェックが終わったら、画面左下の「すべての設定を保存」をクリックします。
さらに詳しく!
ブラウザーキャッシュは、訪問者がWebサイトを閲覧した時に、サイトのデータをキャッシュとして保存をさせておき、次回訪問時のサイト表示を高速化するための仕組みです。必ずチェックをしておくことをオススメします。
3-2-9. 「一般設定 >CDN」以降の設定
以下の項目は、設定不要です。
- CDN
- リバースプロキシ
- User Experience
- Statistics
- Fragment Cache
- ライセンス
3-2-10. 「一般設定 >その他」の設定
「その他」の設定では、「Google Page Speed ダッシュボードウィジェットを有効化」と「NFS 向けにディスクの拡張ページを最適化する」のチェックを外します。
「Google Page Speed ダッシュボードウィジェット」は、Wordpress内でGoogle Page Speedの機能を使えるというものですが、公式サイトでスピード計測をすれば事足ります。
3-2-11. 「ページキャッシュ > Page Cache」の設定
次に、Page Cacheの詳細設定を行います。Wordpress左メニューより、 パフォーマンス > ページキャッシュ をクリックします。
下の画像の通り設定をします。設定箇所は次の項目です。
- フロントページをキャッシュ
- フィードのキャッシュ:サイト、カテゴリー、タグ、コメント
- Cashe SSL (HTTPS)requests
- ログイン済みユーザに対してページをキャッシュしない
設定変更後、「すべての設定を保存」をクリックします。
さらに詳しく!
CSSの修正をしたときにキャッシュが残ったままで、設定が反映されなくて困ったことがあると思います。「ログイン済みユーザーに対してページをキャッシュしない」にチェックをしておくと、ログインしている場合はWebブラウザにキャッシュが残らなくなるため、すぐにCSSの反映されたデザインを見ることができるようになります。
3-2-12. 「ページキャッシュ > キャッシュプリロード」の設定
下の画像の通り、キャッシュの保存期間を設定します。設定箇所は次の項目です。
- ページキャッシュを自動に事前準備する:ON
- Preload the post cache uopn publish events:ON
設定変更後、「すべての設定を保存」をクリックします。
3-2-13. 「ページキャッシュ > 詳細」の設定
次に、「詳細」の設定では、Compatibility modeの「有効化」にチェックをします。
翻訳
Decreases performance by ~20% at scale in exchange for increasing interoperability with more hosting environments and WordPress idiosyncrasies. This option should be enabled for most sites.
より多くのホスティング環境やWordPressの特異性との相互運用性を高める代わりに、パフォーマンスを大規模に最大20%低下させます。このオプションは、ほとんどのサイトで有効にする必要があります。
3-2-14. 「ブラウザーキャッシュ > 詳細」の設定
WordPress左メニューより、 パフォーマンス > ブラウザーキャッシュ をクリックします。
ブラウザーキャッシュの設定画面では、次の通り設定することをオススメします。設定箇所は次の箇所です。
- Last-Modified ヘッダーを設定
- Expires ヘッダーを設定
- キャッシュ制御ヘッダーを設定
- エンティティタグを設定
- HTTP圧縮を有効化
チェックが終わったら、画面左下の「すべての設定を保存」をクリックします。
4. 「W3 Total Cache」のメリット・デメリット
4-1.「W3 Total Cache」のメリット
WordPressプラグイン「W3 Total Cache」のメリットは下記のとおりです。
ここがポイント!
- 無料で利用できる
- WordPress公式プラグインのため、インストールが簡単
- 導入しているユーザーが多く情報が多い
- 初期設定が少ないためシンプルに使える
- やる気になればカスタマイズもできる
4-2. 「W3 Total Cache」のデメリット
メリットをいくつか書きましたが、「W3 Total Cache」にはデメリットもあります。
ここに注意!
- WordPressのテーマによって干渉してしまい不具合が起きる
WordPressのテーマは日々進化してきています。少し昔であればキャッシュのプラグインは「W3 Total Cache」が主流でしたが、近年キャッシュ機能がWordpressのテーマにも付いており、本プラグインを利用しなくても良いことがあります。気になる人は、テーマの作成元のFAQサイトや問い合わせで確認をしてみると良いかもしれません。
5. まとめ
表示にかけられる時間は「3秒」です。これ以上かかると離脱される可能性が高まります。
Webサイトの表示スピードを上げることは、Googleの検索で上位に食い込むために重要な要素です。
そのための方法の1つとして「キャッシュの導入」のプラグイン「W3 Total Cache」を徹底解説しました!
一般的な機能なため「キャッシュの導入」機能を持つテーマも多数あります。重複して機能を使わないように気を付けてくださいね!