写真イメージ

Chrome Dev Summit Recap 2020「Core Web Vitals」

投稿者:

こんにちは。ウェブ解析士の佐藤佳です。
昨日に引き続き、Chrome Dev Summit Recap 2020から「 Core Web Vitals 」のお話です。

そもそも Core Web Vitals って何?と言う方は、
こちらのブログを参考にしていただければ幸いです。

▼GoogleのCore Web Vitals(コアウェブバイタル)とは?
https://web-analyst-chanoma.com/archives/6376


では、さっそくSummitの講義についてお話を進めていきます。

結論から言うと、WebサイトがCore Web Vitalsのしきい値を充たしていれば、
最初のコンテンツが描写される前にユーザーが離れる確率が24%低くなりますので、
みなさん Core Web Vitalsやりましょうね、という話でした。

対策のポイントとして、以下の3つが発表されていました(そのまま列挙します)。

1)Insert new content carefully
ユーザーの操作に応答する場合を除いて
既存のコンテンツの上にコンテンツを挿入しないようにする。
(スムーズで予測がしやすいエクスペリエンスをユーザーに提供する)

2)Give Instant Feedback
ユーザーの操作に応答して、コンテンツを移動する必要がある場合は即座に移動する。
(ネットワークリクエストの完了まで待たせてはいけない)

リクエストの完了までに500ミリ秒以上かかりそうな場合は
プレースホルダを使用してコンテンツの読み込み時のスペースを予約します。

3)Match Visuals to Reality
ページ上の全てのインタラクティブ要素について
表示がインタラクティブに見える場合は、実際にインタラクティブにする。

サーバーサイドレンダリングを使用する場合は、
ページを読み込み中状態または無効状態でレンダリングし、
インタラクティブになる準備が整ってからページをアップロードする。


これらの内容はマーケターだけでコントロール出来ないと思いますので、
UXデザイナーや開発者と話し合いながら進めていきましょう。

今回はここまでです。
また次回のブログでお会いしましょう。

Follow me!

この記事を書いた人

Kei Sato
面白いと思ったモノ・コトを解析し、広く報せることに喜びと生きがいを感じる人です。広報やウェブマーケティングの仕事が大好き。個人ではウェブ解析士、キャリアトランプ ダイバーシティ ナビゲーターとしても活動中。ブログでウェブ解析×キャリア支援に役立つお話や、日々の気づきを綴っています。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください