接続に失敗しました。もう一度試してください。

コンテンツにスキップ
SEO Tools
ヘルプとドキュメント
速度 大きな影響 中程度 30～60分

レンダリングをブロックするリソース

最初のレンダリングを遅延させるヘッド内の CSS と JS。

それは何ですか

レンダリング ブロック リソースは、ブラウザがコンテンツをレンダリングする前にダウンロードして処理する必要があるファイル (通常は <head> の CSS と同期 JS) です。それまで、ユーザーには何も表示されません。

なぜそれに対処するのでしょうか？

これらは、最初のレンダリングが遅くなり、LCP が低下する最も一般的な原因です。数が多く、サイズが大きくなるほど、コンテンツが表示されるまでに時間がかかります。

やり方

  1. 1defer/async を介してスクリプトを延期します。
  2. 2「重要な CSS」（表示部分のスタイル）を特定してインライン化し、残りを非同期で読み込みます。
  3. 3CSS/JS ファイルを結合して縮小し、未使用のスタイルを削除します。
  4. 4font-display を使用して外部フォントをロードします。それらを交換してプリロードします。

結論

目標は、目に見えるコンテンツをできるだけ早く配信し、それ以外は延期することです。まず、スクリプトを延期し (簡単に解決します)、CSS を最適化します (重要な CSS)。この領域は、Google が追跡する指標である LCP に直接影響します。

関連トピック