ウェブに関する主な指標のしきい値の定義方法

Core Web Vitals のしきい値の根拠となる調査と方法論

Bryan McQuade

Barry Pollard

公開日: 2020 年 5 月 21 日

ウェブに関する主な指標は、ウェブでの実際のユーザー エクスペリエンスの重要な側面を測定する一連のフィールド指標です。Core Web Vitals には、指標と各指標の目標しきい値が含まれています。これにより、デベロッパーはサイトのエクスペリエンスが「良好」、「改善が必要」、「不良」のいずれであるかを定性的に把握できます。この記事では、Core Web Vitals 指標のしきい値の選択に使用されたアプローチと、各 Core Web Vitals 指標のしきい値の選択方法について説明します。

復習: Core Web Vitals の指標としきい値

Core Web Vitals は、Largest Contentful Paint（LCP）、Interaction to Next Paint（INP）、Cumulative Layout Shift（CLS）の 3 つの指標です。各指標はユーザー エクスペリエンスの異なる側面を測定します。LCP は知覚される読み込み速度を測定し、ページのメイン コンテンツが読み込まれた可能性が高いページ読み込みタイムラインの時点をマークします。INP は応答性を測定し、ページを操作しようとしたときにユーザーが感じるエクスペリエンスを定量化します。CLS は視覚的な安定性を測定し、表示されているページ コンテンツの予期しないレイアウトの変化の量を定量化します。

各 Core Web Vitals 指標には、パフォーマンスを「良好」、「改善が必要」、「不良」のいずれかに分類するしきい値が関連付けられています。

また、ページまたはサイトの全体的なパフォーマンスを分類するために、そのページまたはサイトへのすべてのページビューの 75 パーセンタイル値を使用します。つまり、サイトのページビューの 75% 以上が「良好」のしきい値を満たしている場合、その指標のパフォーマンスは「良好」と分類されます。逆に、ページビューの 25% 以上が「低」のしきい値を満たしている場合、そのサイトはパフォーマンスが「低」と分類されます。たとえば、75 パーセンタイルの LCP が 2 秒の場合は「良好」、75 パーセンタイルの LCP が 5 秒の場合は「低速」と分類されます。

Core Web Vitals 指標のしきい値の基準

このセクションでは、Core Web Vitals 指標のしきい値を評価する基準について説明します。以降のセクションでは、これらの基準が適用されて各指標のしきい値が選択された方法について詳しく説明します。今後、ウェブでの優れたユーザー エクスペリエンスを測定する能力をさらに高めるために、基準としきい値の改善と追加を予定しています。

質の高いユーザー エクスペリエンス

Google の第一の目標は、ユーザーとそのエクスペリエンスの質を最適化することであり、そのため、Google は、Core Web Vitals の「良好」のしきい値を満たすページが、高品質のユーザー エクスペリエンスを提供することを目標としています。

質の高いユーザー エクスペリエンスに関連するしきい値を特定するために、Google は人間の知覚と HCI の研究を参考にしています。この研究は、1 つの固定しきい値を使用して要約されることがあります。しかし、その基盤となる研究は通常、値の範囲として表現されています。たとえば、ユーザーがフォーカスを失うまでに通常待機する時間に関する調査では、1 秒と表現されることがあります。しかし、その調査の基盤となる調査では、実際には数百ミリ秒から数秒の範囲で表現されています。ユーザーとコンテキストに応じて認識しきい値が異なるという事実は、集計された匿名の Chrome 指標データによってさらに裏付けられています。このデータは、ユーザーがウェブページのコンテンツが表示されるのを待ってからページ読み込みを中止するまでの時間が一定ではないことを示しています。むしろ、このデータは滑らかで連続的な分布を示しています。人間の知覚のしきい値と関連する HCI 研究の詳細については、ウェブバイタルの科学をご覧ください。

特定の指標について関連するユーザー エクスペリエンスの調査が利用可能で、文献の値の範囲について合理的なコンセンサスがある場合は、この範囲を入力として使用して、しきい値の選択プロセスをガイドします。累積レイアウト シフトなどの新しい指標の場合など、関連するユーザー エクスペリエンスの調査が利用できない場合は、指標のさまざまな候補しきい値を満たす実際のページを評価して、優れたユーザー エクスペリエンスにつながるしきい値を特定します。

既存のウェブ コンテンツで達成可能

また、サイト所有者が「良好」の基準を満たすようにサイトを最適化できるように、ウェブ上の既存のコンテンツでこれらの基準を達成できるようにしています。たとえば、0 ミリ秒は LCP の「良好」なしきい値として理想的であり、即時読み込みのエクスペリエンスを実現できますが、ネットワークとデバイスの処理レイテンシにより、ほとんどの場合、0 ミリ秒のしきい値を実際に達成することはできません。したがって、0 ミリ秒は、Core Web Vitals の LCP の「良好」のしきい値として妥当ではありません。

ウェブに関する主な指標の「良好」のしきい値の候補を評価する際、Chrome ユーザー エクスペリエンス レポート（CrUX）のデータに基づいて、そのしきい値が達成可能であることを確認します。しきい値を達成できることを確認するには、少なくとも 10% のオリジンが「良好」のしきい値を満たしている必要があります。また、フィールド データのばらつきによって、適切に最適化されたサイトが誤って分類されないように、適切に最適化されたコンテンツが「良好」のしきい値を常に満たしていることも確認しています。

逆に、少数のオリジンのみが満たしていないパフォーマンス レベルを特定することで、「低」のしきい値を設定します。「低品質」のしきい値の定義に関連する調査が利用可能な場合を除き、デフォルトでは、パフォーマンスが最も低いオリジンの 10 ～ 30% が「低品質」に分類されます。

デバイスごとに同じ条件を使用するか、異なる条件を使用するか

通常、モバイルとパソコンの使用状況は、デバイスの機能やネットワークの信頼性に関して非常に異なる特性を持っています。これは「達成可能性」の基準に大きく影響するため、それぞれに個別のしきい値を検討することをおすすめします。

ただし、達成基準がデバイスによって異なる場合でも、ユーザーが期待するエクスペリエンスの良し悪しはデバイスに依存しません。このため、Core Web Vitals の推奨しきい値はデバイスごとに分けられず、どちらにも同じしきい値が使用されます。また、しきい値をよりわかりやすくするというメリットもあります。

また、デバイスが 1 つのカテゴリに適切に分類されないこともあります。これは、デバイスのフォーム ファクタ、処理能力、ネットワークの状態に基づくべきでしょうか？しきい値を同じにすると、複雑さを回避できるという副次的なメリットもあります。

モバイル デバイスは制約が多いため、ほとんどのしきい値はモバイルでの達成可能性に基づいて設定されています。これらのしきい値は、すべてのデバイスタイプに共通する正確なしきい値というよりは、モバイル向けのしきい値を表していると考えられます。ただし、ほとんどのサイトではモバイルからのトラフィックが大部分を占めるため、これはそれほど問題ではありません。

基準に関する最終的な考え

候補のしきい値を評価したところ、基準が互いに矛盾することがあることが判明しました。たとえば、しきい値を常に達成することと、常に優れたユーザー エクスペリエンスを提供することの間には、トレードオフが生じる可能性があります。また、人間の知覚に関する研究では通常、値の範囲が提示され、ユーザー行動指標では行動が段階的に変化するため、指標に「正しい」しきい値が 1 つあることはほとんどありません。そのため、ウェブに関する主な指標では、完璧なしきい値は存在せず、複数の妥当な候補の中から選択しなければならない場合もあることを認識しながら、基準に最も適したしきい値を選択しています。「最適なしきい値は何ですか？」ではなく、「どの候補しきい値が基準を最もよく満たしていますか？」という質問に焦点を当てました。

パーセンタイルの選択

前述のように、ページまたはサイトの全体的なパフォーマンスを分類するには、そのページまたはサイトへのすべてのアクセスの 75 パーセンタイル値を使用します。75 パーセンタイル値は、次の 2 つの基準に基づいて選択されました。まず、パーセンタイルでは、ページまたはサイトへのアクセスの大部分で目標レベルのパフォーマンスが達成されていることを確認する必要があります。2 つ目は、選択したパーセンタイル値が外れ値の影響を受けすぎないことです。

これらの目標は、ある程度相反しています。最初の目標を達成するには、通常は高いパーセンタイルを選択することをおすすめします。ただし、パーセンタイルが高いほど、外れ値によって結果の値が影響を受ける可能性も高くなります。サイトへのアクセスの一部が不安定なネットワーク接続で行われ、LCP サンプルが過度に大きくなる場合は、これらの外れ値サンプルによってサイトの分類が決定されることを避けたいと考えています。たとえば、95 番目などの高いパーセンタイルを使用して、100 回のアクセスがあるサイトのパフォーマンスを評価する場合、95 番目のパーセンタイル値が外れ値の影響を受けるには、わずか 5 個の外れ値サンプルで十分です。

これらの目標は多少矛盾しているため、分析の結果、75 パーセンタイル値が妥当なバランスであると判断しました。75 パーセンタイルを基準にすると、サイトへのアクセスのほとんど（4 件中 3 件）で目標レベル以上のパフォーマンスが達成されています。また、75 パーセンタイルの値は外れ値の影響を受けにくい傾向があります。前述の例に戻ると、100 件のアクセスがあるサイトの場合、75 番目のパーセンタイルの値が外れ値の影響を受けるには、25 件のアクセスで大きな外れ値のサンプルが報告される必要があります。100 個のサンプルのうち 25 個が外れ値である可能性はありますが、95 パーセンタイルのケースよりもはるかに低くなります。

Largest Contentful Paint

LCP のしきい値は、次のようなエクスペリエンスの質と達成可能性を考慮して設定されています。

エクスペリエンスの質

ユーザーがタスクから注意をそらさずに待機できる時間は 1 秒とよく言われます。関連する研究を詳しく調べたところ、1 秒は、数百ミリ秒から数秒までの値の範囲を近似的に表すものであることがわかりました。

1 秒の基準としてよく引用される 2 つのソースは、Card らと Miller です。Card は、Newell の統合認知理論を引用して、1 秒の「即時レスポンス」しきい値を定義しています。Newell は、即時応答を「約 1 秒以内（約 0.3 秒から 3 秒程度）に何らかの刺激に対して行う必要がある応答」と説明しています。これは、ニューエールの「認知に対するリアルタイムの制約」に関する議論に沿ったもので、「認知的考慮を呼び起こす環境とのやり取りは数秒単位で行われ」るとされています。これは、およそ 0.5 ～ 2 ～ 3 秒の範囲です。1 秒のしきい値としてよく引用されるミラー氏は、「人間が機械通信で実行できるタスクは、応答の遅延が 2 秒を超えると、性質が大きく変わり、さらに 1 秒ほど延長される可能性がある」と述べています。

Miller と Card の調査では、ユーザーがフォーカスを失うまでに待機する時間は約 0.3 ～ 3 秒の範囲であると説明されています。これは、LCP の「良好」な基準がこの範囲内にあることを示唆しています。また、既存の First Contentful Paint の「良好」しきい値が 1 秒であり、Largest Contentful Paint は通常 First Contentful Paint の後に発生することから、LCP 候補のしきい値の範囲を 1 秒から 3 秒にさらに制限しています。この範囲で条件に最もよく合うしきい値を選択するため、次に、これらの候補しきい値の達成可能性を確認します。

達成可能性

CrUX のデータを使用して、LCP 候補の「良好」なしきい値を満たすウェブ上のオリジンの割合を特定できます。

1 秒のしきい値を満たすオリジンは 10% 未満ですが、1.5 ～ 3 秒の他のしきい値は、少なくとも 10% のオリジンが「良好」なしきい値を満たすという要件を満たしているため、引き続き有効な候補となります。

また、選択したしきい値が、適切に最適化されたサイトで常に達成できるように、ウェブ全体でパフォーマンスが優れたサイトの LCP パフォーマンスを分析し、これらのサイトで常に達成可能なしきい値を決定しています。具体的には、パフォーマンス上位のサイトの 75 パーセンタイルにおいて、常に達成可能な基準を特定することを目指しています。1.5 秒と 2 秒のしきい値は常に達成できるわけではありませんが、2.5 秒は常に達成できます。

LCP の「低い」しきい値を特定するために、CrUX データを使用して、ほとんどのオリジンで満たされるしきい値を特定します。

4 秒のしきい値の場合、スマートフォンからの約 26%、パソコンからの約 21% が低品質と分類されます。これは 10 ～ 30% のターゲット範囲内であるため、4 秒は許容される「低い」しきい値であると結論付けられます。

したがって、Largest Contentful Paint の「良好」な基準は 2.5 秒、「不良」な基準は 4 秒と判断されます。

Interaction to Next Paint

INP のしきい値は、次の品質と実現可能性を考慮して設定されています。

エクスペリエンスの質

研究では、視覚的なフィードバックの遅延が 100 ms 程度であれば、ユーザー入力などの関連するソースによって発生していると認識されるという結論がほぼ一貫して得られています。つまり、Interaction to Next Paint の「良好」な基準はこれに近い値になると考えられます。

Jakob Nielsen のよく引用されるレスポンス時間: 3 つの重要な制限では、システムが即座に反応しているとユーザーが感じる上限として 0.1 秒が定義されています。Nielsen は Miller と Card を引用しており、彼らは Michotte の 1962 年の著書「The Perception of Causality」を引用しています。Michotte の研究では、被験者に「画面上の 2 つの物体」が表示されます。オブジェクト A が動き出し、B に向かって移動します。B に接触した瞬間に停止し、B が動き出して A から離れます。」Michotte は、オブジェクト A が停止してからオブジェクト B が動き始めるまでの時間間隔を変えます。Michotte は、約 100 ms までの遅延では、被験者はオブジェクト A がオブジェクト B の動きを誘発しているという印象を受けるとしています。約 100 ms ～ 200 ms の遅延では、因果関係の認識が混在し、200 ms を超える遅延では、オブジェクト B の動きがオブジェクト A によって引き起こされたものとして認識されなくなります。

同様に、Miller は「コントロールの有効化に対するレスポンス」のレスポンスしきい値を「通常、キー、スイッチ、その他のコントロール メンバーの移動によって、物理的に有効化されたことを示すアクションの指示」と定義しています。このレスポンスは、オペレーターによって誘発された機械的な動作の一部として認識される必要があります。時間遅延: 0.1 秒以下」と「キーを押してから視覚的なフィードバックが表示されるまでの遅延は 0.1 ～ 0.2 秒以下である必要があります」

近年、Kaaresoja らは Towards the Temporally Perfect Virtual Button で、タッチスクリーン上の仮想ボタンをタップしたとき、ボタンがタップされたことを示す視覚的なフィードバックがその後表示されるまでのさまざまな遅延について、同時性の知覚を調査しました。ボタンの押下と視覚的なフィードバック間の遅延が 85 ミリ秒以下の場合、参加者は、視覚的なフィードバックがボタンの押下と同時に表示されたと感じた割合は 75% でした。また、100 ms 以下の遅延では、ボタンの押下の感覚が常に高いと回答した参加者が多かったのに対し、100 ms ～ 150 ms の遅延では感覚が低下し、300 ms の遅延では非常に低いレベルに達しました。

以上のことから、Web Vitals の Interaction to Next Paint の「適切な」しきい値は 100 ms であると結論付けられます。また、300 ms 以上の遅延で品質レベルが低いという報告がユーザーから寄せられているため、理想的にはこれが「低」のしきい値となります。

達成可能性

CrUX のデータを使用して、ウェブ上のオリジンの大部分が 75 パーセンタイル（75% の値）で 200 ミリ秒の INP「良好」しきい値を満たしていることが判明しました。

また、サイトへのアクセスの割合が高い低価格帯のモバイル デバイスで INP を渡せるかどうかにも特に注意を払いました。これにより、200 ミリ秒のしきい値が適切であることがさらに確認されました。

エクスペリエンスの質に関する調査と達成可能性の基準で裏付けられた 100 ms のしきい値を考慮すると、良好なエクスペリエンスのしきい値として 200 ms が妥当であると結論付けています。

LCP の「低い」しきい値を特定するため、CrUX データを使用して、ほとんどのオリジンで満たされるしきい値を特定します。

つまり、「低い」しきい値を 300 ミリ秒に設定できます。

ただし、LCP や CLS とは異なり、INP は人気と逆相関の関係にあります。人気が高いサイトは複雑な場合が多く、INP が高くなる傾向があります。インターネット ブラウジングの大部分を占める上位 10,000 サイトを見ると、より複雑な状況が見えてきます。

モバイルでは、300 ミリ秒の「低」しきい値では、人気のあるサイトのほとんどが「低」に分類され、達成可能性の基準が引き伸ばされますが、500 ミリ秒はサイトの 10 ～ 30% の範囲に適しています。また、200 ミリ秒の「良好」しきい値は、これらのサイトにとっても厳しい基準ですが、モバイルでこの基準を満たしているサイトは 23% あり、最低合格率 10% の基準を満たしています。

このため、ほとんどのサイトでは 200 ms が妥当な「良好」のしきい値であり、500 ms を超えると「不良」のしきい値であると結論付けています。

Cumulative Layout Shift

CLS のしきい値は、次のようなエクスペリエンスの質と達成可能性を考慮して設定されています。

エクスペリエンスの質

Cumulative Layout Shift（CLS）は、ページの表示コンテンツがどの程度移動するかを測定する新しい指標です。CLS は新しい指標であるため、この指標のしきい値を直接示す調査は確認されていません。そのため、ユーザーの期待に沿ったしきい値を特定するために、さまざまな量のレイアウト シフトがある実際のページを評価し、ページ コンテンツの使用時に大きな中断を引き起こす前に許容されると見なされるシフトの最大量を決定しました。社内テストでは、0.15 以上のシフトレベルは常に中断と見なされるのに対し、0.1 以下のシフトは目立つものの、過度の中断とは見なされないことがわかりました。したがって、レイアウト シフトがゼロであることが理想的ですが、0.1 までの値が「良好な」CLS しきい値の候補であると結論付けました。

達成可能性

CrUX のデータによると、オリジンの約 50% で CLS が 0.05 以下となっています。

CrUX のデータでは 0.05 が CLS の「良好」な基準となる可能性があると示唆されていますが、レイアウトの不安定な変化を回避するのが難しいユースケースもあることを認識しています。たとえば、ソーシャル メディアの埋め込みなど、サードパーティの埋め込みコンテンツの場合、埋め込みコンテンツの高さが読み込みが完了するまで不明なことがあります。このため、レイアウト シフトが 0.05 を超えることがあります。したがって、多くのオリジンが 0.05 のしきい値を満たしている一方で、CLS のしきい値を 0.1 に緩和することで、エクスペリエンスの質と達成可能性のバランスが取れると結論付けています。今後、ウェブ エコシステムでサードパーティの埋め込みによって発生するレイアウトの変化に対処するソリューションが見つかれば、Core Web Vitals の今後の改良版で、CLS の「良好」のしきい値を 0.05 または 0 に引き上げられる可能性があります。

また、CLS の「低い」しきい値を決定するために、CrUX データを使用して、ほとんどのオリジンで満たされるしきい値を特定しました。

しきい値を 0.25 に設定すると、スマートフォンからのアクセスの約 20%、パソコンからのアクセスの約 18% が「低」に分類されます。これは 10 ～ 30% の目標範囲内であるため、0.25 が許容される「低い」しきい値であると結論付けました。