Webサイト公開前のチェックリスト

Webサイトの構築が終わったら、公開前の最終チェック。

公開前チェックはWeb制作で避けては通れない大事な作業です。

項目別のチェック内容を把握しておきましょう。

デザインチェック

□ デザインカンプ通りにコーディングされているか
□ テスト環境と本番環境(ステージング環境)での表示に違いはないか
□ 対象ブラウザ・OS・デバイスでデザイン崩れはないか(Windows・Mac/Chrome・Edge・Firefox・Safari・IE/PC・iPhone・Android)
□ 共通ヘッダー・共通フッターなどは正しく読み込まれているか
□ 画像は粗くないか(特にスマホ/Retina時)
□ 原稿のコピペミスはないか
□ 商標キーワードは正しく使われているか
□ 誤字脱字・機種依存文字はないか
□ 金額・電話番号・メールアドレス表記は正しいか
□ ダミー原稿・ダミー画像・未購入画像が残っていないか
□ 標記の揺れはないか(お問い合わせ⇔お問合わせ⇔お問合せ など)
□ 埋め込みコンテンツは正しく表示されているか(地図、動画、SNSなど)
□ リンク箇所は見た目で分かるか(青色文字、アンダーラインなど)

コーディングチェック

□ doctype宣言は正しいか(HTML5)
□ 文字コード設定は正しいか(UTF-8)(文字化け防止)
□ HTMLのバリデートチェックをしたか(『W3C Markup Validator』など)
□ リンク先は合っているか・リンク切れはないか
□ リンクのタブの開き方は正しいか(同一タブ/別タブ)
□ 構文エラーなどエラーがないか(Chrome検証モード>Consoleタブ)
□ ソースコード内に不要なコメント/コードはないか
□ titleは各ページ固有のものを設定したか
□ meta descriptionは各ページ固有のものを設定したか
□ meta keywordsは設定したか(必要時)
□ OGPを設定したか(og:title/og:description/og:url/og:image)
□ favicon・touch-iconを設定したか(ブラウザのタブ/スマホでホームに追加して確認)
□ パスは正しく記述したか(絶対パス/相対パス)
□ パンくずリストは設定したか(SEO対策/ユーザビリティ向上)
□ imgタグのwidthとheightを設定したか
□ 2ページ目以降が正しく表示されるか(ある場合)
□ レスポンシブデザインに対応したか(実機で表示確認/『モバイルフレンドリーテスト』など)
□ リダイレクト設定は正しいか(http→https/古いページ→新しいページ)
□ 404エラーページは用意したか(ドメイン配下の架空URLでテスト)
□ IP制限・Basic認証・noindex設定などの公開時に不要な設定を解除したか
□ スマホ時に電話番号をタップして電話をかけられるか
□ 画像ファイルは圧縮したか

システムチェック

□ フォームは正しく動作するか(入力内容のバリデート/確認画面/サンクス画面/自動返信メール/問合せ通知/エラー表示)
□ SNSシェアボタンは正しく動作するか
□ (会員制サイト)会員登録機能は正しく動作するか
□ (会員制サイト)ログイン機能は正しく動作するか
□ (ECサイト)カート機能は正しく動作するか
□ (ブログ)関連記事機能は正しく動作するか
□ (ブログ)ランキング機能は正しく動作するか
□ 外部ツールとのシステム連携部分は正しく動作するか

SEO設定チェック

□ titleタグはキーワードを含み、ページごとに固有のものを設定したか
□ meta descriptionはキーワードを含み、ページごとに固有のものを設定したか
□ h1タグにキーワードは入れたか
□ 見出しはhタグでマークアップしているか
□ imgタグにaltテキストを入れたか
□ パンくずリストを設定したか
□ URLの正規化はしたか(wwwのあり・なし/index.htmlのあり・なし)
□ XMLサイトマップは用意したか
□ canonical設定は正しくしたか
□ noindex/nofollow設定は正しくしたか
□ 表示速度は遅すぎないか(『PageSpeed Insights』でチェック)

アクセス解析タグ・広告タグのチェック

□ Google Analyticsは設定したか/正しく計測できているか
□ Googleタグマネージャーは設定したか/正しく計測できているか
□ コンバージョン計測は正しくカウントされているか
□ Search Consoleは設定したか
□ 広告タグは正しく設定したか

セキュリティチェック

□ SSL化したか
□ linkの「target="_blank"」属性に「rel="noopener noreferrer"」を設定したか
□ (WordPress)管理画面ログインページのURL変更/IP制限をしたか
□ コメント欄のスパム対策をしたか(コメント投稿時の画像認証など)

権利関係のチェック

□ 著作権に違反していないか(人物/他人が撮った写真や書いた文章の無断使用/引用の明記)
□ プライバシーポリシーを用意したか
□ コピーライト表記したか

【無料】WEBディレクションの修練場(練習問題でスキルを磨く)
WEBディレクションの修練場は実戦形式でWebディレクションスキルを磨いていただくためのコンテンツです。全て無料、回答付きです。