Webサイト品質チェックリスト完全版|公開前40+公開後15項目【2026年版】

この記事で分かること
- Webサイトの品質をLighthouse 4軸(Performance / Accessibility / SEO / Best Practices)で正しく評価する方法
- 公開前に確認すべき40項目を [必須/推奨/任意] + [自動診断可] でラベル化したチェックリスト
- 公開後も「気づかぬうちに壊れない」ための月次/四半期/年次の15項目
- 飲食店・EC・医療・士業・BtoBの業種別の追加チェック項目
- AI生成サイト時代の新しい品質チェック観点と、WCAG 2.2 AAの実用5項目
「公開直前にチェックリストを渡されたけれど、項目が99個もあって全部やる時間がない」「PageSpeed Insightsで赤色が出たけれど、どこから直せばいいか分からない」と感じていませんか。
Webサイトの品質チェックは、項目を全部洗い出すこと自体が目的ではありません。自動診断で点数化できる項目はツールに任せ、人の目でしか判断できない項目に時間を使う。これが、現実的に運用できる品質チェックの基本姿勢です。
この記事では、Lighthouse 4軸スコアの読み方を起点に、公開前40項目と公開後15項目を [必須/推奨/任意] でラベリングしました。さらに、業種別の追加観点、AI生成サイト時代の新しいチェック観点、WCAG 2.2 AAの実用項目までを1本にまとめています。
なお、シタミでは無料の「Webサイト品質スコアチェッカー」を提供しています。URLを入力するだけでLighthouse 4軸のスコアが即時表示されるため、本記事の自動診断パートで実際に試しながら読み進められます。
Webサイトの「品質」とは何か — 評価の4軸を再定義する
Webサイトの品質とは、Google公式の評価ツールであるLighthouseが定めるPerformance(表示速度)・Accessibility(アクセシビリティ)・SEO・Best Practices(ベストプラクティス)の4軸を中心に、ブランドや業種ごとの要件を加えた総合的な指標です。
Lighthouse 4軸(Performance / Accessibility / SEO / Best Practices)
Lighthouseは、Googleが公式に提供するWebサイト自動診断ツールです。Chrome DevTools内蔵またはPageSpeed Insightsから利用でき、以下の4カテゴリで0〜100点のスコアを返します(出典: Google for Developers, About PageSpeed Insights)。
| カテゴリ | 評価内容 |
|---|---|
| Performance | 表示速度(LCP・INP・CLS等のCore Web Vitalsを含む) |
| Accessibility | スクリーンリーダー対応、コントラスト比、フォームラベル等 |
| SEO | titleタグ、メタディスクリプション、構造化データ、モバイル対応 |
| Best Practices | HTTPS、安全なライブラリ、コンソールエラー、画像の最適サイズ等 |
スコアの読み方は3段階に分かれます。
| スコア | 判定 | 色 |
|---|---|---|
| 90〜100 | 良好(Good) | 緑 |
| 50〜89 | 改善の余地あり(Needs Improvement) | 橙 |
| 0〜49 | 不良(Poor) | 赤 |
特にPerformanceは、モバイル基準で評価されます。Googleは2024年にモバイルファーストインデックスへの完全移行を完了しており、スマートフォンでの表示品質が検索順位に直結する状況です。
4軸では測れない「ブランド・業種要件」
Lighthouseの4軸スコアが満点でも、それだけでは「良いサイト」とは言えません。自動診断では検出できない要素が必ず残ります。
- 文章の誤字脱字や表記ゆれ
- 業種別の必須情報(例: 飲食店なら営業時間、ECなら特定商取引法表記)
- ブランド一貫性(ロゴ・カラー・トーン)
- 問い合わせフォームの送信先メールアドレスが正しいか
- 写真がブランドの世界観に合っているか
「Lighthouseスコア100点でも問い合わせがゼロのサイト」はよくあります。自動診断はあくまでも土台であり、その上に手動チェックを乗せることで初めて品質が立ち上がります。
なぜ"99項目チェック"だけでは不十分なのか
Web上にある品質チェックリストの多くは「99項目」「80項目」「68項目」と数を売りにしています。しかし、項目数が多いほど現実的に全部こなせなくなり、結局優先度の低い項目に時間を取られて、本当に致命的な項目を見落とす事故が起きやすくなります。
この記事では、各項目に [必須/推奨/任意] ラベルと [自動診断可] マークを付けています。必須20項目だけは絶対に押さえる、自動診断可の項目はツールに任せる、という現実的な運用を前提に設計しました。
品質チェックの3層ワークフロー — 自動診断 → 手動補完 → 継続モニタリング
Webサイト品質チェックの3層ワークフローとは、Step 1で自動診断、Step 2で手動補完、Step 3で公開後の継続モニタリングを行う段階的アプローチです。すべての項目を一度に確認しようとせず、層ごとに役割を分けることで、限られた時間で漏れのない品質管理が可能になります。
Step 1: URLを入れるだけ — 自動診断で4軸スコアを取得
最初のステップは、URLを入力するだけでスコアが出る自動診断ツールで現状を把握することです。PageSpeed InsightsまたはChrome DevTools内蔵のLighthouseが代表的で、PageSpeed Insightsは2024年5月10日にLighthouse 12.0へ更新されています(出典: Google for Developers, PageSpeed Insights Release Notes)。
シタミの「Webサイト品質スコアチェッカー」もPageSpeed Insights APIを利用しており、URLを貼り付けるだけで4軸スコアと改善ポイントが即時表示されます。本記事を読みながら、自社サイトのスコアを今すぐ測定してみてください。
あなたのサイトの品質スコアを今すぐ無料診断
URLを入力するだけで、Performance・Accessibility・SEO・Best Practicesの4軸スコアが即時表示されます。
Step 2: 人にしか判断できない項目を手動チェック
自動診断で点数化された後は、ツールが拾えない項目を人の目で確認します。
- 文章品質: 誤字脱字、表記ゆれ、業界用語の正確性
- 業種別の必須情報: 飲食店の営業時間、ECの特定商取引法表記、医療の広告ガイドライン準拠
- ブランド一貫性: ロゴ・カラー・写真トーンが揃っているか
- フォーム動作: 送信先メールアドレス、自動返信内容、エラー時の挙動
これらは本記事の後半「公開前チェックリスト40項目」で詳述します。
Step 3: 公開後も定期的にスコアを再測定
Webサイトの品質は、公開時点がピークでその後低下していくのが一般的です。外部サービスのAPI変更、コンテンツの陳腐化、リンク切れの発生、SSL証明書の期限切れなど、「気づかぬうちに壊れる」要素が積み上がります。
月次・四半期・年次でやるべき項目を本記事の「公開後チェックリスト15項目」セクションで整理しています。
公開前チェックリスト40項目(必須/推奨/任意ラベル付き)
公開前チェックリスト40項目とは、Performance・Accessibility・SEO・コンテンツ・セキュリティ運用の5カテゴリを、合計40項目に整理したチェックリストです。各項目には [必須/推奨/任意] のラベルと、Lighthouse等で自動検知できる項目に [自動診断可] マークを付与しています。
Performance — 表示速度(8項目)
Performanceは、Core Web Vitalsの3指標(LCP・INP・CLS)を中心に評価されます。Core Web Vitalsの良好基準は、LCP ≤ 2.5秒、INP ≤ 200ミリ秒、CLS ≤ 0.1で、いずれもユーザーの75%以上がこの値をクリアしている必要があります(出典: web.dev, Web Vitals)。
| # | 項目 | 優先度 | 自動診断 |
|---|---|---|---|
| 1 | LCP(最大コンテンツ表示) 2.5秒以下 | 必須 | ✅ |
| 2 | INP(インタラクション応答) 200ms以下 | 必須 | ✅ |
| 3 | CLS(レイアウトシフト) 0.1以下 | 必須 | ✅ |
| 4 | 画像の最適化(WebP、適切なサイズ) | 必須 | ✅ |
| 5 | 不要なJavaScriptの削減 | 推奨 | ✅ |
| 6 | CSSの最小化と未使用CSS削除 | 推奨 | ✅ |
| 7 | フォントの最適化(subset・display: swap) | 推奨 | ⚠️ 一部 |
| 8 | CDNの利用 | 任意 | ❌ |
INPは、2024年3月にFID(First Input Delay)から置き換わった指標です。クリックやタップ後、画面が次に応答するまでの遅延を測定し、ユーザー操作の体感速度を評価します。
Accessibility — アクセシビリティ(8項目)
Accessibility項目は、WCAG(Web Content Accessibility Guidelines)に基づいて自動評価されます。詳しくは本記事の「WCAG 2.2 AAレベルの実用チェック5項目」で解説します。
| # | 項目 | 優先度 | 自動診断 |
|---|---|---|---|
| 9 | すべての画像にalt属性 | 必須 | ✅ |
| 10 | 見出し階層が論理的(h1→h2→h3) | 必須 | ✅ |
| 11 | テキストのコントラスト比 4.5:1以上 | 必須 | ✅ |
| 12 | フォーム入力欄にラベル | 必須 | ✅ |
| 13 | <html lang="ja"> 等の言語属性 | 推奨 | ✅ |
| 14 | スキップリンクの設置 | 推奨 | ⚠️ 一部 |
| 15 | キーボードのみで全機能操作可能 | 推奨 | ❌ |
| 16 | フォーカスインジケータの可視化 | 推奨 | ⚠️ 一部 |
SEO — 検索エンジン対策(12項目)
SEO項目は、Lighthouseで自動検知できる範囲と、ホームページのSEO対策入門で解説する戦略レベルの施策に分かれます。
| # | 項目 | 優先度 | 自動診断 |
|---|---|---|---|
| 17 | titleタグが各ページでユニーク | 必須 | ✅ |
| 18 | メタディスクリプションを各ページに設定 | 必須 | ✅ |
| 19 | h1タグが各ページに1つだけ存在 | 必須 | ✅ |
| 20 | モバイルフレンドリー(viewport設定) | 必須 | ✅ |
| 21 | HTTPS化(SSL対応) | 必須 | ✅ |
| 22 | robots.txt の設置 | 推奨 | ⚠️ 一部 |
| 23 | sitemap.xml の送信(Search Console) | 推奨 | ❌ |
| 24 | canonical タグの設定 | 推奨 | ✅ |
| 25 | OGP(Open Graph Protocol) | 推奨 | ⚠️ 一部 |
| 26 | 構造化データ(schema.org) | 推奨 | ⚠️ 一部 |
| 27 | 内部リンクの設計 | 推奨 | ❌ |
| 28 | 404ページとリダイレクト設定 | 推奨 | ❌ |
コンテンツ — 文章・画像・リンク(7項目)
ここからは自動診断では検知できない、人の目によるチェックが中心です。
| # | 項目 | 優先度 | 自動診断 |
|---|---|---|---|
| 29 | 誤字脱字のチェック | 必須 | ❌ |
| 30 | 表記ゆれの統一(例: お問い合わせ / お問合せ) | 必須 | ❌ |
| 31 | 内部・外部リンク切れの確認 | 必須 | ⚠️ 一部 |
| 32 | 画像のRetina対応(2倍解像度) | 推奨 | ❌ |
| 33 | 問い合わせフォームの送信動作 | 必須 | ❌ |
| 34 | CTAボタンの文言と動線 | 推奨 | ❌ |
| 35 | ブランドコピーの一貫性 | 推奨 | ❌ |
ホームページデザイントレンド2026で紹介しているように、2026年は「読みやすさ」と「ブランドの個性」のバランスがコンテンツ評価の鍵になります。
セキュリティ・運用(5項目)
| # | 項目 | 優先度 | 自動診断 |
|---|---|---|---|
| 36 | HTTPS化(HTTP→HTTPSリダイレクト) | 必須 | ✅ |
| 37 | SSL証明書の有効期限 | 必須 | ❌ |
| 38 | データベース・ファイルのバックアップ | 必須 | ❌ |
| 39 | CMS・プラグインの最新版適用 | 推奨 | ❌ |
| 40 | アクセス監視・障害通知の設定 | 推奨 | ❌ |
40項目のうち**必須は20項目、推奨は19項目、任意は1項目(CDN)**です。まずは必須20項目をクリアすることから始めましょう。
公開後チェックリスト15項目 — 「気づかぬうちに壊れる」を防ぐ
公開後チェックリスト15項目とは、月次・四半期・年次の3つの周期でWebサイトの品質を維持するためのチェックリストです。公開時点では問題なくても、外部要因や時間経過で品質が低下するため、定期的な再測定が欠かせません。
月次でやる(5項目)
| 項目 | 確認方法 |
|---|---|
| 表示速度のモニタリング | PageSpeed Insightsで主要ページのスコア再測定 |
| 問い合わせフォーム動作 | 実際にテスト送信し、自動返信メールも確認 |
| サイト稼働確認(5xxエラー) | Search Consoleの「ページ」レポート |
| GA(解析タグ)の計測 | Googleアナリティクスの当月データを目視 |
| SSL証明書の残期間 | ブラウザの錠アイコンから確認、または監視ツール |
四半期でやる(5項目)
| 項目 | 確認方法 |
|---|---|
| リンク切れの一括チェック | Dead Link Checker / W3C Link Checker |
| Lighthouse 4軸の再診断 | Webサイト品質スコアチェッカーで4軸を再測定 |
| 古いコンテンツの陳腐化チェック | 統計データ・年度表記・製品情報の最新性 |
| Search Consoleのカバレッジエラー | 「ページ」レポートで除外・エラー件数を確認 |
| 外部サービスの埋め込み動作 | YouTube・Googleマップ・SNS埋め込みが表示されているか |
年次でやる(5項目)
| 項目 | 確認方法 |
|---|---|
| WCAG最新版・SEOトレンドの確認 | 年初にW3CとGoogle検索セントラルを確認 |
| CMS・サーバー・ドメインの大型更新 | 各サービスの提供元から通知を確認 |
| 年末年始・GW等の営業時間更新 | 飲食・小売・士業はとくに重要 |
| プライバシーポリシー・利用規約の見直し | 法改正・サービス変更に合わせて改訂 |
| デザイン・ブランドの総合見直し | 2〜3年に1回のリニューアル判断 |
業種別の追加チェック項目
業種別の追加チェック項目とは、Lighthouse 4軸の汎用チェックに加えて、特定業種のユーザーや法令要件に応じて確認すべき項目を整理したリストです。同じ「公開前チェック」でも、飲食店とECサイトでは確認すべき内容が大きく異なります。
飲食店・カフェ
- 営業時間の表記(祝日・年末年始の特別営業を含む)
- メニューPDFのモバイル可読性(拡大せずに読めるか)
- Googleマップ埋め込みの表示と現在地表示
- 食物アレルギー表示の有無
- 写真の鮮度(季節メニュー・店内最新写真)
飲食店のホームページ作成で業種特化の制作観点を解説しています。
ECサイト
- 特定商取引法に基づく表記(運営会社名・住所・連絡先・返品条件)
- 個人情報保護方針とプライバシーポリシー
- 返金・キャンセルポリシーの明示
- カートの再現性(離脱→再訪時のカート状態保持)
- 決済処理時のHTTPS強制とエラーハンドリング
医療・クリニック
- 医療広告ガイドラインへの準拠(厚生労働省)
- 診療科目・診療時間・休診日の最新化
- 医師経歴・所属学会・専門医資格の正確な記載
- 予約フォームの個人情報取り扱いの明示
- 患者の声を掲載する場合は薬機法・医療広告ガイドラインに注意
士業
- 報酬規程または料金体系の明示
- 相談予約フォームの動線と入力項目の最小化
- 所属団体(弁護士会・税理士会等)の正確な表記
- 取扱分野の明確化と実績表現の適正性
- 守秘義務に関する記載
BtoB・コーポレートサイト
- 会社情報の充実度(資本金・代表者・沿革・主要取引先)
- IR・プレスリリースの最新性
- 採用情報の更新状況
- お問い合わせのSLA(営業日対応・返信目安)
- 取引先の信頼を得るためのセキュリティ証明(ISMS等)
業種ごとのホームページ制作費用相場を参考に、業種別の必須項目をコスト計画に組み込むことをおすすめします。
AI生成サイト時代の品質チェック観点(2026年版)
AI生成サイト時代の品質チェック観点とは、ChatGPT・Claude・AIホームページ作成ツールなどで生成したコンテンツに対して、人間が必ず確認すべき新しいチェック項目です。AI生成サイトは速い反面、固有の品質リスクがあります。
AIが生成しがちな「ハルシネーション要素」を見抜く
ハルシネーションとは、AIが事実に基づかない情報を、もっともらしく生成してしまう現象です。Webサイトでは次のような形で現れます。
- 実在しない電話番号や住所
- 架空の受賞歴・取引先・実績件数
- 存在しない法令・規格・統計データ
- 実在しない人物の肩書きや経歴
対策としては、AI生成された文章に固有名詞・数値・年号が含まれている箇所はすべて人間がファクトチェックすること。生成後そのまま公開せず、必ず一次ソースを確認する運用が必須です。
構造化データの整合性(schema.org の誤用)
AIは構造化データ(schema.org)を生成できますが、誤った type を使ったり、実在しないプロパティを並べたりすることがあります。
- 飲食店なのに
Organizationを使う(本来はRestaurant) - 商品ページに
ProductではなくArticleを指定 aggregateRatingに架空の評価値を埋め込む
構造化データはGoogleのリッチリザルトテストで検証できます。AI生成後は必ずこのツールで合否を確認しましょう。
altテキスト・コピーの同質化チェック
AIで大量にページを生成すると、altテキストやコピーが似通った表現になりやすい問題があります。
- altテキストが「image」「画像」「写真」など無意味な汎用値
- 似た構造の文章が複数ページで繰り返される
- 業界の常套句で埋められ、自社らしさが消える
altテキストは画像の内容を具体的に説明する文に書き換え、コピーは自社のブランドトーンに合わせて手作業で調整します。
WCAG 2.2 AAレベルの実用チェック5項目 — 中小企業でも今日からできる
WCAG 2.2 AAレベルとは、W3Cが2023年10月5日に勧告したWeb Content Accessibility Guidelines 2.2のうち、一般的なWebサイトが目標とすべき準拠レベルです(出典: W3C, Web Content Accessibility Guidelines (WCAG) 2.2)。WCAG 2.2はWCAG 2.1に9つの新たな成功基準を加えた最新版で、後方互換性を保ちつつ一部基準が整理されています。
中小企業がいきなり全項目に対応するのは現実的ではないため、特に効果が大きい5項目に絞って解説します。
コントラスト比 4.5:1 以上を確認する
通常テキストの背景色と文字色のコントラスト比は、WCAG 2.2 AAでは4.5:1以上が必須です(出典: W3C WAI, Success Criterion 1.4.3: Contrast (Minimum))。18ポイント以上の大きいテキストおよび14ポイント以上の太字テキストは3:1で可、UIコンポーネントや図解の非テキスト要素も3:1が基準です。
確認方法は、Chrome DevToolsで要素を選択し、Stylesパネルの色サンプルをクリックすると「Contrast ratio」が自動表示されます。WebAIM Contrast Checkerを使えば、URL指定で一括チェックも可能です。
キーボードのみで操作できるか
マウスを使わず、Tabキー・Enterキー・矢印キーだけですべての機能を操作できるかを確認します。フォーム入力、メニュー展開、モーダル開閉、ページ内リンクなど、視覚障害者やマウス操作が難しいユーザーに必須の動作です。
確認方法は単純で、ブラウザでサイトを開き、マウスを使わずにTabキーで一通り操作してみるだけです。フォーカスが見えない・順序が論理的でない・トラップされる、といった問題は即座に分かります。
スクリーンリーダー読み上げの確認
macOSなら標準搭載のVoiceOver、WindowsならNVDA(無料)でサイトを読み上げさせ、視覚情報のないユーザーがコンテンツを理解できるかを確認します。altテキストの未設定、見出し階層の崩れ、装飾画像の過剰な読み上げなどがここで明らかになります。
動画・音声に字幕があるか
動画コンテンツには字幕、音声コンテンツには文字起こしを用意します。YouTubeの自動字幕でも一定の効果はありますが、固有名詞や専門用語が多い場合は手動で修正することが推奨されます。
拡大表示200%でレイアウトが崩れないか
ブラウザのズーム機能で200%まで拡大したとき、レイアウトが崩れず、横スクロールせずにすべてのコンテンツが読めるかを確認します。視力の弱いユーザーが拡大表示で利用する場面を想定しています。
品質チェックに使える無料ツール7選 — 自動診断と手動チェックを並走させる
品質チェックに使える無料ツール7選とは、自動診断系と手動チェック支援系を組み合わせた、実務で使える無料ツールの厳選リストです。1つのツールで全てを賄うのではなく、複数を組み合わせて使い分けるのが王道です。
| ツール | 主な用途 | 特徴 |
|---|---|---|
| シタミ Webサイト品質スコアチェッカー | Lighthouse 4軸の即時診断 | URL入力だけで結果表示、改善ポイントも提示 |
| PageSpeed Insights | Google公式の自動診断 | Lighthouse 12.0 + CrUX実データ |
| Chrome DevTools Lighthouse | ローカルで詳細測定 | 開発中のステージングでも測定可能 |
| WAVE | アクセシビリティ専用 | エラー箇所を画面上にビジュアル表示 |
| W3C Markup Validation Service | HTML検証 | HTMLの文法エラー・警告を検出 |
| Dead Link Checker | リンク切れの一括検出 | サイト全体を自動巡回 |
| Search Consoleのモバイルユーザビリティ | モバイル対応の確認 | Googleが見ている観点で診断 |
シタミの「Webサイト品質スコアチェッカー」は、PageSpeed Insights APIをベースに4軸スコアと優先度の高い改善ポイントを日本語で1画面にまとめて表示します。ChromeのDevTools操作が苦手な方や、改善ポイントの英語表記が読みにくい方に向いています。
無料のCMSやノーコードツールから始めたい場合は、無料のホームページ作成ツール比較も参考にしてください。
チェックを始める前に — どこから手をつけるべきか
品質チェックリストの項目数を見て、すべてを完璧にやろうとすると挫折します。優先順位を意識して、段階的に進めることが重要です。
おすすめの順序は次のとおりです。
- まず自動診断で現状把握: シタミのWebサイト品質スコアチェッカーまたはPageSpeed InsightsでURLを測定する。所要時間は1分以内
- 赤色(49点以下)のカテゴリから着手: Lighthouseが赤判定したカテゴリの改善ポイントを上から3つ潰す
- 公開前40項目の「必須」20項目を確認: 自動診断で漏れていた手動チェック項目を埋める
- 業種別の追加項目をチェック: 飲食・EC・医療・士業など、自社業種固有の必須項目を反映
- 公開後の月次サイクルを開始: 1回やって終わりではなく、月次の表示速度モニタリングを定例化
まずは現状把握から — 無料でWebサイト品質を診断
URLを入力するだけで、Lighthouse 4軸スコアと改善ポイントが即時表示されます。会員登録は不要です。
よくある質問(FAQ)
Webサイトの品質チェックで最低限やるべき項目は何ですか?
ホームページの公開前に何を確認すべきですか?
PageSpeed Insightsの合格点はいくつですか?
Lighthouseとは何ですか?
Webサイトのアクセシビリティチェックはどうやって行いますか?
リンク切れを一括チェックするツールは何がおすすめですか?
ホームページの表示速度を上げるにはどうすればいいですか?
AIで作ったサイトは品質が低いのでしょうか?
Webサイトの品質スコアはどこで確認できますか?
公開後も定期的にチェックが必要ですか?
Webサイトの品質チェックは「項目を全部洗い出すこと」が目的ではなく、「自動診断で点数化できる項目はツールに任せ、人の目でしか判断できない項目に集中する」運用を続けることが本質です。
まずはURLを入れるだけで完了する自動診断から始めて、必須項目から段階的に手動チェックを積み重ねていけば、99項目のリストを見て挫折することもありません。
シタミで制作したサイトは、Lighthouse 4軸のうち構造化データ・HTTPS化・viewport設定・モバイル対応・OGPなどの主要項目が初期構成で対応済みです。「品質チェックを毎回ゼロから組み立てる時間がない」と感じている方は、最初から品質基盤が整ったAI対応のホームページ作成ツールの活用もご検討ください。