PageSpeed 100点チェックリスト

このチェックリストは、実際に全項目100点を達成したサイトの知見をもとに作成しています。カテゴリごとに確認し、未対応の項目から優先的に改善してください。

JavaScript

• クライアントJSを削減またはゼロにする
• サードパーティスクリプトは async/defer で読み込む
• 不要なライブラリ（jQuery等）を除去する

CSS

• 未使用CSSを除去する（Pico.css等の軽量フレームワーク推奨）
• クリティカルCSSをインラインにするか、1ファイルに集約する
• @import ではなく link で読み込む

画像

• WebP/AVIF 形式に変換する
• srcset で複数サイズを提供する
• loading="lazy" を適用する（ファーストビュー画像を除く）
• width/height を明示し CLS を防ぐ

フォント

• system-ui フォントスタックを優先する
• Web フォントを使う場合は font-display: swap を設定する
• フォントファイルをプリロードする

サーバー・配信

• CDN を利用する（Cloudflare Pages 等）
• 適切な Cache-Control ヘッダーを設定する
• Brotli/gzip 圧縮を有効にする

HTML・アクセシビリティ

• セマンティック HTML を使う（div soup を避ける）
• img に alt テキストを付与する
• 見出し階層を正しく保つ（h1 → h2 → h3）
• lang 属性を設定する

SEO メタデータ

• title, meta description を全ページに設定する
• canonical URL を設定する
• OGP（og:title, og:image 等）を設定する
• 構造化データ（JSON-LD）を実装する