Webページの公開は、プロジェクトの成果を世に送り出す重要な瞬間です。しかし、リリース前の最終確認を怠ると、思わぬトラブルや機会損失につながることがあります。
皆さんの中には、自社のLP制作ディレクションを行う方もいれば、クライアント先のHP制作コーディングに携わる方もいらっしゃるでしょう。
本記事では、その両方の立場を経験してきた私がこれまで気をつけてきたWebページを公開するうえでの確認ポイントをまとめました。ぜひチェックリストとしてご利用ください。
本記事のターゲット
- Web制作会社の社員
- サイト制作ディレクションの担当者
- Webサイトを公開する前や、HTMLメールを配信する前に最終チェックを行う立場の方
Webページをリリースする上での確認ポイント10
1. 誤字脱字がない
誤字脱字は企業の信頼性に直結します。BtoC・BtoBサイトを問わず、細かなミスが受注に影響することもあります。最近ではChatGPTをはじめとする生成AIに校正を依頼するのも有効ですので、誤字脱字のないページを最低限担保しましょう。
チェック方法
- 複数人での校正作業を実施
- 音読による確認
- 校正ツールの活用（ex. ChatGPT）
2. SEO内部対策ができている
ビジネスにおいて検索流入を意図しないページも存在します。例えば以下のような場合です。
- テスト用ページ
- 一部の地域や顧客限定のページ
- プライベートな内容を含むページ
- プッシュ型施策の飛び先URL(ex. メールが表示されない時の飛び先)
検索流入を意図しないページを作成する際には、headタグ内にあるメタタグにnoindex, nofollowを設定するようにしましょう
<meta name="robots" content="noindex, nofollow">一方で検索流入を得る想定であれば、noindex, nofollowを設定は行わず、ターゲットとなる検索キーワードを盛り込んだtitle、descriptionはじめhタグを設定しましょう
3. デバイス×ブラウザで表示崩れがない
記載されている内容が正しくても、デザインが崩れてお客様に伝わらなければ意味がありません。必ず利用者数の多い以下のデバイスとブラウザでは表示確認を行いましょう。
チェック項目
- PC：Chrome、Edge、Safari
- スマートフォン：Chrome（Android）、Safari（iOS）
- タブレット：iPadのSafari、AndroidタブレットのChrome
チェック方法
- 実機での確認
- ブラウザの開発者ツールでのレスポンシブ確認
- クロスブラウザテストツールの活用
4. CVが伴う場合は申し込める状態である
お客様の受注を見込んだページであるにもかかわらず、受注申し込みが正常に完了できないという問題も発生し得ます。
テストアカウントで申し込みを実際に行い、受注が正常に完了し、データログ上も蓄積されることを確認しましょう。
チェック方法
- フォーム送信の動作確認
- 完了画面の表示と自動返信メールの受信確認
- 管理画面での受注データ蓄積確認
5. リンク先が仕様通りである
内部リンクや外部リンクが正しく機能しているかを確認します。リンク切れは信頼性を著しく損なう要素です。
チェック方法
- 全てのリンクをクリックして動作確認
- 外部リンクの場合は新しいタブで開くかの確認
- リンクチェッカーツールの活用
6. 計測タグ・プロモーションコードが設定されている
Webマーケティングにおいて、データ計測は欠かせません。リリース後に設定漏れに気づくと、貴重なデータを失うことになります。またプロモーションコードを付与し、割引適用している場合にも注意が必要です。
チェック項目
- Google Analyticsタグの設置確認
- コンバージョン計測の設定確認
- 広告(Facebook、Google Ads等）、改善ツール(ヒートマップツール、ABテストツール 等)の設定確認
- プロモーション適用の確認
チェック方法
- ブラウザの開発者ツールでタグの発火確認
- Google Analytics リアルタイムレポートでの動作確認
- Tag Assistantなどの拡張機能の活用
- 実際に申し込みを完了させ、割引が適用されているか確認
7. SSL証明書が正しく設定されている
セキュリティは現代のWebサイトにとって必須要件です。SSL証明書の設定状況を確認しましょう。
チェック方法
- https://でのアクセス確認
- 証明書の有効期限確認
8. デザインが仕様通りである
デザインカンプやワイヤーフレームと実装されたページが一致しているかを確認します。
チェック項目
- フォントサイズ、行間、文字色
- 画像の表示サイズ、位置
- ボタンのデザイン、ホバー効果
- レイアウト、マージン、パディング
チェック方法
- デザインカンプとの比較確認
- 検証ツールでの表示確認
9. ページパフォーマンスが良い
表示速度はユーザー体験のみならずSEO評価にも直結します。特にモバイルファーストの現在、パフォーマンス最適化は重要です。表示スピードが遅い場合には、画像を圧縮したり、不要なcssやjavascriptの削除を試みましょう
チェック方法
- Google PageSpeed Insightsでの測定
- Lighthouseでの総合評価
- 実機での体感速度確認
10. 画像パスが正しい
サイト画像を絶対パスで設定している場合に、本番環境へアップした際にも画像パスを書き換える必要があります。公開前に本番環境に画像をアップし、その画像パスがhtmlに記載され、実際に表示されることも確認しましょう
チェック方法
- 全ページの差し込み画像を目視確認
- 開発者ツールでの404エラー確認
- ブラウザタブ上のfavicon表示確認
最後に
Webページの公開前チェックの徹底は、お客様体験・企業の信用を高める上で必要不可欠です。最低限、本記事で紹介したチェックポイントを網羅し、ぜひビジネス目標の達成に繋げていただけると幸いです。
紹介した10個のチェック項目は一覧化しましたので、Webページ公開前にチーム確認する際にぜひご活用ください。
