今よりちょっと良いサーバーがほしい方へ

エックスサーバーでサイト表示が遅い時に効果がある4つの高速化設定

2018 10/27
エックスサーバーでサイト表示が遅い時に効果がある4つの高速化設定

エックスサーバーでサイトのページ表示速度をアップ
※2018年10月に新しい高速化設定を1つ追加しました。

この記事では、エックスサーバー(xserver)でwebサイト表示が遅い時にすべき、表示速度をアップさせる4つの高速化設定についてお話します。

webサイトのページ表示速度をアップさせるための設定は、エックスサーバーを利用している人なら誰でも簡単にできますので、エックスサーバーで既にサイトを運営している人、これからエックスサーバーでwebサイトを運営しようと考えている人は是非読んでみてください。

GTmetrixでのページ表示速度計測
gtmetrixのページへ

■全て未対応時の計測
全て未対応

■この記事で紹介する4つの対応後の計測
全対応後

クロネコくんのアイコン画像クロネコくん

俺もエックスサーバーでサイトの運営を始めたから、これでさくさくサイトのページが表示されるぜ。

サバくんのアイコン画像サバくん

たしかに、エックスサーバーは初期設定のままでも十分なページ表示速度が出るけど、さらにページ表示速度を上げることも可能だよ。

クロネコくんのアイコン画像クロネコくん

そのためにはプログラムやサーバーの専門知識が必要とか言うんじゃないだろうな?

サバくんのアイコン画像サバくん

主にエックスサーバーのコントロールパネルから変更するだけだから、プログラムやサーバー専門知識はいらないし、全作業5分程度で終わるよ。

クロネコくんのアイコン画像クロネコくん

それなら、俺もサイトのページ表示速度をさらに速くしたいから早く教えてくれよ。

webサイトのページの表示速度をアップさせるためにエックスサーバーのコントロールパネルで行う設定は以下の4つになります。

エックスサーバーのコンパネで行う作業

  • webサイトに無料SSLを適用する
  • サイトで動かす上で利用しているPHPのバージョンを7.2(最新)にアップする
  • mod_pagespeedを適用する
  • Xアクセラレータを適用する

それでは順番に説明してきましょう。

目次

webサイトに無料SSLを設定する

エックスサーバーではwebサイトをSSL対応して「https」にした場合。

「http」の時よりサイトのページ表示速度が早くなる『HTTP/2通信』の技術が採用されています。

ですので、無料SSL対応して「https」にするとwebサイトのページ表示速度が早くなります。

また、エックスサーバーでのサイトの無料SSL対応は何サイトでも可能となっています。

クロネコくんのアイコン画像クロネコくん

他のレンタルサーバー会社だったら、全サイト無料でSSL対応できないのか?

サバくんのアイコン画像サバくん

そうなんだよ。他のレンタルサーバー会社だと1サイト限定で無料だったり、全サイト有料だったりするんだ。そのことを考えたらエックスサーバーは太っ腹だと思うよ。

全サイトを無料SSL対応できるレンタルサーバー会社の数は多くないので、SSL対応のwebサイトを複数運営する場合はエックスサーバーは有力な候補と言えるでしょう。

無料SSL対応前と対応後のページ表示速度について

どちらのパターンも5回ずつ判定して、それぞれ一番良かった記録を表示しています。

■全て未対応時
全て未対応

■webサイトに無料SSL対応後
SSL対応

クロネコくんのアイコン画像クロネコくん

おっ、少しだけだがページ表示速度が上がってるな。

サバくんのアイコン画像サバくん

そうだね。ちなみにwebサイトに無料SSL対応後のスコアが、無料SSL対応前のスコアより下回ったのは1回だけだったよ。

結果の通り、わずかですがページ表示速度は速くなっています。

ですので、webサイトに無料SSL対応することはページ速度アップの効果があると言えるでしょう。

webサイトを無料SSL対応する他のメリット

webサイトをSSL対応(https化)するメリットはページの表示速度を早くするだけはありません。

Google検索エンジンでは「http」のサイトより「https」のサイトの方をSEO面で優遇しています。

他にもGoogleChromeで「http」のサイトを閲覧時、そのサイトは「脆弱性があるサイト」として警告表示する対応を2017年中に行うと発表しています。

ですので、今後は「http」でwebサイトを運営していると、webサイトを訪れたユーザーが即離脱する原因となるでしょう。

サバくんのアイコン画像サバくん

もはや、SSL対応せずに「http」のままにしておくことは「百害あって一理なし」の状況になってるから、サイトのSSL対応するのをオススメするよ。

クロネコくんのアイコン画像クロネコくん

たしかに、webサイトのページ表示速度も早くなってSEO面でも優遇されるならいい事づくめだしな。

エックスサーバーでサイトのSSL対応手順

エックスサーバーでサイトの無料SSL対応はエックスサーバーのコントロールパネルの操作と、WordPress管理画面の操作で対応できます。

サバくんのアイコン画像サバくん

サイトがSSL対応されるまでは長くて1時間くらいかかるけど、自分でやる作業自体は2分もかからないよ。

それでは、エックスサーバーでwebサイトをSSL対応する手順を説明していきましょう。

コントロールパネルのSSL設定のリンクを押す

エックスサーバーSSL設定_1
エックスサーバーのコントロールパネルのトップ画面から「SSL設定」のリンクをクリック(タップ)します。

SSL対応したいサイトのドメインを選択する

エックスサーバーSSL設定_2
ドメイン選択画面が開いたら、SSL対応したいwebサイトのドメインの「選択する」リンクをクリック(タップ)します。

SSL設定画面で独自SSLの追加設定を押す

エックスサーバーSSL設定_3
SSL設定画面が開いたら「独自SSLの追加」をクリック(タップ)します。

サバくんのアイコン画像サバくん

SSL設定画面に前画面で選択したドメイン名が表示されるから、SSL対応したいドメインが間違っていないか確認してね。

独自SSL設定を追加する

エックスサーバーSSL設定_4

上記図の画面が表示されたら「独自SSL設定を追加する(確定)」ボタンをクリック(タップ)します。

サイトにSSL反映されるまで待つ

エックスサーバーSSL設定_5

「独自SSL設定を追加する(確定)」ボタンをクリック(タップ)したら、webサイトのSSL対応が始まります。

エックスサーバーSSL設定_6

この画面になったらエックスサーバーのコントロールパネルでの操作は全て完了です。

サバくんのアイコン画像サバくん

webサイトがSSL対応されて「http」から「https」になるまで1時間ほどかかるから待っていてね。

クロネコくんのアイコン画像クロネコくん

webサイトのSSL対応が終わったか確認する方法はないのか?

対象のwebサイトのSSL対応が終わったかの確認はエックスサーバーのコントロールパネルからできます。

webサイトのSSL対応の確認方法

エックスサーバーSSL設定_7
SSL設定の一覧画面で、SSL用アドレスをクリック(タップ)します。

エックスサーバーSSL設定_8
上記図のように表示されたら、webサイトのSSL対応中なので待ちましょう。

エックスサーバーSSL設定_9
webサイトのSSL対応が完了していたら、サイトのトップページが表示されます。

ここまで確認できたら、次はWordPressのURL設定を「http」から「https」に変更しましょう。

WordPressの管理画面でhttps設定を行う

エックスサーバー側でのSSL対応で、サイトに使用しているドメインはSSL対応されました。

しかし、WordPressで管理している各ページのURLは「http」のままなので、WordPressの管理画面から「https」に変更しましょう。

WordPressの一般設定画面を開く

WordPress_SSL設定_1
WordPressの管理トップ画面から、「設定」>「一般」をクリック(タップ)します。

サイトのアドレスを変更する

WordPress_SSL設定_2
一般設定画面で「WordPressのアドレス(URL)」と「サイトアドレス(URL)」の『http』を『https』に変更します。

WordPress_SSL設定_3
一般設定画面の下部に「変更を保存」ボタンがあるのでクリック(タップ)します。

WordPressのログイン画面が表示されてhttps化されていたら成功

WordPress_SSL設定_4
一般設定画面で変更を保存したら、ログイン画面に遷移します。

ログイン画面に遷移して、URLが「https」になっていたらWordPress側でのSSL対応設定は全て完了です。

サバくんのアイコン画像サバくん

これでwebサイトの全ページが「http」から「https」に変更されるよ。

PHPのバージョンを7.2.6にアップする

PHPはバージョンは最新のものにしておくと、webサイトのページ表示速度が向上します。

エックスサーバーでは現在(2018年7月)、「PHP5.1.6」~「PHP7.2.6」まで設定できるようになっています。

サバくんのアイコン画像サバくん

この記事の冒頭で紹介していた、ページ表示速度のスコアはPHP「5.6.36」で計測したものになるよ。

PHP5.6.36とPHP7.2.6のページ表示速度について

どちらのパターンも5回ずつ判定して、それぞれ一番良かった記録を表示しています。

■SSL対応 + PHP5.6.36
SSL対応

■SSL対応 + PHP7.2.6
SSL対応とPHPバージョン対応

クロネコくんのアイコン画像クロネコくん

こっちの対応でも、少しだけだがページ表示速度が上がってるな。

webサイトのSSL対応と同じく、わずかですがページ表示速度は速くなっています。

ですので、PHPのバージョンアップはページ表示速度の向上にわずかとは言え効果があると言えるでしょう。

サバくんのアイコン画像サバくん

また、PHPは最新バージョンの方が脆弱性は少ないから、webサイトのセキュリティの向上にもつながるよ。

クロネコくんのアイコン画像クロネコくん

なるほど。ページ表示速度アップ以外にもメリットがあるってことだな。

サバくんのアイコン画像サバくん

そういうことだね。

PHPのバージョンアップをする前にバックアップとる

PHPのバージョンアップを行うwebサイトで、古いプラグインや古いWordPressのテーマを使っている場合。

PHPのバージョンアップをすると、プログラムエラーでwebサイトが不具合を起こす可能性があります。

サバくんのアイコン画像サバくん

正直、不具合を起こす可能性はほとんど無いよ。でも、バックアップをとっておくと、いざという時にも安心して対応できるよ。

エックスサーバーでPHPバージョンアップ手順

PHPのバージョンアップ対応は、エックスサーバーのコントロールパネルの操作のみで対応できます。

コントロールパネルのPHP ver切り替えのリンクを押す

エックスサーバーPHPバージョン設定_1
エックスサーバーのコントロールパネルのトップ画面から「PHP ver切り替え」のリンクをクリック(タップ)します。

PHPのバージョンをアップしたいサイトのドメインを選択する

エックスサーバーPHPバージョン設定_2
ドメイン選択画面が開いたら、PHPのバージョンをアップしたいwebサイトのドメインの「選択する」リンクをクリック(タップ)します。

PHPのバージョンを変更する

エックスサーバーPHPバージョン設定_3
PHPのバージョン切り替え画面が表示されたら、「変更後のバージョン」項目で7.2を選択して「PHPバージョン切替(確認)」ボタンをクリック(タップ)します。

エックスサーバーPHPバージョン設定_4

確認画面が表示されたら「PHPバージョン切替(確定)」ボタンをクリック(タップ)します。

PHPのバージョン変更完了

エックスサーバーPHPバージョン設定_5

上記図の画面が表示されたらPHPのバージョン変更は完了となります。

mod_pagespeedを適用する

エックスサーバーから対象のwebサイトに拡張モジュール「mod_pagespeed」の使用できます。

「mod_pagespeed」を使用することにより、Webサイトのコンテンツを最適化して、webサイトのページ表示速度の向上と転送量の削減ができます。

mod_pagespeed適用後のページ表示速度について

どちらのパターンも5回ずつ判定して、それぞれ一番良かった記録を表示しています。

■SSL対応 + PHP7.2.6 + mod_pagespeed未適用
SSL対応とPHPバージョン対応

■SSL対応 + PHP7.2.6 + mod_pagespeed適用
全対応後

クロネコくんのアイコン画像クロネコくん

本当に少しだけページ表示速度が向上した感じだな。

サバくんのアイコン画像サバくん

正直、やらないよりはマシって程度だけど、一応ページ速度向上の効果はあるよ。

「mod_pagespeed」を使用前より、webサイトのページ表示速度が落ちることはありませんし。

「mod_pagespeed」の使用の設定はエックスサーバーのコントロールパネルから1分で設定できるので、SSLの対応やPHPのバージョンアップと合わせて対応するとよいでしょう。

エックスサーバーでmod_pagespeedの使用設定手順

対象のサイトに「mod_pagespeed」の使用する設定は、エックスサーバーのコントロールパネルから1分で設定できます。

コントロールパネルのmod_pagespeed設定のリンクを押す

エックスサーバーmod_pagespeedの設定1
エックスサーバーのコントロールパネルのトップ画面から「mod_pagespeed設定」のリンクをクリック(タップ)します。

mod_pagespeedを使用したいサイトのドメインを選択する

エックスサーバーmod_pagespeedの設定2
ドメイン選択画面が開いたら、mod_pagespeedを使用したいwebサイトのドメインの「選択する」リンクをクリック(タップ)します。

mod_pagespeedの使用を適用する

エックスサーバーmod_pagespeedの設定3
mod_pagespeed画面が表示されたら「ON」にするボタンをクリック(タップ)します。

サバくんのアイコン画像サバくん

SSLの対応と同じく、mod_pagespeedを使用したいドメインが間違っていないか確認してね。

エックスサーバーmod_pagespeedの設定4

上記画面が表示されたら、mod_pagespeedの使用適用は完了となります。

クロネコくんのアイコン画像クロネコくん

リンクやボタンをクリックしただけなんだが、本当にこれだけでいいのか?

サバくんのアイコン画像サバくん

うん。これだけの設定でmod_pagespeedが使用されるようになるよ。

Xアクセラレータを適用する

Xアクセラレーター
■2018年10月に追記しました。

2018年9月に新しく実装された、Xアクセラレータという高速化機能をサイトに適用すれば表示が早くなります。

サバくんのアイコン画像サバくん

Xアクセラレータを適用すると、サイト表示が早くなるだけじゃなく、同時に大量アクセスが来てもサイトが遅くなりにくかったり落ちにくくなる効果もあるよ。

Xアクセラレータも無料かつ適用してみて合わなかったらすぐ外すことも可能なので、1度サイトに適用してみることをおすすめします。

サバくんのアイコン画像サバくん

Xアクセラレータの適用手順とサイトに適用した結果については以下の記事を参考にしてね。

あわせて読みたい
Xアクセラレータ導入時に注意する事とサイトが早くなったか結果紹介
Xアクセラレータ導入時に注意する事とサイトが早くなったか結果紹介2018年9月にエックスサーバーで実装された新機能Xアクセラレーターの「効果」・「導入にあたり注意すること」・「導入手順」・「実際に導入してサイトが早くなったかの結果」をまとめて説明します。

まとめ

エックスサーバーPageSpeed Insightsでの計測

エックスサーバーは国内のレンタルサーバーの中でもトップクラスのページ表示速度を持っています。

しかし、本当にページ表示速度を最大限に引き出そうとするなら、この記事で説明した高速化のための設定変更を行う必要があります。

いずれの設定変更も簡単にできるので、自分のwebサイトを見に来てくるユーザーのユーザビリティやSEO向上のためにも設定してみてください。

クロネコくんのアイコン画像クロネコくん

無料かつ5分程度の作業でページ表示速度が上がるなら、お得そうだしやってみるか。

サバくんのアイコン画像サバくん

うん。この記事に書いてある通りにやれば誰でも簡単に設定できるから是非やってみてね。

この記事はここまでです。

最後まで読んで頂きありがとうございました。

コメント

コメントする

目次
閉じる