• ホームページ
  • 記事
  • SEO
  • コアWebバイタル：定義、LCP、FID＆CLSの概要、およびコアWebバイタル最適化のヒント

コアWebバイタル：定義、LCP、FID＆CLSの概要、およびコアWebバイタル最適化のヒント

公開: 2021-03-17

2021年は、1つ以上の点で注目に値します。 検索エンジンは進化し​​、かつてないほど競争力を増しています。 Googleは、検索エンジンでウェブサイトをランク付けするための新しいゲームを変える指標を立ち上げる予定です。 優れたUXとページエクスペリエンスは、重要なランキング要素になります。これはすべて、Googleが新しく導入し、間もなくリリースされるコアWebバイタルのおかげです。

今年後半にGoogleのコアWebバイタルの展開が予想されるため、企業がこのランキング要素に従ってWebサイトに追いつき、最適化することがますます重要になっています。

コアWebバイタルとは何か、それが何で構成されているか、およびWebサイトのコアWebバイタルを最適化するために何ができるかがわからない場合は、このまま読み進めてください。 このブログはあなたのためです。

このブログでは、コアWebバイタルのAZを取り上げ、同じようにWebページを最適化するのに役立ちます。 さぁ、始めよう。

内容を隠す
1コアWebバイタルとは何ですか？
2コアWebバイタルが重要なのはなぜですか？
2.1コアWebバイタルの3つのシグナル：
2.2 3つのWebバイタル（LCP、FID、CLS）を最適化する方法
2.3 Web Vitalsスコアを測定する方法：
2.4 Screaming Frogを使用してコアWebバイタルを監査する方法：
2.5考慮すべきその他のページエクスペリエンス要因：

コアWebバイタルとは何ですか？

画像ソース：web.dev

コアウェブバイタルは、Googleがウェブサイトの全体的なユーザーエクスペリエンスを評価するために使用するランキングシグナルまたは一連の基準と指標です。 Googleのコアウェブバイタルは、ウェブサイトの速度、応答性、視覚的な安定性を既存のユーザーエクスペリエンスのシグナルとともに評価して、全体的なページエクスペリエンスと使いやすさを評価します。

Googleは、ページによって提供される全体的なエクスペリエンスを調査する方法を改善するために、この新しいランキングシグナルを開始する予定です。 このデータの集大成は、この検索エンジンによってまとめられ、SERPSでWebサイトをランク付けします。

あなたのウェブサイトのランキングが高いほど、その可視性は高くなります。 ページ体験が重要なランキング要素になるので、それに注意を払うことは避けられません。 ウェブサイトのコアウェブバイタルデータを確認するには、Google検索コンソールアカウントの「拡張機能」セクションを探してください。

Core Web Vitalsが重要なのはなぜですか？

Core Web Vitalsは、Googleの「ページエクスペリエンス」スコアの一部であるランキングシグナルです。 グーグルはページ体験をグーグルの公式ランキング要素にしているので重要です。
画像ソース：backlinko.com

コアWebバイタルが重要である理由とそれがあなたにとって重要である理由は次のとおりです。

  • これは、Googleのランキング評価におけるこの新しい変更を早期に最大限に活用できる、今後のWebサイトにとって大きなランキングの機会です。
  • コンテンツの品質とウェブサイトのランキングが似ている2つのウェブサイト間の戦争では、ページの経験がすべての違いを生む可能性があります。
  • GoogleのSERPで比類のないランキングを享受していたウェブサイトは、新しいページエクスペリエンスの基準を満たしていない場合、同等の競争力のあるウェブサイトに現在のランキングを失うリスクがあるため、コアウェブバイタルは現在より重要になっています。

すべてを考慮すると、ページエクスペリエンススコアは、GoogleがWebサイトをランク付けするために使用する約200のランキング要素の1つにすぎないことを覚えておくことが重要です。

先を行き、他の人よりも競争力のあるランキングの優位性を享受するには、既存のオンページおよびオフページのSEO戦略を最適化し続けると同時に、WebサイトのコアWebバイタルを最適化する必要があります。 一晩でランキングを失うことはありませんが、事前にWebコアバイタルを最適化することで、ランキングの可能性を確実に高めることができます。

コアWebバイタルの3つのシグナル：

画像ソース：web.dev

GoogleがコアWebバイタル評価で考慮した上位3ページの速度とユーザーインタラクションの測定値は次のとおりです。

  • 最大のコンテンツフルペイント（LCP）
  • 最初の入力遅延（FID）
  • 累積レイアウトシフト（CLS）

信号1：最大のコンテンツフルペイント（LCP）：読み込みパフォーマンスをチェック

LCPは、Googleがページエクスペリエンススコアを計算するために使用する最初のコアウェブバイタルメトリックです。 Webページの読み込みパフォーマンスを測定します。

最大のコンテンツフルペイントまたはLCPは、実際のユーザーの観点からWebサイトのページが読み込まれるまでにかかる時間として定義できます。 簡単に言うと、ユーザーがリンクをクリックしてからWebサイトのコンテンツの大部分が画面に表示されるまでにかかる時間はLCPと呼ばれます。

LCPは、ページ速度の観点から本当に重要なこと、つまり、ユーザーがページを邪魔されることなく表示および操作できることに焦点を当てています。

LCPスコアを確認するには、GoogleのPageSpeedInsightsを使用してください。 あなたがしなければならないのは：

  • GoogleのPageSpeedInsightsツールにアクセスします。
  • 検索ボックスにあなたのウェブサイトを入力してください。
  • [分析]をクリックします。

「分析」をクリックすると、Googleは現在のページの包括的なレポートを表示します。 あなたのウェブサイトのギャップについて学ぶためにそれを通り抜けてください。 結果はまた、クロムブラウザデータに基づいた現実世界でのWebページのパフォーマンスへの洞察を提供します。

また、Googleの検索コンソール（GSC）でLCPデータを直接確認することもできます。 次の理由により、GoogleのPageSpeedInsightsを使用するよりもお勧めします。

  • PageSpeed Insightsでは、分析のために検索バーに入力した1つのWebページのレポートが表示されます。 検索コンソールに、Webサイト全体のLCPデータが表示されます。
  • Googleの検索コンソールを使用すると、ウェブサイト上の良い、悪い、またはその中間のURLの完全なリストを取得できます。
  • GoogleのLCPガイドラインでは、ウェブサイトのLCPを「良い」、「悪い」、「改善が必要」に分類しています。

理想的なLCP測定は2.5秒以上です。 ページのメインコンテンツの読み込みが速いほど、LCPスコアは高くなります。 大きなページと複数の機能を備えた大きなWebサイトがある場合、これは困難な場合があります。

信号2：最初の入力遅延（FID）：対話性/応答性をチェックします

First Input Delayは、Googleの2番目のコアWebバイタルです。 双方向性を測定します。

簡単に言うと、First Input Delay（FID）とは、ページがインタラクティブになるまでにかかる時間を指します。 ページ上でアクティビティが発生するのにかかる時間を測定すると言えます。 具体的には、ユーザーがページで実際に何かを行うのにかかる時間を測定します。

理想的なFID測定は100ミリ秒未満です。

FIDスコアリングのために計算されるページ上のインタラクションの例を次に示します。

  • ユーザーがメニューからオプションを選択するのにかかる時間。
  • ユーザーがフィールドにメールアドレスを入力するのにかかる時間。
  • ユーザーがサイトのナビゲーションでリンクをクリックするのにかかる時間。

ユーザーデータを収集したり、ログインの詳細を要求したりするビジネスWebサイトの場合、FIDスコアリングは非常に重要です。

信号3：累積レイアウトシフト（CLS）：視覚的安定性をチェックします

累積レイアウトシフト（CLS）は、視覚的な安定性を測定する重要なコアWebです。 これは、ユーザーの操作によって引き起こされたのではないすべてのレイアウト変更を計算するメトリックです。 つまり、このメトリックは、ページが読み込まれるときの視覚的な安定性を考慮に入れていると言えます。

ページの読み込み中にページ上のより多くの要素が移動する場合、CLSは高くなります。 Webページの読み込み中に移動する要素が少ない場合は、CLSを低くします。

CLSが低いほど、ページスコアのパフォーマンスが向上します。

0.1未満のCLSスコアはWebページに理想的であると見なされるため、最適なページエクスペリエンスのためにWebサイトを最適化するときに、これをターゲットにするようにしてください。

3つのWebバイタル（LCP、FID、CLS）を最適化する方法

3つのWebコアバイタルを最適化することは、ページのパフォーマンスとWebページの全体的なページエクスペリエンスを向上させるために重要です。 これらを改善する方法をいくつか紹介します。
最大のコンテンツフルペイント（LCP）を最適化する方法：

WebサイトのLCPを改善するためにできることのリストは次のとおりです。

  • CSSを縮小する： CSSが小さいほど、LCPは高速になります。
  • 大きなページ要素を削除する：幸い、GoogleのPage Speed Insightsは、ページのLCPを遅くしている要素がWebサイトにあるかどうかを示します。 それが何であるかを特定したら、すぐに解決できます。 たとえば、GoogleのPage Speed InsightsでTechmagnateのLCPスコアを分析すると、この要素に欠陥があることがわかります。
  • Webホストをアップグレードする：ホスティングが優れていると、ロード速度（LCPを含む）が速くなります。
  • 不要なサードパーティのスクリプトを削除する：サードパーティのスクリプトはできるだけ避けてください。
  • 遅延読み込みの設定：遅延読み込みとは、ユーザーが画像を掲載しているWebページのそのポイントに到達したときにのみ画像が読み込まれることを意味します。 遅延読み込みを設定することで、LCPをより高速に実現できます。

上記のヒントを実行すると、良好なLCPスコアを取得するために必要なLCPの完全性を高めるのに役立ちます。 LCPスコアが高いほど、ページエクスペリエンススコアとランキングの可能性が高くなります。 したがって、LCPをまだ最適化していない場合は、今すぐ最適化してください。

First Input Delay（FID）を最適化する方法：

サイトのFIDスコアを改善するために実行できるいくつかの手順は次のとおりです。

  • Javascriptを最小化（または延期）する：ページ上のJSを最小化または延期すると、ブラウザーがJSをロードする必要性が減少または排除されるため、WebページのFID速度を向上させることができます。
  • 重要でないサードパーティのスクリプトを削除する： Google Analyticsやヒートマップなどのサードパーティのスクリプトは、FIDとコンテンツの読み込み速度に悪影響を与える可能性があります。 Webサイトにとって重要ではないものを特定し、Webページにとって重要でない場合は削除します。
  • リクエスト数を少なくし、転送サイズを小さくする：コードを最適化して、リクエスト数を制限し、HTMLファイル、メディア、画像などの転送サイズを最小限に抑えます。

累積レイアウトシフト（CLS）を最適化する方法：

CLSを改善するために実行できる簡単なアクションは次のとおりです。

  • 広告要素をWebページの予約済みスペースに割り当てます。この簡単なタスクを実行すると、コンテンツが本来あるべき場所にとどまることが保証されます。 指定された広告スペースがないWebページは、コンテンツの構造と配置を台無しにする傾向があり、ページを上下に押して、CLSが高くなり、ページエクスペリエンススコアが低くなることがあります。
  • フォールドの下に新しいUI要素を追加します。ユーザーがWebサイトのページを閲覧するとき、要素がその場所にとどまると期待します。 UI要素を追加することで、これが発生し、ページのコンテンツ構造が影響を受けないようにすることができます。
  • メディアに設定サイズ属性ディメンションを使用する：ビデオ、画像、GIF、インフォグラフィック、またはその他のメディア要素などのメディアに設定サイズ属性ディメンションを使用することが重要です。 これを行うと、その要素がそのページで占めるスペースがわかり、前例のないコンテンツの置き忘れからWebページを保護するのに役立ちます。

当社のウェブサイトデザインおよび開発サービスは、コアウェブバイタルスコアを最適化するのに役立ちます。

Web Vitalsスコアを測定する方法：

3つのコアWebバイタルが何であるかがわかったので、それを測定するのに役立ついくつかのツールを次に示します。

  • グーグルの検索コンソール：あなたのコアウェブバイタルを分析するためのもう一つの強力で非常に便利なツールはグーグル検索コンソールです。 拡張セクションの下に独自のコアWebバイタルレポートが付属しており、Webサイト監査を実施するたびに確認できます。 最良の部分：単一のWebページのページパフォーマンスを表示する代わりに、検索コンソールはすべてのWebページパフォーマンスデータを一度に表示します。
  • PageSpeed Insight： GoogleのPageSpeed Insightは、WebページのコアWebバイタルを、改善に関する貴重なアドバイスとともに表示する強力なツールです。
  • 灯台：灯台は、コアWebバイタルを測定するために使用できるもう1つのGoogleツールです。 以前はPWAを監査するように設計されていましたが、現在はパフォーマンスを監視するための強力なツールに変わりました。 追加機能とSEOチェックを備えた灯台は、Webページの速度とページエクスペリエンスデータを分析するための強力なツールとして適切に説明できます。
  • GT Metrix： GT Metrixは、Webサイトのパフォーマンステストおよび監視Webサイトです。 これは、LCP、TBT、およびCLSのパフォーマンスを評価するために使用できる無料のツールです。

Screaming Frogを使用してコアWebバイタルを監査する方法：

コアWebバイタルを監査するという概念は比較的新しいものです。 準備を整えてWebサイトのコアWebバイタルを最適化したい場合は、特にプレミアムメンバーシップのサブスクリプションを既に持っている場合は、ScreamingFrogなどのツールを使用すると役立ちます。

必要なものは次のとおりです。

  • スクリーミングフロッグの有料版。
  • PageSpeedInsightsAPIキー。
  • 監査するWebサイトのドメイン。

さぁ、始めよう。

ステップ1：PageSpeedInsightsAPIキーをScreamingFrogに接続します

Screaming Frogを使用してコアWebバイタルを最適化するためのステップ1には、PageSpeedInsightsAPIキーをそれに接続することが含まれます。 それらを接続すると、ScreamingFrogダッシュボードのページごとにPageSpeedInsightsのデータと推奨事項にアクセスできます。

従う必要のある手順は次のとおりです。

  • ScreamingFrog→Configuration→APIAccess→PageSpeedInsightsを開きます。
  • PageSpeedInsightsのAPIキーを[シークレットキー]ボックスにページングします。
  • [接続]をクリックします。
  • [接続]をクリックした後、[メトリック]をクリックします。
  • 監査するメトリックを選択し、[ OK ]をクリックします。

ステップ2：Webサイトをクロールします。

次のステップには、Webサイトのクロールが含まれます。

クロールするWebサイトのドメイン名を、「スパイダーへのURLを入力してください」というボックスに入力するだけです。 エントリを作成したら、「クロール」および「API」プログレスバーがロードされるのを待ちます。

それらが100％にロードされると、データを分析できます。

ステップ3：関係当局に問題を報告します。

ツールがデータをロードした後、Webサイト上のすべてのWebページのコンパイルを取得します。 ここでは、コアWebバイタルの最小しきい値を満たしていないWebページの数をパーセンテージで分析する必要があります。

実行できる手順は次のとおりです。

  • 上部のナビゲーションバーをクリックします。
  • [ページネーション]をクリックします。
  • ドロップダウンメニューから[ページ速度]をクリックします。
  • [エクスポート]をクリックします。

データをエクスポートした後、次の列に入力します。

  • 最大のコンテンツフルペイント時間（ミリ秒）：フィルターを配置して、4000ミリ秒以上のLCPを持つページを検索します。
  • 合計ブロッキング時間（ミリ秒）：フィルターを設定して、TBTが300ミリ秒以上のページを検索します。
  • 累積レイアウトシフト：フィルターを配置して、0.25CLS以上のページを検索します。

このデータに基づいて、レポートを作成してクライアントに送信できます。 社内のページエクスペリエンス最適化要件についてこの監査を実施している場合は、このデータを関連するチームに送信し、それに応じてページ最適化を実行できます。

ステップ4：推奨事項を使用してページごとの問題を報告します。

さて、これはそれが面白くなるステップです。 これで、コアGoogleWebVitalsの最小基準を満たしていないWebサイトのページの割合がわかりました。 次は何？

対象とするメトリックに基づいて、関連する問題をきちんとまとめます。 できることは次のとおりです。

  • [概要]タブの右側で、[PageSpeed]まで下にスクロールします。
  • ここでは、コアWebバイタルを改善するための潜在的な解決策を含む、Webサイトのページ速度に関連する問題と推奨事項を見つけることができます。
  • ページ速度のドロップダウンには、次のようなさまざまなメトリックが含まれます。
    • レンダリングをブロックするリソースを排除します（LCPに影響を与えます）
    • CSSを縮小する（LCPに影響を与える）
    • JavaScriptを縮小する（FIDに影響を与える）
    • 未使用のCSSを削除します（LCPに影響します）
    • 未使用のJavascriptを削除しました（FIDに影響を与えます）
    • （などなど）
  • 問題をクリックして影響を受けるページの数を確認し、このデータをワークシートにエクスポートします。 これを行うと、関連する問題のあるすべてのURLをエクスポートするのに役立ちます。
  • データに基づいて、Webページからのこれらの要素の削除または延期に関して判断を下すことができます。

追加記事：ページスピードSEOとは

ステップ5：監査と最適化の後、サイトを再度クロールして比較します。

あなたのコアグーグルウェブバイタルに影響を与える要因を特定した後、あなたは最適化を行うことができます。 最適化後、あなたの仕事は結果を評価するためにあなたのサイトを再びクロールすることです。

最適化後の最小コアWebバイタル要件を満たさないWebページの割合を、最適化前の数値と比較します。

考慮すべきその他のページエクスペリエンス要因：

Googleがユーザーエクスペリエンスに必要と考える上位の追加要素のリストは次のとおりです。

  • 安全なブラウジング： Webサイトで安全なブラウジングが許可されていない場合、ページエクスペリエンスの基準に違反していると見なされ、ページエクスペリエンススコアが低くなります。 したがって、Webサイトにマルウェアなどの悪意のあるコンテンツや欺瞞的なコンテンツが含まれていないことを確認してください。 ウェブサイトの安全コンプライアンス基準は、Googleのセキュリティ問題レポートで確認できます。
  • HTTPS：HTTPSで始まるWebサイトは、安全なサイト接続を備えている可能性が高くなります。 HTTPSで始まるWebサイトがない場合は、HTTPSでWebサイトを保護する方法についてはこちらをご覧ください。
  • モバイルフレンドリー： Googleのモバイルフレンドリーテストを使用して、ウェブページがモバイルフレンドリーかどうかを確認します。 このクイックアセスメントでWebページが「モバイルフレンドリー」として表示されない場合は、携帯電話やタブレット向けにWebサイトを最適化するための戦略を実行してください。 特に、UXとUIを改善し、キャンバス外のナビゲーションを完成させることが役立ちます。
  • 邪魔なインタースティシャルを使用しない：ユーザーがWebページのコンテンツに簡単にアクセスできるようにする必要があります。 それがないと、ページエクスペリエンススコアが低くなる可能性があります。 Webページのコンテンツをユーザーがアクセスしやすくするために避けるべき重要な事項は次のとおりです。
    • Webサイトのコンテンツの大部分をブロックするポップアップの使用は避けてください。
    • 画面全体をカバーするスタンドアロンのインタースティシャルを表示することは避けてください。 ユーザーがメインコンテンツにアクセスする前にそれを閉じる必要があるため、これは煩わしいものです。
結論：

Googleは、2021年5月に主要なランキングシグナルとしてコアWebバイタルを展開する準備ができています。時間の必要性は、企業がこの主要なランキング基準に合わせてWebサイトを事前に最適化することです。

このブログでは、Webコアバイタルを改善するために実行できる非常に必要な手順を示しました。 コアWebバイタルとは何か、コアWebバイタルの上位3つのメトリック、および優れたコアWebバイタルSEOスコアのためにWebページを最適化するために何ができるかについて説明しました。

また、Webサイトの監査にScreamingFrogを使用するユーザーのページエクスペリエンスを分析するための簡単なハックについても概説しました。 ここで提供した情報がお役に立てば幸いです。 あなたのグーグルランキングを維持するためにあなたのウェブサイト最適化戦略にそれらを実装してください。

ご不明な点やご質問がございましたら、コメント欄でお知らせください。

ご連絡をお待ちしております。