エックスサーバー 上谷亮太

エックスサーバーのwordpressをmod_pagespeedで高速化させる方法

エックスサーバーのwordpressをmod_pagespeedで高速化させる方法

webサイトは高速化した方がいいことがあるらしいから、エックスサーバーのWordpressを高速化したいな!でもどうやってやればいいんだろう?素人でもできる方法はあるかな?

こんな悩みに答えます。wordpressを高速化させるって、エンジニアがいないと大変そう。。。というか大変です。笑

ですが、エンジニアじゃなくてもエックスサーバーを高速化させる方法があるのでそれについて。

Q:webサイトは早い方がいいの?

A:早い方がいいです。

なぜなら、表示が遅いと離脱をしてしまうから。

現状のモバイルサイトがいかに遅く、遅い表示速度がどのくらい悪い影響をユーザー体験に与えているかを調査した結果を Google が公表しました。
「完全に表示されるまでに3秒以上かかると、53%のユーザーはページを離れる」「表示速度が1秒から7秒に落ちると、直帰率は113%上昇」など興味深いデータが出ています。

引用:表示速度が1秒→7秒で直帰率は113%↑、モバイル向けサイトのUXはとにかくスピードが命 | 海外SEO情報ブログ

発想的には、ユーザービリティをあげて、ロスを無くす感じなのかなと。まあ早い方がいいですよね。

ちなみに、僕の体感ですが遅いサイトが結構多いので、高速化するだけで、差別化できるんじゃないかなと。

googleのPageSpeed Insightsでスピードが測れる

スピードはgoogleのスピードテストを使うと測ることができます。

当サイトはこんな感じ。

当サイトのスピードテストpc

当サイトのスピードテストsp

http://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fuetani33.net&tab=mobile

早い方だと自負しております。高速化するために自分で0からWPテーマを作ってます。

他のサイトも数サイトみてみましょう。

首相官邸

首相官邸のスピードテストpc

首相官邸のスピードテストsp

https://www.kantei.go.jp/

オモコロ

オモコロのスピードテストpc

オモコロのスピードテストsp

https://omocoro.jp/

とまあ、こんな感じです。だいたい何も対策してないサイトだと30〜50点ぐらい。試しに、あなたのブログも測ってみてはどうでしょうか?

エックスサーバーのWordpressを高速化させる方法はどんな手段がある?

手段的にはざっくり言うと全部で8つ。(ほんとはもうちょいある)

  1. html/css/jsを圧縮する。ファイルを1つにまとめる(エンジニア向け)
  2. css/jsを非同期で読み込む(エンジニア向け)
  3. httpリクエストを減らす(エンジニア向け)
  4. gzipでファイルを圧縮して軽量化(エンジニア向け)
  5. ブラウザキャッシュを活用する
  6. 画像を軽量化する
  7. phpのバージョンを最新にする。最近の方が早いから(プラグインを入れまくっている場合は、バグに注意)
  8. プラグインを極力使わない

これを見るとわかりますが、半分ぐらいは、エンジニアがいないと対処できません。笑(※ある程度はググればできます)

が、ここがスピードに大きな影響を及ぼすので、スピード上げるなら避けれません。

しかし、エックスサーバーの場合は、このエンジニアがいる部分も設定できるので、それを解説します。エックスサーバーは素晴らしい!

エックスサーバーでmod_pagespeedを有効にすると”超高速化”

エックスサーバーの機能として、mod_pagespeed設定というのがあります。

難しい説明は、公式に任せます。

大事なところをいうと、

  1. html/css/jsを圧縮する。ファイルを1つにまとめる(エンジニア向け)
  2. css/jsを非同期で読み込む(エンジニア向け)
  3. httpリクエストを減らす(エンジニア向け)
  4. gzipでファイルを圧縮して軽量化(エンジニア向け)
  5. ブラウザキャッシュを活用する
  6. 画像を軽量化する
  7. phpのバージョンを最新にする。最近の方が早いから(プラグインを入れまくっている場合は、バグに注意)
  8. プラグインを極力使わない

この中の、1〜6をエックスサーバーが自動でやってくれます。つまり、ほとんど自動で高速化してくれます。神機能ですね!

エックスサーバーならとりあえず、これを設定すればOK。

当サイトは、mod_pagespeedを使わず全部手動で設定しますが、やっている内容は同じです。

mod_pagespeed設定のやり方

mod_pagespeed設定の仕方を説明します。

が、エックスサーバーの説明が完璧なのでこちらを参照してくださいませ。

» mod_pagespeed設定 | レンタルサーバー【エックスサーバー】

↑の真ん中、「mod_pagespeed設定の切り替え手順」から。

合わせてphpのバージョンを最新に

せっかくサーバーパネルにいるので、ついでにphpのバージョンを最新版にしておきましょう。サーバパネルを2,3クリックだけでできます。

サーバーパネルへログイン

エックスサーバーのサーバーパネルへログインしましょう。

サーバーパネル:https://www.xserver.ne.jp/login_server.php

PHP Ver.切り替えをクリック

PHP Ver.切り替えをクリック

ログイン後、TOP画面で、「PHP Ver.切り替え」をクリック。

PHPのバージョンを切り替えたいドメインを選択

PHPのバージョンを切り替えたいドメインを選択

エックスサーバーで所有しているドメイン一覧が表示されます。この中から、PHPのバージョンを切り替えたいドメインで「選択する」をクリック。

エックスサーバーはドメイン毎にPHPのバージョンが変更できるので、ここにドメイン一覧が表示されるのです。

PHPのバージョンを選択する

PHPのバージョンを選択する

次の画面で、「変更後のバージョン」をクリックしてPHPのバージョンを選びます。

  • PHP7.1.4
  • PHP7.0.18

のどちらかであればOK。元々のバージョンがこの2つなら、変更の必要はありません。

変更する際は、PHP7.1.4でいいかなと。

選んだら、「PHPバージョン切替(確認)」をクリック。

「PHPバージョン切替(確定)」をクリック。

その後、↑のような画面が出るので、「PHPバージョン切替(確定)」をクリック。

これでPHPのバージョン切り替えは完了です!

エックスサーバーの高速化でやるべきことをまとめると

今回説明したことをまとめると、

  1. mod_pagespeed
  2. PHPのバージョンをPHP7.1.4へ変更

この2つです。手間取っても30分あれば、完了するので、サイトを高速化させてみましょう〜!