3つだけやろう、ページ表示速度の改善方法【SEOにも好影響】

ご存知の通り、ウェブページの表示速度は速い方が良いです。

それはわかっていても、技術的に難しいことが多く、どうやればいいのかわからない、という方も多いはずです。

このページでは表示速度改善が確実に行える方法を3つだけ紹介しています。

全部やれば完璧ですが、たった一つだけに取り組むだけでも大幅な速度改善が可能なものばかりです。

難易度別に紹介していますので簡単なものからやってみてください。

このページの内容(目次)

ウェブページの表示に3秒以上かかってはいけない

表示にかかる時間と直帰率

Googleの調査によると、表示速度は下がれば下がるほど直帰率が上がります。

表示速度が1秒のページと比較し、
3秒かかると直帰率は1.32倍になる
5秒かかると直帰率は1.90倍になる
6秒かかると直帰率は2.06倍になる
(以降省略)

https://www.thinkwithgoogle.com/marketing-strategies/app-and-mobile/mobile-page-speed-new-industry-benchmarks/

表示速度が3秒以上になると、あからさまに直帰される割合が急増します。

記事内容がつまらなくて直帰されてしまうならまだしも、1文字も読まれないなら中身を改善することすらできません。

特にモバイルでは顕著で、

53% of visits are abandoned if a mobile site takes longer than 3 seconds to load.

(モバイルは読み込みに3秒以上かかると、53%が直帰します。)

https://www.thinkwithgoogle.com/consumer-insights/consumer-trends/mobile-site-load-time-statistics/

表示に3秒かかれば半分の人が一切見ずに帰っていくとのこと。

コアウェブバイタルの LCP(Largest Contentful Paint)では、2.5秒未満が「良好」、4秒以下は「改善が必要」、4秒を超えると「不良」と判断されます。

つまり、表示速度は2.5秒以内になっていればひとまずOKです。3秒もかかってはいけないということです。かなり厳しいですね。

表示速度はSEOの順位にどこまで影響が出るのか

表示速度はランキング要素

Googleのアルゴリズムで特に表示速度に関するものとしては、2010年4月時点ですでにPC版にページの表示速度をランキング要素に組み込むことにしたと説明されています。

Like us, our users place a lot of value in speed — that's why we've decided to take site speed into account in our search rankings.

(ユーザーは速度を重視しています。そのため、検索ランキングではサイトの速度を考慮に入れることにしました。)

https://developers.google.com/search/blog/2010/04/using-site-speed-in-web-search-ranking

さらに2018年1月にはスマホでの表示にも表示速度はランキング要素として組み込まれる「スピードアップデート」というものが実施されています。

つまり、ページの表示速度はランキングを決める要素の一つです。当然、速度が遅い場合には順位の低下や上がり切らないといったことが起こり得ます。

ただし、表示速度のランキング考慮とは、

  • 極端に遅すぎる場合に限り適用される
  • 普通くらいの速度のページをさらに早くしも加点しない

といったものなので「極端に遅いページの順位を下げるもの」です。

どのくらいを極端というのかといえば、20秒とか30秒とか、およそ普通の人なら待たないはずの時間がかかるような場合です。

どちらかと言えば、表示速度が遅いせいで直帰率上がり、「このまま上位にいてもユーザーは好まない(順位を落とすべき)」という判断が発生することの方が問題です。

表示速度の現実的な改善方法は3つ

ページの表示速度の改善方法は多岐にわたります。

中には、難易度が高い割には効果が低いというものもあるため、比較的取り組みやすく、効果が高いもの3つに絞って紹介します。

初級:画像の圧縮(一番簡単な上、一番影響が大きい)

画像圧縮は表示速度改善に効果絶大

ページの表示に一番時間がかかるのは実は転送量です。

ウェブページの本文やスタイルシート、JavaScriptはテキストなので、合計しても500KB~1MBくらいなので、それほど容量は大きくありません。

一方画像は1枚あたり200KBくらいになることもザラで、それが小さいものから大きいものまで数十枚読み込まれることになるので、2~5MBくらいにすぐになります。

画像は無圧縮の状態だとそのくらいのサイズですが、圧縮をすると半分近くサイズを減らせることが多いです。

もし画像の圧縮をまだしていないのであれば、まずは画像の圧縮から始めるのが最も簡単で効果が高い施策です。

参考:画像の圧縮の仕組み

JPGやPNGは既に圧縮されたフォーマットですが、おおよそ下記のような方法でさらなる圧縮が可能です。

画像圧縮の概念

中級:プラグインの削除(支障がないものは削除)

プラグインを削除すると高速化できる

プラグインは便利なものも多いので、ついつい入れ過ぎがちです。

プラグインを多く入れすぎると遅くなる、というのは具体的に下記のようなことをするためです。

  • ページを表示するたびに、初期化が行われ、その際にプラグインを実行する必要があるかどうか判定される(数が多くなればなるほど初期化に時間がかかる)
  • 特定のページでしか使われないプラグインであっても、実行するかどうかの判断は行われる。
  • 特定のページでしか使われないプラグインであっても、実行に備えてプラグイン用のCSSやJSをページに読み込む

上記のような「しなくてもいい処理」を毎回することによって遅くなります

プラグインによっては動作の重いものもあるので、減らせば減らしただけ軽くなります。

プラグインを減らすコツ
  • どのプラグインが重たくしている犯人か特定するP3 (Plugin Performance Profiler)を入れて試してみる
  • いつか使うと無効化しているもの・何に使っているか忘れたものは削除する
  • 管理者向けのユーティリティは削除する
  • 計測用ユーティリティはGAで代替えできないか検討する
  • 全ページで使わない機能は代替方法がないか検討してみる
  • 自動化して楽をしているものは手動に戻せないか検討してみる
  • 削除することで、ユーザーの閲覧上支障のないものは削除する
  • ずっと有効化しておく必要のないものは無効化するか削除し、使うたびに入れる

特にP3を使ってスキャンすると、表示に時間がかかるプラグインが何かわかります。重たいプラグインから優先的に削除ができないか検討してみてください。

上級:高速なサーバーに乗り換えると全然違う

実費がかかり、手間もかかるのでやや上級向けですが、サーバーを乗り換えるだけで速度が上がる場合があります。

  • そもそもサーバーのスペックが低い
  • サーバーの回線が早くなる

単純にこの2点です。

私以前はCORESERVERを使っていましたが、1つのサーバーに詰め込みすぎているのか、かなり重たいサーバーでした。

単純に乗り換えただけで管理画面の画面遷移で4秒以上、サイトの表示で2秒以上短縮できましたので、遅いサーバーを使っている場合は乗り換えを検討してみるといいかもしれません。多くのサーバーではお試し期間も設けられているので事前に試すことができるはずです。

早くなったかどうか確認:表示速度の計測方法

計測には主に2つのツールを使うといいです。どちらも使い方はURLを貼り付けるだけなので簡単です。

Test My Site で良し悪しを判断

Test My Siteで2.5秒を切ればOK

Googleが提供しているツールで、Test My Site という計測サイトがあります。モバイルの速度を計測し、様々な情報を提供してくれるツールです。

画像のように、「通常」とか「良好」のように表示されればひとまず問題はありません。

PageSpeed Insights でより改善できるところを発見

PageSpeed Insightsでさらに改善できる箇所を発見

PageSpeed Insights(ページスピードインサイト)はページ速度の分析に使われるツールです。

様々な指標で細かく分析され、ページにある要素のうち改善が可能な要素を提示してくれます。

計測結果は結構厳しめ

ただ、このツールはかなり厳しめに評価が出ます。様々な理由でこれ以上改善は難しいと判断せざるを得ないこともあると思いますので、「できるならやる」でOKです。

余力があればキャッシュとコード圧縮にも取り組んでみよう

このページでは、表示速度の改善で最も効果が大きいと思われるものを紹介しました。

これ以外の方法として、「キャッシュ」と「コードの圧縮」というのがあります。

どちらも、WordPressの高速化プラグインを利用すれば設定可能です。

キャッシュ

WordPressはアクセスの都度動的にページを作るソフトです。

アクセス時にプログラムがページに必要な情報を集めて加工して表示しています。

ということは、サーバーのリソースを消費することになるので、出来上がったものを出すだけよりも時間がかかってしまうことになります。

短時間で内容がかわらないのであれば、毎回ページを作る必要はないので、あらかじめ作り終わったものを表示すればよいことになります。

キャッシュは事前に作ったものを提供することでプログラムの実行時間を削減する機能です。

コード圧縮

ページを表示する時に使うHTML・CSS・JSは人間が読めるように改行やコメントなどが含まれています。

機械が解釈するには不要なので、そういった「人間用のコード」を全て削除し、さらにファイルも一つにつなげるなどして転送容量を削減するとともにサーバーへのファイルリクエストの回数を減らす方法です。

個人的にはこの2つはこのページで紹介した方法ほどの効果はない印象があり、余力があれば(追及するなら)やればOKかな、という程度です。

条件によっては効果が大きくなる場合もあります(特にキャッシュは)。

まとめ

  • サイトの表示に3秒以上かかると直帰率が大幅に上がる
  • サイト表示の目安は2.5秒以内
  • 比較的簡単かつ効果の高い高速化は画像の圧縮・プラグインの削除・サーバーの変更。この3つのどれか一つだけでもやっていないものがあれば試してみるべき。
  • 高速化できたかの確認方法は、Test MySitePageSpeed Insights
  • キャッシュとコード圧縮も高速化に貢献できるものの、そこまで大きくは改善しない
このページの内容(目次)
閉じる