WordPressでブログを運営していると、だんだん気になってくるのが表示速度です。
実際にはさほど問題がなくても、あちこちに「WordPressを高速化する方法」や「表示速度は検索順位に関係してくる」なんて記事があるため、対処しなきゃマズイんじゃないか、と思い始めているかもしれません。
ここではWP初心者向けとして、高速化に関する記事をシリーズ化してお届けしていきたいと思います。今回は第1弾として「高速化は本当に必要なのか」「高速化の仕組みはどのようなものか」に焦点を当ててみます。
Headline
これだけは覚えておこう!表示速度に関する基礎知識
まず、なぜ表示速度を改善する必要があるのかを考えてみましょう。
結論から言うと、「ブログを読んでもらうため」です。
表示速度が遅くても問題ない、と思っていたら大間違い。もしかすると、読者を大勢取りこぼしているかもしれないのです。
訪問者は5秒以上待ってくれない
たとえば、何かを検索するとき。検索結果に表示された順にウェブサイトを訪れ、そこに欲しい情報があるのかを判断し、比較検討のために2~3ページ目まで閲覧していくことがありますね。
そのなかで、アクセス直後から何秒経っても真っ白なままの状態で、なかなか表示されないサイトがあったらどうしますか? すぐに検索結果ページに戻って、その下にあるサイトへ移るんじゃないでしょうか。
では、いったい何秒が基準になるのか。訪問割合がどんどん伸びているスマホ環境の場合、74%は表示に5秒以上かかるサイトからは離脱するというデータがあります。
Nearly 60% of web users say they expect a website to load on their mobile phone in 3 seconds or less and 74% are willing to wait 5 seconds or less for a single web page to load before leaving the site. 50% are only willing to wait 5 seconds or less for an application to load before exiting.
リンク切れWhat Users Want from Mobile
また、表示速度が1秒遅くなればPV数が11%減少する、というデータもあります。
忍耐強くページが表示されるのを待っている人でも、その他のページを読もうという気は削がれ、リピーターになってくれる確率はガクンと落ちてしまいます。
参照Aberdeen Group – The Performance of Web Applications: Customers are Won or Lost in One Second
このように、スピードが遅いのはデメリットでしかありません。できれば2秒以内、目指すは1秒というのが今のところ通説となっています。
10秒以上かかるなら、もはや論外です。
検索エンジンも表示速度を順位判定に取り入れている
検索順位はさまざまな要素が絡み合って決定されますが、その中に表示速度という項目もあります。
それほど重要なウェイトを占めているわけではありませんが、仮にライバルサイトと自サイトが表示速度以外の項目で同スコアだったなら、あとはスピード勝負。
せっかくクオリティの高い記事を投入しても、スピードのせいで負けてしまったらちょっと悔しいですよね。というか、ウェブではスピードも質のひとつとして考えられる、と言ったほうが正確かもしれません。
また、せっかく上位表示されているにも関わらず、あまりの遅さにユーザーが中身を見ずに離脱するようなら何の意味もありません。いつアクセスしてもサイト全体が遅いなら、ちょっと考えもの。
なぜWordPressは重くなってしまうのか
同じ環境を整えてWordPressとHTML+CSSのサイトを比べると、あきらかにWPのほうが遅くなります。
WordPressにはプラグインを含め、便利な機能が充実していますが、それが表示速度を遅くする原因にもなるのです。
プラグインを使わなくても、もともとWordPressは1つのページを生成するのにあちこちからデータを読み込む構造になっているため、どこか一部でも遅ければそれがページ全体に影響してしまいます。
『これは便利だ!』と何でもかんでも詰め込むと、結局ユーザーのためになりません。まあ、便利だと思うのは運営者目線であって、読む側からするとまったく必要ないものがたくさんあるんですけどね。
WordPressを高速化する方法
それでは、表示速度を少しでも上げるためにどのような対策をすればよいのでしょう。
大まかに、下記の方法があります。
- サーバーを改善する
- 読み込むデータ量を少なくする
- キャッシュを活用する
ひとつずつ見ていきましょう。
サーバーの性能で表示速度は変わる
WordPressはサーバーを借りて運営しますが、レンタルサーバーの質はピンからキリまで。その性能は、レンタル料とほぼ比例しています。
これは僕が実験したデータですが、以下はエックスサーバーとロリポップ2つのレンタルサーバーに、まったく同じファイル(WordPress)をアップして計測したものです。
サーバー | 応答時間(秒) |
---|---|
ロリポップ | 1.406 |
エックスサーバー | 0.562 |
なんと、両者で約3倍の開きが。
月額料が安くて気軽に借りられるのがロリポップの良いところですが、月間PV数100万を目指して本格的に運営したいなら、今のうちから上位サーバーに変更することをお勧めします。
速く走りたいなら、軽自動車を改造するよりはじめからフェラーリ乗ったほうがいいんじゃない?って話(エックスサーバーはフェラーリとまでいきませんけど…)。
参考WordPress使うならおすすめのエックスサーバーが実質0円!?
データ量を減らせば表示速度は上がる
先述のとおりWordPressには便利なプラグインがたくさんありますが、その1つひとつが表示速度に関係してきます。もし不要なものがあるなら、その整理から始めてみましょう。
なかにはプラグインを使わずに実装できるものだってあります。Googleアナリティクスのコードを入れるなら、header.phpに直接書くとかね。
脆弱性を突かれてブログが改ざんされることもあるので、セキュリティ面でもプラグインを必要最低限のものに抑えておくのは大切です。
見た目は変わらない画像ファイルは圧縮しよう
テキストに比べて容量が多い画像ファイルのサイズをできるだけ削減するのも効果的です。
下の画像は、何も処理していないものと JPEGmini で圧縮したものです。どちらも600px*400pxですが、見た目は変わらないのにファイルサイズが違うのがわかります。
ファイルサイズ:155KB
ファイルサイズ:46.2KB
画像はできるだけ軽くして使いましょう。
WPプラグイン「EWWW Image Optimizer」は欠かせません。
キャッシュを活用して高速化する
さて、この「キャッシュ」が初心者にとって難関です。
WordPressにはキャッシュ系プラグインがいくつかあり、きちんと調整すれば絶大な効果を発揮します。ただ、その調整には知識が要求され、どの環境でも同じように再現できるわけじゃありません。
一口にキャッシュと言っても、下記のように分かれます。
- ページキャッシュ
- データベースキャッシュ
- オブジェクトキャッシュ
- リソースキャッシュ
それぞれを専門に扱うプラグインから、W3 Total Cache のようにすべてをカバーするプラグインもあります。
参考WordPressキャッシュ系プラグインの比較とサイトに適した選び方
「これで高速化した!」という記事はたくさんありますが、その方法を自分のブログに取り入れても、場合によっては速度が低下する可能性もあります。
W3Cが良さそうだと安易にインストールしてしまうと、削除後に管理画面に入れなくなったり、サーバーと相性が悪くて真っ白になったり、ということもあるので初心者が手を出すのはおすすめしません。
当ブログのスピードと今後の対処方法
Naifixは運営から半年が経過し、おかげさまでアクセス数も増えてきました。このままいくとブログが重くなってくるのは目に見えているので、対策をはじめたばかりです。
現状は、.htaccessで画像キャッシュの設定を行っているだけ。
画像の多いこの記事を測定したところ、数値は下記のようになりました。
んー、遅いですね。
参考あなたのWebサイト表示のどこが遅いかを一発で調べるブックマークレット
おなじみの PageSpeed Insights でもモバイルのスコアはとくに低い。
GTmetrix では、YSlow の評価が×。表示時間も6秒後半で、改善すべき点がたくさんありました。
今後の対策スケジュール
というわけで、表示速度改善のために下記の施策を考えています。
- 不要なプラグイン削減
- 不要なウィジェット削除
- JavascriptとCSSの最適化
- キャッシュ関連の最適化
できるだけどの環境でも使えるようにまとめていきます。初心者には不向きなキャッシュ系プラグインを極力使わない、というのが最大の課題。
さて、クリアできるでしょうか。
まとめ
多くの方にブログをストレスなく読んでもらえるようにするため、高速化設定は欠かせません。
ただ、現状で月間PV数が5万にも満たないのであれば、あまり考えなくて良いかも。記事がいきなりバズってブログが重くなったりエラーを吐き出したら、単にサーバーの問題です。
それでも対策しておいて損はありませんので、ひとつずつやっていきましょう。
余談ですが、GTmetrixでダブルAになったとか、表示1秒を達成したというブログがカクカクして遅く感じるのは僕だけでしょうか。全部じゃないですけど、明らかに遅いだろ!というのがいくつか。
余計なことを一切しないほうが速いこともあるので、なんとも難しい分野です。
それでは、また。