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)を実装する