今必要なものを決める（マークアップの早さではなく）
遅延読み込みは、リソースを「必要になるまで重要ではない」とマークします。分類は実際のユーザージャーニーに基づいて行います：最初の表示に必須の要素、ファーストビュー下のメディア、任意の埋め込み、後続ルートやパネル用のコード。CMS 上の位置だけでは十分な根拠になりません。あるテンプレートではオフスクリーンだった画像が、別のテンプレートでは中心的な存在になり得ます。
小型の端末（コールドロード）と典型的なデスクトップで負荷を確認してください。キャンペーンリンクやページ内アンカーもテストして、訪問者がページの下部に着地する場合を考慮します。そのレビューにより、スクロールトリガーがなくても準備すべきものが分かります。
最初のタスク、表示されるナビゲーション、主要文言、最初の意味あるビジュアルは即時利用可能にしておく。
ページ下部のギャラリー、地図、SNS 埋め込み、オフスクリーンのプレーヤー、選択されていない機能用のコードは一般的な候補。
ヒーローと初期ビューポートを保護する
ページを開いた時に可視である可能性が高いコンテンツは遅延しないでください。Google はこれを警告しており、web.dev の分析でも初期ビューポートの画像を遅延すると LCP が遅れる可能性があると示されています。LCP 要素はヒーロー、製品画像、ポスター、またはテキストであることがあるので、推測せず各重要テンプレートで検証してください。
確認された LCP 画像はイーガー（優先）で読み込みます。発見性のある重要画像がネットワークの注意を失っているとテストで判明したら、その画像に対して高い fetch-priority ヒントを試してください。これは命令ではなくヒントです。クリティカルな CSS 背景画像はパーサから直接発見できないため、早期の preload が必要になる場合があり、そのケースは計測してください。
一覧ページでフィーチャー画像が誤って lazy にマークされていないか CMS やプラグインのデフォルトを確認する。
デスクトップのデザインプレビューだけでなく、コールドのモバイルとデスクトップで確認する。
メディア到着前にスペースを確保する
Cumulative Layout Shift（CLS）は目に見えるコンテンツの予期しない移動です。高さが指定されていない遅延画像は、読者がスキャン中やボタンを操作しようとした直後にテキストや操作が押し下げられる可能性があります。これは単なる指標の問題ではなく、インタラクションのリスクです。
画像や動画には正確な width / height 属性を付けるか、CSS の aspect-ratio で形状を確保してください。コンポーネントの最終フットプリントを持つプレースホルダを使います。サードパーティのフレームには高さを確保し、明確な読み込み中状態や利用不可状態を用意してください。
可能であればメディアの寸法をアセットに保存してください。混在する画像形状には一般的な比率は信頼できない。
スクロール、フィルタ、パネルの開閉、モバイルの回転、戻る操作でレイアウトの後発的な移動を検出する。
コンテンツの発見性と操作性を保つ
Google Search Central は、Google がページに対してスクロールやクリックで操作しないと明言しています。重要な遅延読み込みコンテンツは可視になった時点でロードされるべきで、レンダリング済みの HTML が期待するコンテンツやメディアの URL を露出している必要があります。実装後は代表ページを Search Console で検査してください。
インデックス可能な無限リストには、それぞれの恒久的なチャンク用にページネーションされたルートが必要です：恒久的なユニーク URL、その URL 上で安定したコンテンツ、シーケンスを辿れるリンク。これにより人が共有・再訪できる場所も作られます。
アクションでコンテンツが表示される場合、コントロールはキーボード操作可能にし、結果は理解しやすい形にしてください。フォーカスを移動しない意味のある非フォーカス更新（例：'結果が読み込まれました'）では、支援技術が移動なしにアナウンスできるよう状態をプログラム的に公開してください。
製品詳細、記事本文、適格性情報、手順は訪問者の操作後にのみ存在してはいけない。
必須のチェックアウトや認証コントロールは遅延しないでください。支払い、ID、サードパーティスクリプトの変更は適切なセキュリティとコンプライアンスのレビューを受けるべきです。
最も壊れにくい仕組みを使う
通常のオフスクリーン画像や iframe には、ネイティブのブラウザ遅延読み込みが出発点として最も単純です。ブラウザが近傍ビューポートでいつリクエストを開始するかを判断しますが、その距離は保証ではありません。window load イベントは、遅延要素が未完了のまま発火する可能性があります。
Intersection Observer を使うのは、重いパネルを出現直前にマウントするなど、命名されたコンポーネントがカスタムでアクティブ化される必要がある場合に限るべきです。オブザーバは狭く保ち、速いスクロールに備えて十分早めに作業を始めます。非初期ルートや任意機能にはコードスプリッティングを使い、それを現在のタスクを遅らせる口実にしないでください。
単純なソースを data 属性や複数のスクリプト、ライブラリで置き換えるのは、追加した動作がテスト済みのニーズを解決する場合に限る。
任意の埋め込みは永続的なスピナーではなく、明確なフォールバックや省略状態を持つべき。
計測、リリース、修復を一体で行う
同一 URL、キャッシュ状態、ビューポート、ユーザーパスでベースラインと候補を比較してください。コールドで制約のあるモバイルテストに加え、可能なら実機でのチェックを行います。LCP、表示シーケンス、レイアウトシフト、メディアエラー、レンダリング済み HTML、重要なアクションを記録します。フィールドデータはラボテストを補完します。
取り消し可能でテンプレート範囲に限定した変更をデプロイしてください。イーガーから遅延へ移した資産、デプロイ参照、キャッシュ操作、担当者、最初のロールバック手順を記録します。もし LCP が遅延されたりコンバージョン経路が不完全になったら、そのクリティカルな資産からルールを外し再検証してください。テーマ、CMS、画像サービス、タグ、埋め込みの変更後にも再チェックを行います。
現状レポートやアラートだけでなく、破損体験の予防と修復に注力する。
サイト全体でイメージを再調整する前に、影響を受けたテンプレート設定を元に戻す。