納品前品質チェックシート (Quality Assurance Checklist)

対象プロジェクト: ____________________

チェック実施日: ____/____/____

「プロの仕事」として納品するための最終関門です。すべての項目にチェックが入るまで、クライアントにURLを送ってはいけません。

1. 表示崩れチェック (Visual Layout)

スマートフォン (最重要)

Chrome DevTools または実機で確認。

• iPhone SE (375px): 横揺れ（横スクロール）していないか？ 文字が画像に被っていないか？
• iPhone 12/13/14 (390px): ヒーローエリアの高さは適切か？ ボタンはタップしやすいか？

デスクトップ & タブレット

• iPad Air (820px前後): ヘッダーメニューが崩れていないか？（ハンバーガー推奨）
• Desktop (1920px): 画像が粗くないか？ コンテンツ幅（1200px程度）に収まっているか？

2. 機能・リンクチェック (Functional)

• ハンバーガーメニュー: 開く・閉じるができるか？ リンクタップで自動で閉じるか？
• ページ内リンク: すべてのナビゲーションが正しい位置にスクロールするか？ ヘッダーに隠れていないか？
• コンバージョンボタン: LINE登録画面やフォームに正しく飛ぶか？
• 電話番号リンク: タップで発信確認画面になるか？

3. 画像・パフォーマンス (Performance)

• 画像形式: 全ての写真が .webp になっているか？
• スマホ画像圧縮: モバイル用画像は -quality 50 で極限まで軽量化されているか？
• 動画ブロック: スマホで動画ファイルが裏でダウンロードされていないか？（JS制御確認）
• 脱・アイコンフォント: FontAwesome等の外部CSSが読み込まれていないか？（SVG化確認）
• Consoleエラー: F12（開発者ツール）に赤文字のエラーが出ていないか？

4. 設定・メタデータ (Meta & Settings)

• Titleタグ: 正しい社名・タイトルになっているか？（ダミーのままではないか？）
• Meta Description: 適切な説明文が入っているか？
• Favicon: ファビコンは設定されているか？
• OGP画像: SNSシェア時のサムネイルは正しいか？

5. 最終確認 (Final Polish)

• 誤字脱字: 「社名」「電話番号」「住所」に間違いはないか？
• ダミーデータ: 「ここにテキストが入ります」や「000-0000-0000」が残っていないか？