4秒のLCPが、あなたのチェックアウトの成約率に与える影響
4秒は短く思える。だがチェックアウトでは、成約とカゴ落ちを分ける時間だ。
客はもう買うと決めている。商品をカゴに入れ、財布からカードを取り出し、購入確定を押した。そして、ほぼ真っ白な画面を4秒間見つめることになる。
その4秒があなたのLargest Contentful Paintだ。ページ内で最も大きな要素が表示されるまでの時間を指す。チェックアウトでは、たいてい注文内容のサマリーか決済ボタンがそれにあたる。描画されない間、客にできることは何もない。ただ待ち、そして疑うだけだ。
問題はこの「疑い」だ。遅いLCPはページを止めるだけではない。すでに固まっていたはずの購入の決断を止めてしまう。
知っておくべき数字
GoogleはLCPを3つの区分で定義している。2.5秒以下は良好。2.5秒から4秒は改善が必要。4秒を超えると不良だ。4秒のチェックアウトは、その境界線のまさに最悪の側にいる。
これは見た目の話ではない。Google自身が公表している。読み込み時間が1秒から3秒に伸びると、ユーザーがページを離脱する確率は32%上がる。1秒から5秒では90%上がる。あなたのチェックアウトは、まさにこの危険地帯に住んでいる。
Akamaiは2017年のオンライン小売の調査で、わずか100ミリ秒の遅延が成約率を7%下げると計測した。100ミリ秒だ。あなたは本来あるべき値より4000ミリ秒も多い。
チェックアウトが遅さに最も弱い理由
遅い一覧ページと遅いチェックアウトには違いがある。一覧では客はまだ眺めている段階だ。意図がぼんやりしているぶん、辛抱もきく。
チェックアウトでは意図が最大、辛抱が最小になる。客はお金を使うと決める精神的な労力をすでに払い終えている。待たされる1秒ごとに、迷いが入り込む窓が開く。本当は要らないと気づく。別の店で値段を比べようと考える。通知が届いて離れていく。
あなたが失うのは、ふらりと来た見物客ではない。すでに勝ち取っていた売上だ。
その4秒を食っているもの
遅いチェックアウトの大半で、犯人は謎めいてなどいない。むしろ予想どおりだ。よくあるパターンを見てほしい。
- レンダリングをブロックするサードパーティのスクリプト。チャットウィジェット、リマーケティングのピクセル、ページ冒頭で同期読み込みされるタグマネージャーなど。
- サイズ指定がなく、モダンな形式(AVIFやWebP)でもなく、遅延読み込みも正しく設定されていない商品画像。ブラウザに待ち時間を強いる。
- サーバーの応答が遅い。キャッシュせずにリクエストごとにページを生成しているため、Time to First Byteが高くなる。事前レンダリングして配信すれば避けられる。
- ダウンロードが終わるまでテキストをブロックするWebフォント。決済ボタンが必要以上に長く見えないままになる。
- 過剰なJavaScript。ページが操作可能になる前に、ダウンロード、パース、実行のすべてを終える必要がある。
ここで重要な点に気づいてほしい。これらの問題のほぼすべては、ページのデザインの話ではない。エンジニアリングの判断だ。だからこそ、チェックアウトのリデザインに投資しても成約率が動かない例が多い。問題は最初からボタンの色になどなかった。
本気で手を打つには
まず、光回線のノートパソコンだけでなく、実ユーザーのデータで計測する。Chrome User Experience ReportとSearch Consoleは、実際の客が自分のスマホ、自分の回線で体験しているLCPを見せてくれる。意味があるのはその真実だ。
次に、チェックアウトページの具体的なLCP要素を特定する。Chromeのデベロッパーツールがそれがどれかを正確に教えてくれる。当て推量はしない。その要素を最初に最適化する。指標を決めているのはその要素だからだ。
- チェックアウトを事前レンダリングするかキャッシュ配信して、Time to First Byteを800ms未満まで下げる。
- サードパーティのスクリプトはすべて遅延または非同期で読み込む。Facebookのピクセルが決済ボタンをブロックする必要はない。
- 重要な画像はAVIFかWebPで、サイズを明示し、LCP要素には高い優先度を付けて配信する。
- font-display swapを使い、フォントの到着を待たずにテキストを先に表示する。
- 最初の描画に不要なJavaScriptを削り、バンドルを分割する。
これは有料広告のキャンペーンより先にやる価値がある。最初の4秒で客を取りこぼすチェックアウトに、わざわざお金を払って人を連れてくる意味はない。穴の空いたバケツに水を注いでいるだけだ。
誰もやりたがらない計算
自分のカゴ落ち率を取り出す。それをSearch ConsoleのLCPデータと突き合わせる。スマホでのチェックアウトが4秒を超えているなら、損失の一部は価格への抵抗でも信頼の欠如でもない。ただの遅さだ。
そして遅さは、コピーを一語も変えず、価格を1円も触らずに解決できる唯一の成約問題だ。エンジニアリングで解決する。オンラインビジネスにとって、これは最も投資対効果の高い施策のひとつだ。
今週、自分のLCPを測ってほしい。もし4秒なら、漏れている場所はもう分かっている。