PageSpeedInsightsとは？サイトの表示速度を改善

読み込みに長い時間がかかるようなWebサイトだと、良質なコンテンツを準備していたとしても見てもらう前に訪問者が離れてしまいます。サイトの表示速度を改善するためには、現状の把握が重要です。本記事では、表示速度の改善に役立つGoogle PageSpeed Insightsを紹介します。

Google PageSpeed Insights（ページスピードインサイト）とは？特徴を解説

Google PageSpeed Insightsとは、パソコンやスマートフォンでWebサイトのページを表示した際、さまざまな要素の読み込みや反応にかかる速度を測定するツールです。PageSpeed Insightsの特徴は次のとおりです。

表示速度を評価してスコア化する

PageSpeed Insightsでは、WebサイトのURLを入力するだけでページの表示速度に関するさまざまな測定を行い、スコアや秒数を表示します。

パソコンとスマートフォンのそれぞれでページの読み込み時間を測定したうえで、100点満点でのスコアが表示されるため、表示速度の状況を簡単に把握できます。サービスの利用は無料で、登録も必要ありません。

表示速度に関する問題を分析する

PageSpeed Insightsは、単に表示速度のスコアを表示するサービスではありません。Webサイトのパフォーマンス上の問題を分析・診断し、問題点を提示します。

問題点の解決に向けた改善方法を示すだけでなく、改善を実施することで、読み込み時間がどれだけ短くなるかという推定時間も表示します。推定時間が表示されるため、より効果の高い対策を優先して実施することが可能です。これにより、効率的にWebサイトの改善に取り組めるでしょう。

競合サイトのスコアも確認できる

表示速度のスコアの確認をするには、WebサイトのURLを入力するだけです。このため、URLさえ入力すれば、競合サイトについても容易に分析できます。自社が運営するWebサイトと競合サイトのスコアを比較すれば、表示速度に関する問題をより詳しく分析できるでしょう。

PageSpeed Insightsでできることとは？

PageSpeed Insightsは、Webサイトの読み込み時間について複数の指標を用いて評価することで、表示速度に関する問題点を診断できます。PageSpeed Insightsにおける評価では、実際にWebサイトを訪れたユーザーのデータをもとにした評価と、特定の環境におけるシミュレートによる評価の2つの結果が確認可能です。

以下では、評価に用いられている指標からどのようなことがわかるのかについて解説します。なお、評価の仕方によって用いられている指標が若干異なりますので、ご注意ください。

視覚コンテンツの初期表示時間

1つ目の指標は、視覚コンテンツの初期表示時間（First Contentful Paint：FCP）です。FCPは、ページの読み込みを開始してから、ページ内のコンテンツのいずれかの部分が、最初に画面上に表示されるまでの時間を表します。

画面全体の表示にかかる時間ではなく、視覚的に認識されるコンテンツの一部の表示にかかる時間です。読み込みを開始してから、最初のコンテンツの表示が完了するまでにかかる時間は、ユーザーの第一印象に影響を与えます。FCPは3段階評価であり、0秒以上1.8秒未満でグリーン（良好）、1.8秒以上3.0秒未満でオレンジ（要改善）、3秒以上でレッド（不良）が表示されます。

最大視覚コンテンツの表示時間

2つ目の指標は、最大視覚コンテンツの表示時間（Largest Contentful Paint：LCP）です。LCPは、ページの読み込み開始から、ページ内のもっとも大きいコンテンツが画面上に表示されるまでの時間を表します。

FCPはページ内のコンテンツの一部を表示するのにかかる時間であるため、FCPが速いからといって、必ずしもユーザーにとって利用しやすいWebサイトとは言い切れません。

LCPは、ページ内のおもなコンテンツの読み込み速度を計測することで、ユーザーにとってのページの利便性を示す指標です。ページの利便性の面で、ユーザーに強く印象に残る要素のため、パフォーマンスの診断指標の中でも重要度が高い指標といえます。

LCPのスコアを高くすることで、ユーザーが快適に利用できるWebサイトへと改善できるでしょう。LCPは3段階評価であり、0秒以上2.5秒未満でグリーン（良好）、2.5秒以上4.0秒未満でオレンジ（要改善）、4秒以上でレッド（不良）が表示されます。

初回入力までの遅延時間

3つ目の指標は、初回入力までの遅延時間（First Input Delay:FID）です。FIDは、Webサイトのページ上でユーザーが入力やクリック・タップを行った際の反応にかかる時間を表します。

LCPがユーザーの第一印象にかかわる指標だとすると、FIDはユーザーが継続して利用してくれるかの指標だといえます。どれだけLCPのスコアがよいとしても、ページ上の動作が遅いWebサイトはユーザーに嫌がられてしまいます。

ユーザーに好まれるのは、表示が速く、かつ、応答も速いページです。FIDは3段階評価であり、0ミリ秒以上100ミリ秒未満でグリーン（良好）、100ミリ秒以上300ミリ秒未満でオレンジ（要改善）、300ミリ秒以上でレッド（不良）が表示されます。

累積レイアウトシフト数

4つ目の指標は、累積レイアウトシフト数（Cumulative Layout Shift：CLS）です。CLSは、Webサイトのページにおける、予期しないレイアウトのずれを数値化して表します。

予期しないレイアウトのずれとは、Webサイトのそれぞれのコンテンツの読み込みにかかる時間差によって生じる、レイアウトのずれのことです。たとえば、読み込み時間の短いテキストが先に表示され、読み込みに時間がかかる画像が後から表示されることで、テキストが画像に押し出されて下にずれるといった場合を指します。

読んでいる最中に、テキストがずれるだけでもユーザーに不快感を与えてしまいますが、ずれるコンテンツがテキストではなくボタンであったときはより深刻な問題になります。キャンセルを押そうとした瞬間にボタンがずれ、意図せずOKを押すようなことがあれば、ユーザーは大きな不快感を抱くでしょう。

この予期しないレイアウトのずれは、サイトの運営者にはわかりにくいことが多いため、客観的に判断できるCLSのスコアを確認することで、Webサイトの安定性を確保できます。CLSは3段階評価であり、0以上0.1未満でグリーン（良好）、0.1以上0.25未満でオレンジ（要改善）、0.25以上でレッド（不良）が表示されます。

操作可能になるまでの時間

5つ目の指標は、操作可能になるまでの時間（Time to Interactive:TTI）です。TTIは、FCPの測定後に、ユーザーの操作に対して50ミリ秒以内に応答する状態になるまでの時間を表します。見かけ上は操作可能に見えるページにもかかわらず、実際には操作できない状態にあるページを見つけるうえで役に立ちます。

このような操作可能に見えて操作できないページは、ユーザーに不快感を与えるため改善が必要です。TTIは3段階評価であり、0秒以上3.8秒未満でグリーン（良好）、3.8秒以上7.3秒未満でオレンジ（要改善）、7.3秒以上でレッド（不良）が表示されます。

合計ブロック時間

6つ目の指標は、合計ブロック時間（Total Blocking Time:TBT）です。TBTは、FCPからTTIまでの時間に、発生している50ミリ秒以上実行しているタスクによるブロック時間の合計を表します。

ページ上でユーザーが入力やクリック・タップを行った際に、応答がブロックされる時間がどれだけあるかがわかります。性質上、TTIとの関係性が強い指標です。

TBTは3段階評価であり、0ミリ秒以上200ミリ秒未満でグリーン（良好）、200ミリ秒以上600ミリ秒未満でオレンジ（要改善）、600ミリ秒以上でレッド（不良）が表示されます。

スピードインデックス

7つ目の指標は、スピードインデックス（Speed Index:SI）です。SIは、視覚コンテンツの表示にかかる時間を表します。メインコンテンツの表示速度については、LCPがより適切な指標であると考えられており、指標としてのSIの重要性はやや下がります。

SIは3段階評価であり、0秒以上3.4秒未満でグリーン（良好）、3.4秒以上5.8秒未満でオレンジ（要改善）、5.8秒以上でレッド（不良）が表示されます。

PageSpeed Insightsの活用方法

PageSpeed Insightsは、Webサイト利用時のユーザー体験の向上につながる表示速度の改善に役立ちます。上述の指標ごとに評価が確認できるので、評価がオレンジまたはレッドで表されている項目に取り組んでみましょう。

改善できる項目については、短縮できる時間とともにWebサイトの画像などを表示して具体的な修正点が提示されます。短縮できる時間が大きい項目から取り組むことをおすすめします。

画像の最適化やリソースの圧縮など、PageSpeed Insightsが提示するさまざまな改善を実施すれば、Webサイトの読み込み速度を向上することが可能です。

なお、PageSpeed Insightsでは100点満点でスコアが表示されますが、100点の評価を目指す必要はありません。一般的に、スマートフォン向けのサイトであれば40点以上、パソコン向けのサイトであれば50点以上を獲得することが目安とされています。

PageSpeed Insightsは海外から測定しているため、スコアが低くなる傾向があることも一因です。スマートフォンまたはパソコンのスコアが上記の目安に満たない場合、まずは目安のスコアを上回ることを目指して改善を進めてみましょう。

まとめ

PageSpeed Insightsの紹介でした。PageSpeed Insightsは無料で手軽にWebサイトの表示速度を評価できるツールです。改善点や短縮できる時間が提示されるため、表示速度の改善につなげられます。

Webサイトの表示速度の改善は、ユーザー体験の向上には欠かせない要素です。よりよいWebサイトを作り上げるために、PageSpeed Insightsで現在の表示速度を確認してみてはいかがでしょうか。