サイト職人スタッフブログ

Googleは、2020年5月に新しい取り組み「Web Vitals（ウェブバイタル）」を提示しました。
参考：https://developers-jp.googleblog.com/2020/05/web-vitals.html

これは、優れたUXを安定して提供するために必要なGoogleの取り組みです。ユーザーエクスペリエンス（UX）とは、ユーザーが製品やサービスを利用することで得る体験のことです。
ユーザビリティでは、使い勝手や使いやすさの要素が問われていましたが、UXでは使い心地や感動、印象などが重要視されます。

今回は「Core Web Vitals（コアウェブバイタル）」とはいったい何なのか、私たちにどう関わってくるのかをご説明します。

コアウェブバイタルとは

LCPとFID、CLSの3つの指標をまとめてコアウェブバイタル（Core Web Vitals）と呼びます。

• Largest Contentful Paint (LCP)：ページの表示速度を測る指標
• First Input Delay (FID)：ユーザーの反応速度を測る指標
• Cumulative Layout Shift (CLS)：視覚要素の安定性を測る指標

Largest Contentful Paint (LCP)は、ページの表示速度を測る指標です。対象コンテンツが表示されるまでの時間を秒で表し、値が小さいほどUXが良好だと判断します。そのため、LCPをチェックすれば、画像や動画、文字などの大きな要素が表示されるのに、どれくらいの時間がかかるかがわかります。

もし、表示速度が遅すぎる場合は、“画像が大きすぎる”や“画像の表示数が多い”など、速度低下の原因を探り改善する必要があります。

First Input Delay (FID)は、ユーザーの反応速度を測る指標です。ユーザーが特定のアクションを起こすまでの時間をミリ秒で表し、値が小さいほどUXが良好だと判断します。そのため、FIDをチェックすれば、ユーザーがクリックやタップ、文字入力に至るまでにどれくらいの時間がかかるのかがわかります。

もし、ユーザーの反応速度が遅すぎる場合は、次のアクションを迷わす原因を探っていく必要があります。

Cumulative Layout Shift (CLS)は、視覚要素の安定性を測る指標です。ユーザーが意図しないレイアウトのずれをスコア表記し、値が小さいほどUXが良好だと判断します。そのため、CLSをチェックすれば、新たなコンテンツが追加された際、コンテンツがずれているといった問題が生じていないかがわかります。

たとえば、ユーザーがリンクをタップしたら、関係のない広告が表示されタップしてしまったり、コンテンツを読んでいたら広告の表示により文字がずれて困惑したりといった事態が頻繁に発生すると、CLSのスコアが悪くなります。

コアウェブバイタルはどういう意図で導入される？

コアウェブバイタルの3つの指標の導入理由は、UXの最大限の向上です。ユーザーに最高の検索体験をしてもらうには、UXの向上が不可欠です。

• ページの表示速度の向上
• ユーザーの反応速度の向上
• 視覚要素の安定性

これらを数値化し、改善しようというのがコアウェブバイタルの概要です。現在、UXにはたくさんの指標や意見が生まれています。Googleとしても一つの指標を提示することで、優先度・わかりやすさ・整合性を持たせたかったのでしょう。概念や指標の統一は、コアウェブバイタルが誕生した理由の一つといえます。

つまり、これらの指標を数値化して課題を可視化し、クリアしていくことで、自然とユーザーの使いやすい優れたWebサイトになります。

私たちのWebサイトには、コアウェブバイタルがどう関わってくる？

これらは、2021年以降にランキング要因として組み込むことが明言されています。導入される6ヶ月前には通知するということですので、まずは概要を理解してできる範囲で準備をしておくといいでしょう。

コアウェブバイタルの測定方法

Googleは、コアウェブバイタルを測定および報告するツールについても実装を進めています。実際に、次のようなツールが提供されると報告されています。

• Chrome 拡張機能
• Largest Contentful Paint
• Layout Instability
• Event Timing
• web-vitals

Googleは、コアウェブバイタルの状態を簡単にチェックできれば便利で有益だと気づきました。そこで、Web VitalsのChrome 拡張機能のデベロッパー プレビュー版を公開しています。将来的には、拡張機能を利用すれば、コアウェブバイタルの状態について実際のユーザーからの集計結果が表示されます。

もし、LCPやFID、CLSを簡易的にチェックしたい場合は、web-vitalsのChrome拡張の利用をおすすめします。web-vitalsを利用すれば、リアルタイムで表示しているページのLCPやFID、CLSの数値をチェックできます。

Web Vitals
https://chrome.google.com/webstore/detail/web-vitals/ahfhijdlegdabablpippeagghigmibma

そして、今後、Googleは多くの利用者が存在するツールをアップデートすることにより、コアウェブバイタルの改善につながるアクションを提供する予定です。

まとめ

コアウェブバイタルは、今すぐにランキング要因になるものではないので、まずは概要を理解しておくことが大切です。ただし、ユーザーのことを考えるのであれば押さえておきたいポイントばかりです。

特に、ユーザーエクスペリエンス（UX）の向上は、ユーザーの検索体験やWebサイト上の利便性に繋がる重要な部分です。

検索ユーザーが目的のページを閲覧しやすいように手助けしたり、Googleが特定のコンテンツを効率良く検出したりするためにも、コアウェブバイタルに対する理解を深めながらできることがあれば手をつけてみましょう。