グーグルの検索順位を決定する要件の一つとしてサイトの表示速度ってのがあるのはみなさんご存知でしょう。ページが開くまでの時間が遅いよりは早い方がいいに決まっています。

グーグルが発表したところによると、ページが完全に表示されるまでに3秒以上かかると、53%以上のユーザーがそのページを離れるそうです。つまり、表示速度が遅いといわゆる“直帰率”が一気に跳ね上がるんです。こうなるとグーグルさんからのそのサイトの評価も下がり、必然的に検索順位も下がってしまいます。

私も、「これは何か手を打ったほうがいいな~」と思っていたものの、実は今まで特に何もしていませんでした。そこで今回はこの「表示速度」を上げるべく、エックスサーバーの設定とワードプレスのプラグインを使って表示速度向上を目指しました。さらに実際の検証結果も載せますのでぜひご覧ください。

 

今回やったことは3つ。

  • エックスサーバーのサーバーパネルで「mod_pagespeed」をONにした
  • ワードプレスのプラグイン「EWWW Image Optimizer」を適用した
  • ワードプレスのプラグイン「Autoptimize」を適用した

以上!

これだけで当ブログの表示速度も下のように劇的に改善されたので是非お試しください。


スポンサーリンク

改善前

改善後

 

表示速度やパフォーマンスの確認は、GTmetrixというサイトを利用しました。大変便利なので使えますよ。調べたいサイト(ブログ)のURLを打ち込んでAnalyzeを押して少し待つと上のようなスコア結果や詳細な改善ポイントが表示されます。

 

先にもお伝えした通り、今回は「mod_pagespeed」「EWWW Image Optimizer」「Autoptimize」の3つを適用しました。その度に当ブログの表示スコアと表示速度がどのように変化したのかを表したのが下のグラフです。

何もしていないデフォルトから最終的に「Autoptimize」を適用したときには表示スコアで64%→84%、表示速度で4.9秒→2.4秒と改善され、その効果がハッキリと確認することができました。

 

今回は「mod_pagespeed」「EWWW Image Optimizer」「Autoptimize」の3つを適用しましたが、適用する順番は特に関係ありません。一応今回は「mod_pagespeed」→「EWWW Image Optimizer」→「Autoptimize」の順に説明します。

エックスサーバーでmod_pagespeedの設定をONにする

簡単ですよ!

まずはエックスサーバーにログインして「サーバーパネル」を開きます。そしてメニューから「mode_pagespeed設定」を選び、表示を高速化したいサイト(ブログ)を選択します。

 

そして、変更の項目にある【ONにする】のボタンを押します。

 

現在の設定がONになっていれば設定完了です。

mod_pagespeedの設定はこれだけです!早い!上で紹介したグラフでもわかると思いますが、これだけでもかなりの効果がありますよ!

プラグイン「EWWW Image Optimizer」を適用する

「EWWW Image Optimizer」とは

  1. EWWW Image Optimizerは過去にアップロードした大量の画像を一括で圧縮・軽量化をしてくれます。
  2. EWWW Image OptimizerはEXIF 情報を一括で削除してくれます。(EXIF情報とは画像の撮影日時・場所、撮影機器の情報等、表には表示されない裏の情報:メタデータのことです)
  3. EWWW Image Optimizerはインストール&有効化以降にアップロードした画像に対しても自動的に上記1,2を行い、圧縮・軽量化をし続けてくれます。

つまり、画像関係の圧縮・軽量化ですね。

 

では始めましょう。

まず、ワードプレスのプラグイン「EWWW Image Optimizer」をインストール&有効化します。

 

次に、設定はそのままでいいので、メニューのメディアから「一括最適化」を選択します。

 

【最適化されていない画像をスキャンする】をクリックします。

 

そしてそのまま【最適化を開始】をクリックします。

これで画像が最適化されていくのでしばらく待ちます。すべての画像の最適化が終わったら「EWWW Image Optimizer」の適用は完了です。

これも簡単でしたね!

プラグイン「Autoptimize」を適用する

「Autoptimize」とは

  1. AutoptimizeはHTML、CSS、JavaScriptを連結・縮小してウェブサイトを最適化してくれます。

つまり、ソースコードの圧縮・軽量化ですね。

続いては、ワードプレスのプラグイン「Autoptimize」をインストール&有効化します。

 

「Autoptimize」のプラグインメニューからの設定をクリックします。

 

設定画面で「HTMLオプション」「JavaScriptオプション」「CSSオプション」にチェックを付けて【変更を保存してキャッシュを削除】をクリックします。

以上で、「Autoptimize」のプラグインの適用は完了です。こちらも簡単でしたね!



スポンサーリンク


私の他のブログでも同じ作業をしてみた結果

私は他にもいくつかブログを書いていますが、今回の表示速度の高速化の方法を他の5つのブログでも試してみました。その結果が下のグラフです。

表示スコアの変化

表示スコアについては、「mod_pagespeed」をONに設定するのが一番効果があるようです。

表示速度の変化

表示速度は全体としては今回紹介した作業をすることで2秒台に収めることができました。こちらもやはり「mod_pagespeed」をONに設定することで顕著な改善が見られますね。

まとめ

最終的に私の5つのブログで検証してみたところ、「mod_pagespeed」をONに設定することがパフォーマンスの改善に特に大きな貢献しているようです。

今回は表示スコアと表示速度のみの結果で比較しましたが、実は他にも表示パフォーマンスを測るいくつかの項目があります。すべての項目の結果を掲載するのは大変なので今回は代表として表示スコアと表示速度の2つの項目のみ結果を掲載しました。

エックスサーバーの「mod_pagespeed」、プラグインの「EWWW Image Optimizer」や「Autoptimize」を使用することですべての項目において改善が認められました

サイト(ブログ)の表示速度が気になる、サイト(ブログ)の表示速度を上げグーグルからの評価を改善して検索順位を上げたいという方はぜひ検討してみてはいかがでしょうか。

 

スポンサーリンク