Google は Core Web Vitals の指標を変更します。最適化のためにラボとフィールドのデータを使用する方法

当初は 5 月のコア ランキング アップデートの一部であると考えられていた Google のモバイル ページ エクスペリエンス ランキング要素は、数日以内に公開される予定です。準備はできたか?気にしない場合。

観察と調整のために数週間が予約されています.「 ページ体験は8月末までそれらのシステムの一部として完全な役割を果たすことはありません」とGoogleは述べています.その後、デスクトップ ページ エクスペリエンスのランキング要素が次にロールアウトされ、年末までに完全にリリースされる予定です。

Core Web Vitals の指標について

Core Web Vitals は、速度に関連する大きなパフォーマンス メトリックであり、デバイスのビューポートを考慮して、最大 9000 垂直ピクセルのオフスクリーン コンテンツを含む、安定した、表示可能で使いやすいエクスペリエンスを実現するための要素です。これは、通常、メトリック評価が低いほどよいことを意味します。

ランキングの対象となるフィールド データは、実際のユーザー デバイスの電力、画面サイズ、ネットワーク接続によって異なります。ラボ データにはこれらのデフォルト値があり、(Page Speed Insights の場合を除く) 開発者は、あらゆる条件をシミュレートするように調整できます。

ラボ データはランキングに考慮されません。

Core Web Vitals のパフォーマンス メトリックは複雑で不完全であり、ページ エクスペリエンスの障害を修正することは困難な場合があります。 Google は今でも、現場の開発者からのケースに対応して、すべてのツールをアップグレードして、洗練された数式を含むように土壇場で変更を加えました。

何らかのリエンジニアリングが行われたメトリックの影響を受けている場合は、一般的にスコアの向上を期待できます。 Largest Contentful Paint (LCP)Cumulative Layout Shift (CLS) の測定方法の変更が特に役立ちます。

First Contentful Paint の変更点

FCP が実際に 1 でなくても、コンポーネントが Core Web Vitals に貢献するFirst Contentful Paint (FCP) の「良い」スコアを達成するためのしきい値が 1.0 秒から 1.8 秒に増加しました。 FCPは占め最初のバイトまでの時間より、あなたはコードで直接操作する何よりも、サーバーの応答時間の反射を、プラスそれはプロセスにかかる時間は、ブロッキングリソースレンダリングすることができますCSSなどを、。

最大のコンテンツフル ペイントへの変更

ページのライフサイクルにおける重要なマイルストーンである LCP には、もともといくつかのオフスクリーン要素が含まれていませんでした。 LCP は、後でページ DOM から削除された後、または同じサイズの複数の画像がすべて条件を満たす場合でも、最大の要素を特定します。

このような状況は、カルーセルがオフスクリーン スライドのコンテンツを読み込んでキャッシュするときに発生します。もう 1 つの役立つ変更は、背景画像が LCP によって無視されることです。

累積レイアウト シフトの変更

非常に長いブラウジング セッションが CLS スコアを損なうような状況を防ぐために、小さな「ウィンドウ」セッションは 5 秒に制限され、ページの最悪の 5 秒間のレイアウト シフトを見つけるための境界として 1 秒のギャップで終了するとマークされます

これは、完全に上限のないセッションを集計するよりもはるかに優れた変化であり、スコアが極端に大きくなっている場合に 20 分以上かかる可能性があります。

売り上げアップするならホームページ制作で長崎市

古いものは新しい

Google は、ページ エクスペリエンスのランキング要素の一部として古い計算を使用しません。ただし、外れ値の使用例では、セッション全体のスコアが引き続き役立つ場合があります。これらのデータが API によって取得できる方法は、古いスコア計算がそれを望む人々のために第二の人生を送ることができることを意味します。あなたは、独立して、または経由でGoogleのオープンリポジトリにアクセスすることによってそれを取得することができますCRUXレポート(SQL) : uncapped_cumulative_layout_shift

 SELECT uncapped_cls FROM `chrome-ux-report.all.202105`, UNNEST( experimental.uncapped_cumulative_layout_shift.histogram.bin ) AS uncapped_cls WHERE origin = 'https://searchengineland.com'

Page Speed Insights (PSI) データが役立つ場合

トリックは、スコアを取得するための複数の公式な方法を学習することです。これは、表示しているデータについてどう考えるかによってさらに複雑になります。 Page Speed Insights (PSI) は、SEO の専門家によってしばしば強調されますが、全体のストーリーを伝えるのに十分な情報を単独では提供しません。

PSI は、パフォーマンスの問題をトラブルシューティングするための包括的なスナップショットを開発者に提供するように設計されています。 CrUX から入手できる場合、過去 4 週間に集計されたフィールド データは比較に役立ちます。ラボ データとフィールド データの両方の外観は、間違いなく 2 つの間の違いを示します。

差異は、テスト セッション間、および異なるデバイスやネットワークからのテストを比較する際に自然に発生します。したがって、フィールド データは、特定の Web サイトのオーディエンスと同じくらい大きく異なります。したがって、PSI フィールド データは、過去 28 日間に集計されたデータの範囲を表し、最後に完了した 1 日分のデータまで集計されます。

それのCrUX

おそらく、Google のページ エクスペリエンスのランキング要素は、過去 28 日間の同じ集計スコアに依存する可能性があります。ただし、Google のページ エクスペリエンス ランキング要素が前月の 28 日間の集計済み BigQuery データセットに依存していた場合、パフォーマンスが大幅に向上する可能性は低いです。その場合、ランキングの変更は、新しい月の第 2 火曜日に有効になることが期待できます。

つまり、CrUX レポート用の BigQuery データはパフォーマンス最適化プロセスを経て、前月のデータを一般に使用できるように準備します。このようにインデックスを作成し、場合によっては特定のクエリ応答をキャッシュすることで、CrUX ユーザーは、データが最初に収集された 2017 年後半まで遡ってクエリを実行できます。アナウンスメントは、 前月がクエリの準備ができているときに、新しい月の第 2 火曜日に届きます。

ラボ データはより豊富なフィードバックを提供します

PSI の Lighthouse ラボのスコアは、低速のネットワークでのブラウザの性能が不十分な場合など、最悪のシナリオに備えて「上位パーセンタイルを表すように調整されています。 Google は意図的に調整を行っているため、開発者はより豊富なフィードバックを得て、発生する可能性があるが現実世界ではあまり一般的ではない問題をより簡単にトラブルシューティングできます。

ラボのスコアがより平均的な状況を示している場合、ストレス条件下でのページ エクスペリエンスを改善するために変更を行うために開発者が確認する必要があるパフォーマンスのボトルネックは明らかではありません。 PSI 外の Lighthouse、Dev Tools 内、または NPM によってオープン ノード プロジェクトとしてパッケージ化された Lighthouse は、さまざまなシナリオをシミュレートするために調整できます。

フィールド データは実際の使用例を提供します

手元にあるスコアを強化するために使用されたデータ収集方法を理解してスコアを読むことは非常に重要です。 PSI の場合、ラボ データとフィールド データの両方が表示される場合がありますが、同じものとして混同しないでください。 CrUX レポート用にフィールド データが収集されますが、自分で収集することもできます。フィールド データは、Web サイトを実際に使用してブラウザーによって記録されたオーディエンスを示しています。

フィールド データは、Google がページ エクスペリエンスのランキング要素に使用するものであるため、重要です。フィールド データのスコアは、ほぼ常に同じページのラボ データのスコアよりも優れています。長期保管パフォーマンスのために準備されたフィールド データは長期間にわたって安定しており (いくつかの基準で絞り込むことができます)、最近のデータは毎月新しく作成されますが、 ラボ データは新しいテストごとに異なる場合があります

ブラウザーがスコアを送信するために必要な権限を持っている場合、フィールド データが送信され、PSI、 CrUX オープン APIを使用するCore Web Vitals ツール、またはCore Web Vitals JavaScriptを Web ページに書き込むユーザーが使用するために収集されます。フィールド データをリアルタイムで調べる唯一の方法は、JavaScript を記述して、ブラウザ コンソールまたはリポジトリで自分で使用するために収集するか、Google アナリティクスに送信することです。

最適化のためにラボデータを使用する

オープンソースの Lighthouse プロジェクトは、ラボ データを強化するものであり、Dev Tools に実装されており、独自のコマンド ライン インタープリター (CLI) が付属するパッケージにインストールすることもできます。 Dev Tools の Lighthouse は、「上位パーセンタイル」のデフォルトから低下または増強された電力と速度に一致するように構成できます。

たとえば、プログレッシブ エンハンスメント戦略を実装する特定のシミュレートされたしきい値でより精巧なエクスペリエンスを提供するための資金がある場合など、さまざまなパワーと速度をシミュレートすることができます。

CLIの使用

ローカル マシンから作業する使用可能なラボ データは、本番前テストおよび継続的インテグレーション プロセスの一部としてワークフローに統合される可能性があります。このタイプのセットアップでは、Chrome Web ブラウザと Node がインストールされている必要があります。

CLI は、レンダリング エンジンと Lighthouse ライブラリにアクセスするための Chrome ブラウザ プロセスを生成します。それは、その Chrome プロセスから返されたデータを集計し、その後、強制終了します。結果のレポートを開き、デバイスとネットワーク設定に合わせて調整するためのオプションは、コマンド オプションの一部として利用できます。

 $ lighthouse <url> [OPTIONS]

最も一般的なオプションは、システムのデフォルト Web ブラウザーでレポートを自動的に開く--view 、さまざまなデバイス環境をシミュレートするための--throttleディレクティブ、およびテストをパフォーマンスに影響を与え、その後のテストに限定するための--only-categoriesです。 Core Web Vitals の決定要因。 SEO テストを実行することは役に立ちますが、SEO の改善が多すぎても、Core Web Vitals の針を動かすことはできません。

Lighthouse CLI コマンドの例

私たちが気にする理由

私たちは、ページ エクスペリエンスに影響するパフォーマンス要因のトラブルシューティングと改善を学んでいる開発者である場合にのみ、これらの具体的な懸念事項を気にします。 SEO に関心がない場合でも、これらの要素は、WebViews を使用したネイティブ アプリケーションを含む、ページをレンダリングするページとアプリケーションが現場の実際のユーザーにどのように体験されるかにとって非常に重要です。

頻繁に使用されるアプリケーションは、何時間もフラストレーションを溜め込み、収益に悪影響を及ぼす可能性があります。たとえば、携帯電話サイズの画面に表示される NYTimes のネイティブ アプリは、最高のネットワーク条件でもコンテンツとスクリプトの読み込みに時間がかかります。トップ ストーリーがビューポートにレンダリングされた後でも、スクロールとクリックの遅延が発生します。さらに、広告が不都合な遅延時間に読み込まれるときに、絶え間ないレイアウトの変更をナビゲートすることは、本当にひどいことになる可能性があります。

Google には、パフォーマンスの修正を実装した後、より良い経験がもたらされると、収益にプラスの効果があることを示す多くのケース スタディがあります。 NYTimes のコンテンツの価値がなければ、彼らのアプリはさらに de de笑され、現在使用されているよりもはるかに少ない使用量に苦しむ可能性があります。アプリは間違いなく改善されるべきであり、これは非常に多くの読者にとって歓迎される変更です。

Core Web Vitals について深く掘り下げたい場合は、来週開催予定のSMX Advanced カンファレンス セッションに参加してください。開発者の方のために、17 日と 18 日に開催される開発者向け SEO ワークショップでは、これらのトピックをより深く詳細に調査します。


著者について

Detlef Johnson は、検索エンジン ランドと SMX の開発者向け SEO エキスパートです。彼は SMX イベントのプログラミング チームのメンバーでもあり、 Search Engine Land で SEO for Developers シリーズを執筆しています。 Detlef は、20 年以上前にプロの SEO 分野を確立した先駆的なウェブマスターのオリジナル グループの 1 人です。それ以来、彼は主要な検索エンジン テクノロジー プロバイダーに勤務し、Chicago Tribune のプログラミングおよびマーケティング チームを管理し、Fortune 500 企業を含む多くの企業のコンサルティングを行ってきました。 Detlef は現在、 Internet Marketing Ninjas で働いており、テクニカル SEO に対する深い理解と Web プログラミングへの情熱を会社のレポートや特別なサービスに役立てています。