Googleが2020年に発表した表示スピード改善のための新しい指標「コアウェブバイタル」。2021年5月から検索のランキング要因に組み込まれることになり、EC関係者の関心は急激に高まっています。
「コアウェブバイタル」についての解説を踏まえ、表示スピードにおいて「抜群に速い」とされるECサイト、ゴルフダイジェスト・オンライン（GDO）、IDOM、ショップジャパン、大日本印刷（DNP）の担当者4人と「コアウェブバイタルとは何なのか」「どのように取り組んでいるのか」についてディスカッションしました。
■今回の疑問・課題
新しい指標として登場した文字記号は何を意味しているのか？
本当に検索結果の表示順位に影響するのか？
様子見は許される？ 今すぐに対応すべき？
コアウェブバイタルの情報感度が高いEC事業者の担当者は何を考え、どう対応しているのか？
ディスカッションに参加したのは種村和豊氏（GDO シニアプロダクトマネージャー）、村田創氏（IDOM Webマスター）、福崎真生氏（ショップジャパン）、近藤洋志氏（大日本印刷・honto）と、筆者の占部雅一（ドーモ）の5人。事業会社の4人は自負を持って表示スピード対策に取り組んでいるECサイトの表示スピード担当者です。
「コアウェブバイタル」とは何か？
「コアウェブバイタル」のSEOランクへの対応というGoogleの計画は、2018年7月の「スピードアップデート」以来、3年ぶりの大きな動きとなりそうです。今までの指標だった「Backend」「Startrender」「SpeedIndex」から、新たな3つの指標「LCP（Largest Contentful Paint） 」「FID（First Input Delay） 」「CLS（Cumulative Layout Shift） 」に変わります。
また、今回のSEOランクの対象はスマートフォンで、デスクトップサイトは対象外となっています。ほぼモバイルにシフトしているため、妥当だと感じます。
新たな指標を設けた背景には、GoogleがWebサイトに対して「速いだけではなく、本質的に使いやすいUX 」を追求したいという意図があるようです。
3つの新指標「LCP（Largest Contentful Paint）」「FID（First Input Delay）」「CLS（Cumulative Layout Shift）」
LCP （Largest Contentful Paint）：メイン画像の表示の速さ
FID （First Input Delay）：最初にアクションを起こしてから、どれくらい反応が鈍いのか？
CLS （Cumulative Layout Shift）：レイアウトのずれ、特に高さ
バイタル（Vitals）の意味は「重要なもの、本質的なもの」を表します。つまり「Webの本質とは何か？」という意味です。
「わかりやすいサイト」がGoogleとユーザーに必要
IDOM 村田創氏（以下、村田）
それは、「Webサイトが秩序のある動きでなければ、検索を利用したときの体験が良くない 」からです。つまり、GoogleのBotがWebを読みに行ったときに、さらにわかりやすいサイトが必要なんですよ。Googleもユーザーも求める方向は同じです。
ドーモ 占部雅一氏（以下、占部）
ショップジャパン 福崎真生氏（以下、福崎）
今回、インタラクティブ性の対策の対象がTTI（Time To Interactive、インタラクティブになるまでの時間）からFIDになりました。これまでは、TTIを改善するならページロードにおける最後のロングタスク（初期段階に起こる重たい処理）から潰していけば良かった。さらに言うなら、ロングタスクに手を加えなくても結果としてTTIが改善することがあったんです。
しかし、FIDになると「ロングタスクの総時間」となります。そのため、部分的な対策や小手先の対策ではなく、しっかり全体最適を行う必要があります 。
ゴルフダイジェスト・オンライン 種村和豊氏（以下、種村） よりごまかしが効かない指標になった と感じています。操作性を表す指標として、前よりも厳密に対応しないといけない。
ユーザーと向き合って対応しなければならない
大日本印刷 近藤洋志氏（以下、近藤） 「使ってくれるユーザーに対してどう対応させるか？」ということを、ユーザーと向き合って対応しなければならない 。ユーザーの実体験の性能が、今回の指標に組み込まれている と考えます。
占部 「Page Speed Insight」「サーチコンソール」「Lighthouse」などの表示スピード計測ツールは、「コアウェブバイタル」という指標を入れてきています 。これだけでもGoogleの本気度の高さがわかります。
村田 「無視するな」というシグナルなんでしょう 。TTIやFIDは「Lignthouse」でも測れる。ただ、その評価値ですがLCPは25点、CLSは5点、FIDには点数がない！
検索エンジンは、クローラーがWebサイトを回遊し、インデックスでランクづけします。クローラーがアクセスした時に、レンダリングの性能が悪いサイトページは「次回以降レンダリングしなくて良い」と判断されてしまいます。その先のインデックス化まで辿り着けなくなる わけです。
写真左上から時計回りに、種村和豊氏（ゴルフダイジェスト・オンライン シニアプロダクトマネージャー）、村田創氏（IDOM Webマスター）、福崎真生氏（ショップジャパン）、近藤洋志氏（大日本印刷 ・honto）
CLSは「高さのズレ」を表す
占部
村田
種村
カルーセルでのCLS可視化観点の例（Amazon）
計測ツール「SpeedCurve」を使った比較ですが、左のサイトはJS（JavaScript）を使ったカルーセル（画像などのコンテンツを横にスライドさせる表示方法）の場合です。レイアウトのズレが大きいので、警告メッセージが出ます。
しかし、右のサイトは同じカルーセルですが、CSSで書き換えた場合は警告が出ません。カルーセルはユーザーにとって操作性は良さそうですが、Googleは「レイアウトのズレという観点では良くない 」と考えているようですね。
村田
福崎
「FlexSlider」などのライブラリー（汎用的な複数のプログラムを1つにまとめ、他のプログラムから利用できるようにしたもの）で作ったパーツなどは、スクリプトの処理自体に非常に時間がかかっています。もちろんCLSにも影響があり、困りました。
種村
占部
村田
占部
村田
近藤
レスポンシブWebデザインは圧倒的に不利になる
種村 レスポンシブWebデザインにとって圧倒的に不利 です。CLS対策をレスポンシブで実際にやるとなると、高さの固定は実装ハードルが高い。たとえば、母数の多いサファリだけ固定して他のブラウザは放置する、どこかのデバイスを諦めるなど、何かを諦めないといけない。
占部 ECカートも標準でレスポンシブWebデザインで対応しているところが多い ですよね。SalesForceの「コマースクラウド」もレスポンシブです。
種村
占部
福崎
占部
村田 AMP（Accelerated Mobile Pages） です。
種村
占部
カルーセルは効果ある？ 見た目だけのギミック？
占部
種村
福崎
近藤
村田
種村
CLS的には、実際にどうなるか見てみたい。ただ、「JSの処理時間をクライアントブラウザ側で増やすことは、CPU処理速度の点でも不利なのは間違いないので、マイナス要素はあってもプラスはない 」。これは断言できると考えています。
5月までに対策を間に合わせて、様子をみたい
占部
近藤
福崎
LCPはほぼクリアしていますが、CLSは赤、FIDは赤が多いので対策を進めています。
「LCP（Largest Contentful Paint）」「FID（First Input Delay）」「CLS（Cumulative Layout Shift）」の合格基準
村田
種村 落としどころはオレンジで赤は駄目です 。
表示スピード改善は、防衛予算として組むべし！
占部
福崎 同じくらいの評価のサイトがあった場合のタイブレーカーとして機能するなら、すぐに大がかりな影響は出てこない と思います。
むしろ危惧しているのはその先で、SEOロジックだけでなくブラウザやSERP（Search Engine Result Page）のアップデートを加えた一連の流れとして表示スピード改善を迫られる可能性が高い と考えています。
近藤
そのため、様子見の部分もありますが、自社サイトにネガティブ要素として捉えられるものはなくしたい。
村田 ランクに影響しないわけがない 」と考えています。
タイブレーカーの話がありましたが、我々は同じレベルのライバルと戦っていて、その相手が何もしないわけがない。プラスで考えるのではなく、アルゴリズム対応は、対応しなければ下がるだけと考えています。だから表示スピード改善の予算は、防衛予算としてしっかり取るべき と考えています。
占部 絶対指標へのチャレンジや数値目標ではなく、駆け引きの相対の対策として考えないといけない わけですね。
まとめ
今回のディスカッションで、大手ECサイトの担当者に最前線の対策について貴重な話を聞くことができました。思った以上に真剣に取り組まれているのは、SEOランクに影響が考えられることが1つの理由ですが、それ以上に「サイトを良くしてくいく＝UXを良くしていく」ことが、Googleのめざす方向とサイト担当者の理想が同じ方向を向き始めているからだと言えます。
今後は小手先のSEO対策がほぼ消えて、まっとうなサイトをコンテンツ・Webともに作ることが勝負の分かれ目になってくる。コマがまた1つ進んでいることを感じました。
※このコンテンツはWebサイト「ネットショップ担当者フォーラム」 で公開されている記事のフィードに含まれているものです。サイト表示スピードの新指標「コアウェブバイタル」が5月スタート！ GDO、ショップジャパン、IDOM、DNPが語るECサイトの対策 | 勝手にスピードテスト Powered by SpeedCurve
まとめると、
何でも自由にカスタマイズできそうなShopify。しかし、何も考えずにカスタマイズしてしまうと後になって痛い目に遭うこともあるようです。基本的には無料のテーマも問題ないので、そこから自分たちのやりたいことに合わせて専門業者を探すのが良さそうです。Shopify自体も進化しますし、アプリも進化していきますので、その変化を追いかける必要もあります。作っただけで終わりではないことを覚えておきましょう。
関連記事
https://note.com/kurashicom_tech/n/na7aaa2d1dac8