Google Core Web Vitals 2022

公開: 2021-04-19

記事の内容の表

GoogleのコアWebバイタル:何を、いつ、なぜ、どのように

お気づきかもしれませんが、最近のSEOコミュニティの議論では、ページ速度(最大のランキング要素)が中心的な段階に達しています。

そして、これらの議論のほとんどは、Googleの新しい速度メトリックWebバイタルに関するものです。 しかし、ここに宝石があります。

Googleが述べているように、SEOは定期的に最高のページ速度スコアを達成するよう努めています。ユーザーエンゲージメントは重要なランキング要素です。

しかし、これらの最適化の力は、ほとんどの場合、Webサイトの理想的なページ速度スコアに反映されたいくつかの神話でした。

それはまさにGoogleがCoreWebVitalsのイントロで打ち砕いたものです。

新しいWebVitalsメトリックに関するGoogleの声明により、Webサイトの所有者は、自分たちが目指すべき理想的な速度を理解できるようになりました。

しかし、彼らはもう少し心配しています!

現在、ウェブサイトは、GoogleのPageSpeed Insights、Pingdom、GTMetrixなどのツールに表示される特定の累積スコアに重点を置いています。

それでも、これらはWebページの特定の速度をチェックするための優れたツールです。

目的は永遠に全体的な速度にあり、個々のユーザーエクスペリエンスの指標を喜んで提供します。これはより多くのことを意味します。

Googleは、ウェブマスターが速度指標の強化に質の高い時間を費やすことを確実にするために、コアWebバイタルの特定の概念を考案しました。

さらに、それはユーザーに価値をもたらし、その懸念についてはブラウザやGoogleボットにも価値をもたらしません。

Google Core Web Vitalsとは何ですか?

Google Core Web Vitals、または単にWeb Vitalsは、ウェブ上でより優れたユーザーエクスペリエンスを提供するために必要な速度信号を分析する、独自のパフォーマンスメトリックのセットです。

簡単に言えば、Web Vitalsは、正確な要素のコレクションです。

これは、Googleの「ページエクスペリエンス」スコアの構成要素であり、ユーザーが特定のページの速度、応答性、および視覚的な安定性をどのように体験するかを測定します。

Googleは、3つの新しい要素を公式ページエクスペリエンスのランキング要素に組み合わせています。

グーグルによるランキング要因コアウェブバイタル ページの読み込み時間、さらにユーザーエクスペリエンスのいずれかがしばらくの間ランキングに影響を与えることを理解しているように、この変更により、集中できる3つの指標が提供されます。

2020年のほとんどのSEOと同様に、これらの要因により、ほとんどのサイトがGoogleだけでなくユーザーにとっても魅力的なものになっているため、これらのサイトのコンバージョン率とランク付けが向上すると予想されます。

Googleは、2021年6月に、CoreWebVitalsがランキング要素として機能することをすでに発表していました。

彼らは同様に、将来的にはより多くの「ページ体験シグナル」を組み合わせると宣言しています。

「これらのアップデートの目的は、引き続き最も満足のいく体験を強調し、ユーザーが探している情報を確実に入手できるようにすることです。

私たちの仕事は継続しているので、今後さらに多くのページエクスペリエンスシグナルを含めることを計画し、さらに毎年それらを更新する必要があります。

グーグルはランキングに影響を与えるだけでなく、「優れたページ体験を保持する検索結果のページを強調する視覚的なサイン」を持つ準備をしています。

ユーザーがSEOの重要な部分を体験するのはなぜですか?

さらに、ユーザーエクスペリエンス(UX)はSEOと密接に関連しています。

各推奨事項は、ユーザーが訪問中にサイトとインタラクションを発見できるように、可視性を最適化するために作成されています。

Googleのドキュメントのページ上のエクスペリエンス基準は、特定のWebページのエクスペリエンスをどの程度理解しているかに加えて、最も関連性の高いUXメトリックの概要を示しています。

主な要因には、ページの読み込み時間、モバイルの使いやすさ、邪魔な広告の回避、安全なHTTPSプロトコル、およびページの安定性が含まれます。

現在の「ページエクスペリエンス」ランキング要素

ユーザーエクスペリエンスは次のとおりです。

  • 安全:特定のサイトはSSL証明書を持っていますか?
  • 安全:サイトで悪用されているマルウェアはありますか?
  • モバイルフレンドリー:特定のサイトをどのモバイルでも簡単にナビゲートできますか?
  • 非侵入型:ポップアップのようなインタースティシャルはありますか?

新規:コアWebバイタル

上記に加えて、ページ速度に集中する主に3つのユーザーエクスペリエンス要因があります。

読み込み:ページの最上位のコンテンツが高速に読み込まれることを常に確認してください。

対話性:ユーザーが特定のページを操作するとき(たとえば、リンクをクリックするとき)、ページの応答が速いことを確認してください。

視覚的安定性:ユーザーが通信しているときに特定のページが読み込まれるときにコンテンツがどのように変化するか。これにより、ユーザーエクスペリエンスが低下する可能性があります。

それで、コアWebバイタルはあなたのウェブサイトにとって何を意味しますか?

ここでは、特定のGoogleのCoreWebVitalsアップデートを完全に準備する方法について要求される最も一般的な質問のいくつかを紹介します。

一言で言えば、Google Core Web Vitalの更新は、Webページによるユーザーの操作に集中しており、さらに、ページエクスペリエンスの更新の追加と見なすことができます。

グーグルは、レイアウトの変化として物事を見ることに加えて、視覚的な安定性を測定し、ポジティブまたはネガティブなユーザーインタラクションを評価することを意味します。

また、動作の指標が悪い場合(コンバージョン率が低い、バウンス率が高い、サイト滞在時間が短いなど)、ページエクスペリエンスのシグナルに問題がある可能性があります。

ランキングシグナルなどのページエクスペリエンスの更新の詳細を知ることで、Webサイトでの顧客エクスペリエンスが向上します。

したがって、Webサイトのランク付け能力とオーガニック検索のパフォーマンスを向上させることで、Webサイトに悪影響が及ばないことが保証されます。

Google Core Web Vitalsアップデートはどのような影響を及ぼしますか?

他のGoogleのアップデートと同様に、その影響を正確に予測することは困難です。

大まかに言えば、ページエクスペリエンスが悪いウェブサイトは、ページエクスペリエンスが優れているウェブサイトよりも、競争力のある用語でのランク付けが低くなると予想されます。

なぜGoogleは、ユーザーをより快適に利用できるWebサイトに送信できるのに、ユーザーを失望させるWebサイトにユーザーを送信するのでしょうか。

グーグルがこの発表を発表した方法は、それが重要なアップデートであり、さらに彼らが私たちにそれの準備ができていることを望んでいることを明らかにしています。

彼らの公式発表では、これはWebエクスペリエンス全体にとって良いものであると述べています。

Google Core Web Vitalsは何を測定しますか?

Google CoreWebVitalsとの相関関係を理解するための3つの指標があります。

最大のコンテンツフルペイント(LCP)

コアWebバイタル最大のコンテンツフルペイントLCP

LCPは、ページのプライマリコンテンツが読み込まれるまでにかかる時間で測定されたままです。 これは、特定のリンクをクリックしてから画面にコンテンツを表示するまでの時間です。

LCPは、ビューポート内の最大のビデオ、画像、またはテキストのレンダリング時間によって大きな影響を受けることを意味します。 Webサイトの所有者は、次の方法でLCPをアップグレードできます。

  • 不要なサードパーティのスクリプトをすべて削除する
  • 遅延読み込みの設定
  • 彼らのウェブホストをアップグレードする
  • すべての大きなページ要素を削除する

常に理想的なLCP測定は、少なくとも2.5秒以上である必要があります。

最初の入力遅延(FID)

CoreWebVitalsの最初の入力遅延FID

FIDは、ページがよりインタラクティブになるまでにかかる特定の時間を測定します。

これは、スクロール、クリック、キーボード入力などのユーザーインタラクティビティでページを使用できるようになるまでにかかる特定の時間です。

Googleは、実際のユーザーがサイトと通信する方法を考慮に入れているため、FIDを不可欠と見なしていました。 Webサイトの所有者は、次の方法でFIDを改善できます。

  • 最小化(またはJavaScriptの延期)
  • 重要でないサードパーティのスクリプトをすべて削除する
  • ブラウザのキャッシュを利用する

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

累積レイアウトシフト(CLS)

CoreWebVitals累積レイアウトシフトCLS

CLSは、任意のWebページの視覚的な安定性を測定します。 ビジュアルページコンテンツの予期しないレイアウトシフトの量です。 ウェブサイトの所有者は、次の方法でCLSを最小限に抑えることができます。

  • 画像、ビデオなどのすべてのメディアに設定されたサイズ属性の寸法を利用する)
  • 広告には予約スペースが必要です
  • フォールドの下で新しいUI要素を組み合わせる

常にCLSの理想的な測定値は0.1未満である必要があります。

テクノロジーが進歩するにつれて、現在のスコアは、ユーザーが優れたWebエクスペリエンスの継続に期待するものに基づいて変化する可能性があります。

コアWebバイタルをどのように評価できますか?

さて、皆さんがGoogle Core Web Vitalsについて知っていることを願っていますが、ページがどこに到達するかをどのようにして見つけるのでしょうか。

ありがたいことに、あなたのウェブサイトを分析するいくつかの方法があります。

Core Web Vitalsのマトリックスは、Google Search Console、PageSpeed Insights、Lighthouseなどのさまざまなツールから見つけることができます。

これらのツールに慣れていない場合は、WebサイトのURLを特定のPageSpeedInsightsツールに入力するのが最も簡単な方法です。

同様に、モバイルとデスクトップで得られる100点のうちのスコアを見てください。 これは全体的なページ速度スコアであり、Webサイトの優れたスナップショットです。

Google検索コンソールを使用することは、複数のページをアドレス指定するもう1つの最も簡単な方法です。

GSCには、すべてのGoogle Core Web Vitalの影響を受けるWebサイトのページ数を表示できる、最も重要なナビゲーションの改善の下にセクションがあります。

そのセクションをクリックすると、Webサイトで問題が発生している可能性のあるGoogle CoreWebVitalの各問題のレポートが表示されます。

レポートを最もよく読む方法について説明しました。

1.問題とガイドライン(この場合は.25より大きいCLS)

2.その特定のGoogleCoreWebVitalの影響を受けるWebサイトのページ数。

3.この問題が発生しているサンプルページ。 これは、レポートと他のGSCレポートの重要な違いです。

Google Core Web Vitalsレポートには、修正が必要なすべてのページが表示されるわけではありません。

正直なところ、一度に複数のページを修正するには、テンプレートレベルで修正する必要がある可能性があるため、これはすべてのGoogleWebVitalの問題に対処するのに時間がかかり苦痛な方法です。

4.その問題が発生している最大20の同様のページのリスト。 すべてのサンプルURLは、いくつかの同様のページを提供します。

Googleは引き続きこの方法を使用して、サンプルページで見つかった同様の問題がWebサイトの他のページで見つかった場所を強調表示します。

たとえば、/ blog /に問題がある場合、同じ問題が/press-releases/セクションのページでも発生しています。

次に、サンプルURLに表示されるのはそのうちの1つだけですが、サンプルアスペクトには別の1つが表示されます。

これは、/press-releases/のより多くのページが同じ修正を必要とすることをあなたに勧めるべきです。

コアWebバイタルの修正

これで、各CoreWebVitalsメトリックが何を測定しているかをよりよく理解できました。

そして、それらがあなたのコンテンツにアクセスしてあなたのブランドと関わろうとしているあなたの聴衆にとっての問題点をどのように表しているか。

これらの指標を改善するために行動を起こす時が来ましたが、さらに重要なのは、オーディエンスとのエンゲージメントを改善することです。

各サイトはややユニークになります。 2つの別々のサイトが同じ問題に苦しむことはめったにありません。

したがって、ドメインを個別に掘り下げて分析し、最も役立つ更新に優先順位を付ける必要があります。

もちろん、Webサイトが直面する一般的な問題もあり、その後、直面する可能性のある問題の一般的な修正につながる可能性があります。

LCPに対処するための一般的な活動

  • PRPLパターンによるインスタントロードの実装
  • CSSファイルの最適化
  • 重要なレンダリングパスを最適化する
  • 画像ファイルサイズの最適化と圧縮
  • JavaScriptの最適化(クライアントがレンダリングしたサイト用)
  • Webフォントを最適化または削除します

FIDに対処するための一般的な活動

  • サードパーティコードの特定の影響を減らす
  • 最前線のスレッド作業を最小限に抑える
  • JavaScriptの実行時間を短縮する
  • 把握リクエストの数が少なく、転送サイズも小さい

CLSに対処するための一般的な活動

  • 画像や動画要素にサイズ属性を追加するか、CSSアスペクト比ボックスで特定のスペースを予約します。
  • ユーザーの操作に応じずに、既存のコンテンツの上にコンテンツを含めないでください。
  • レイアウトの変更を強制するために使用されたプロパティのアニメーションではなく、変換アニメーションを利用します。

Google CoreWebVitals最適化のリソース

多くの要因がページの読み込み時間を短縮するのに貢献しています。

大きなJavascript、画像ファイル、CSSファイル、およびこれらのいずれかによって生成されたリクエストは、ブラウザのペイロードを増やし、ユーザーを長時間待機させます。

幸いなことに、ウェブサイトで快適なユーザーエクスペリエンスを確保するために使用される、Googleが推奨するソリューションがいくつかあります。これにより、ROIも向上します。

ページ速度のための画像の最適化

大きな画像ファイルは、Google Chrome、Mozilla、またはその他のブラウザの最大ペイロードに対して責任があります。

画像を最適化すると、ウェブサイトのスピードアップに役立つだけでなく、優れたユーザーエクスペリエンスを提供できます。

1.イメージCDN:イメージが同じサーバーからロードされる場合、サーバーに大きな負荷がかかる可能性があります。

この障害を取り除く最も強力な方法は、CDNサーバーを利用することです。

AWSとCloudflareは、優れたImage CDNプロバイダーを探しているなら、現在最も信頼できる選択肢です。

2. WebP形式:また、選択したCDNが画像をWebP形式に変換することを確認する必要があります。これは、Web画像のGoogle推奨画像形式です。

3. LazyLoad:遅延読み込み手法を実行すると、画面上の画像リソースが最初のペイロードに付随するだけなので、同様にWebVitalsのスコアが増加します。

さらに、視聴者がWebサイトの適切な画像の視点の近くに到達すると、画面外の画像が読み込まれます。

読み込みプロセス全体を通して、ページ分割を回避するために、画面外の画像のサイズだけが読み込まれます。

JavaとCSSの最適化

1. GZip圧縮: GZip圧縮は、ほぼすべてのサイトの標準的な手法として成長しています。 ただし、これはファイルをより小さく表示し、より高速なネットワーク転送を可能にするため、依然として必要です。

2.リソースの縮小: JavaScriptとCSSを最適化するための最初のステップは、特定のリソースを縮小することです。

縮小化は、メソッドを高速化するために、重要ではないリソースと冗長なリソースを削除する方法です。

これは、ほとんどの最適化プラグインで許可されている基本機能です。

3. CSSとJavascriptを組み合わせる:特定のJavaScriptコードとCSSをロードするために単一のファイルを利用すると、リクエストの数が減り、さらにレンダリングが高速化されます。

これを容易にすることにより、単一のファイルを使用してすべてのCSSリソースを配信し、各リソースをメディアタイプごとにグループ化します。

JavaScriptでも同じことが起こり、DOMリクエストの数を減らすことができるため、全体的な速度のパフォーマンスが向上します。

4.レンダリングブロッキングの削減: PageSpeedスコアが遅い最も一般的な理由は、JavascriptとCSSの過度の使用です。

一部のJavaファイルとCSSファイルは、Webサイトの全体的な安定性にとって重要ですが、すべてがフォールドを超えてロードする必要はないため、レンダリングがブロックされます。

重要ではないJavaScriptとCSSの達成を最適化することは非常に重要です。 これらのファイルは、Webサイトによるユーザーインタラクションが検出された直後にレンダリングされることを確認してください。

このオプションは、PageSpeedスコアを大幅に向上させるだけでなく、完璧なWebVitalsスコアを達成するのにさらに役立ちます。

5. CDNを使用してCSSとJavaScriptを配信する:ここでも、JavaScriptとCSSを読み込むためのCDNを実装するまでは、サーバーの特定の速度を利用してこれらすべてのリソースを配信します。

ほとんどの場合、CDNがなければ、サーバーにかかる負荷を減らすことができますが、それでも問題は発生しません。

Webフォントの最適化

フォントのレンダリング動作は、依然として最も強力なスピードドレイナーの1つです。 ブラウザは、ペイロードからのフォントのロードを除いて、テキストをレンダリングしないようにガイドされています。

これにより、特定のページのレンダリングに非常に多くの遅延が発生するだけでなく、ページ速度が低下します。

フォントを最適化するには、CDNがフォントのレンダリング動作を上書きできることを確認してください。

信頼性の高いCDNは、特定のレンダリングされたテキストのフォントを交換できるだけでなく、CSSから読み込まれるとすぐに元のフォントを表示できます。

一般的に、両方のリソースが同様のCDNサーバーから同時に配信されるため、数マイクロ秒以内に発生します。

これにより、累積レイアウトシフトが大幅に削減されるだけでなく、完璧なWebVitalsスコアが得られます。

埋め込みコード

ウェブサイト内の特定のページに画像、GIF、インフォグラフィック、iframe、およびビデオを埋め込むと、ウェブサイトの速度が低下する可能性があります。

しかし、多くの企業は、これらのビデオが製品デモまたは紹介ビデオの一部であるため、これらのビデオを取り除くことを好むことはできません。

Googleでは、埋め込み画像と、これらのアセットを遅延読み込みできる動画の1つのクイックフィックスをお勧めします。

また、ユーザーが特定の[メディア/ビデオの再生]ボタンをクリックしたときにビデオリソースが読み込まれることを確認してください(最高のユーザーエクスペリエンスに従って提供されます)。

そして、この最適化を実装すると、Lighthouseのパフォーマンスが70%向上することは間違いありません。

AMP(Accelerated Mobile Pages)

サーバーの速度が遅いと、Webサイトのパフォーマンスに大きな影響を与える可能性があります。

AMPキャッシュは配信の最適化に役立ちますが、デスクトップでAMPを有効にすると、UIが大幅に変更され、変換に影響が出る可能性があります。

したがって、サーバーの応答性と高速性を確保する必要があります。

結論:Google Core Web Vitals

ウェブサイトがGoogleで適切に機能する必要がある場合は、現在のページエクスペリエンスのパフォーマンスを監査することをお勧めします。

でも、競合他社のWebサイトを調べることもできます。

これは、この特定のアップデートや競合他社に先んじるために投資する必要がある時間を理解するのに役立ちます。

これから、今年実行する必要があることの計画を作成できます。

特にサイトが数年以上前のものである場合は、ユーザーエクスペリエンスを向上させるために、開発の変更が必要であることに気付くかもしれません。

すばらしいニュースは、これらの与えられたメトリックのすべてが非常に簡単にテストできることです。

また、Googleのランキング信号が大きくなる前に、最大の最初の入力遅延、コンテンツフルペイント、および累積レイアウトシフトのいくつかの改善を測定できます。

上記を実装した後、あなたは確かにあなたのウェブサイトのトラフィックも大幅に増加するのを見ることができます。

Google Core WebVitalsSolutionsに私を雇う

グーグルのコアウェブバイタルがあなたのお茶ではないと思うなら、単にあなたはあなたのウェブサイトを調べてそのスコア統計を改善するために私を雇うことができます。

上記のガイドを読むことで、ウェブサイトのスコアを簡単に向上させることができます。 しかし、それを行うためにSEOマーケティングの専門家が必要だと思われる場合は、私にメールしてください。 ありがとう!