LCP（Largest Contentful Paint） とは？

ページを開き始めてから、画面内の対象要素で一番大きな画像やテキストなどが描画されるまでの時間だよ。大きな商品画像や本文が見えるまでの待ち時間を捉える指標で、Core Web Vitalsの一つなんだ。

違うよ。LCPは画面内の対象要素の描画を見るので、画面外の画像やすべての通信の完了を待つ指標ではないんだ。FCPは最初のテキストや画像などが出る時刻、LCPはその中でも大きな内容が出る時刻を見る。クリックへの反応はINPなど別の指標で確認するよ。

良好の目安は2.5秒以下だけれど、サイトの評価では実際の訪問の75パーセンタイルを見るよ。速い順に並べたとき、75%の位置にある値という意味だ。モバイルとPCを分けて確認する。一度だけ速く測れた結果で、すべての利用者が快適とは判断できないんだ。

うん。画像、動画のポスターや最初のフレーム、CSSのURLで読み込む背景画像、ブロック状のテキストなどが候補になる。読み込み途中でより大きな候補が描画されると更新され、クリックやスクロールなどの操作が始まると候補の報告が止まる仕組みだよ。

まず計測ツールで、どの要素がLCPなのか確かめよう。サーバー応答、画像の発見や取得、CSSやJavaScriptによる描画の待ちなどに分けて調べる。LCPになりそうな画像は遅延読み込みを避け、必要ならfetchpriorityを使う。改善後は実測も確認しよう。LCPだけで検索順位が決まるわけではないよ。