Webサイト制作の案件では、納期が決まっており、公開前は何かとバタバタしがちです。
このようにバタバタな状態でチェックを行うと確認漏れが起きてしまいます。
確認漏れを防ぐためには、チェックシートの活用が効果的です。
この記事では、弊社が使用しているWebサイト公開前・公開後のチェック項目について解説します!
本記事で紹介しているチェック項目をシートにまとめたものを配布しています。
以下のボタンから資料をダウンロードしてご活用ください!
Webサイトの公開前チェック項目
まずは、Webサイトの公開前のチェック項目を紹介します。
公開前のチェック項目は、余裕を持ったスケジュールで対応するようにしましょう。
なお、弊社では客観的な目線で確認を行うため、掲載内容やコード面のチェックは公開担当者(メインコーダー)以外が担当するようにしています。
当日の公開までの流れは決まっているか(外部との協力を含め)
当日の公開までの流れが決まっているかを確認します。
以下のような内容を事前に確認・確定させましょう。
- 公開日時
- (必要な場合)メンテナンス画面を表示させる期間、表示内容
- 公開作業に伴い、外部との協力が必要か
(サーバーのセキュリティ設定によっては、外部ベンダーとの連携が必要な場合がある)
顧客と実施・連絡タイミングの共有ができているか
公開作業開始前の連絡や、公開完了後の連絡について連絡方法や連絡タイミングが顧客と共有できているか確認します。
何かトラブルが起きたときに、すぐに連絡が取れるように、顧客の担当者様には公開作業の時間帯には待機していただくようにしましょう。
アクセス情報は揃っているか
公開に必要なFTP情報やDBの情報などが揃っているか確認します。
WordPressなどの公開作業の場合は、Webサーバーのコントロールパネルのログイン情報も必要なので注意しましょう。
また、保守契約などで今後もアクセスする可能性がある場合は、その情報を適切な方法で保存・管理できているかを確認しましょう。
システム(CMS含む)の作業予行、またはタスク・留意点の洗い出しができているか
WordPressなどのCMSを本番環境にデータ移行する手順は、サーバーによって少し異なります。
また、.htaccessでのURLリダイレクトを設定についてもサーバーによって記述の仕方が異なります。
テスト環境で正常に動作していたとしても、本番環境では正常に動作しない場合があります。
このようなことを極力防ぐために、タスクや留意点の洗い出しを十分に行いましょう。
引継ぎドキュメントの作成がされているか
Webサイトを作成したコーダーやデザイナー以外でも、公開後に修正作業等の対応ができるように、引継ぎドキュメントの作成ができているかを確認しましょう。
デザインの元データの保管場所や、コーディングする上での注意点、使用しているサーバーなどの情報を記載します。
meta descriptionに適切なテキストが入っているか
meta descriptionの設定がページ毎に適切になされているかを確認します。
確認が漏れていると、全てのページが同じテキストになっていたり、何も設定されていなかったりする可能性があります。
このような状態では、検索結果に意図しない文章が掲載される可能性があり、ユーザーの利便性も下がってしまうので注意しましょう。
Googleアナリティクス、Googleタグマネージャーは適切に動作しているか
WebサイトにGoogleアナリティクスとGoogleタグマネージャーのタグが埋め込まれているかを確認します。(利用する場合)
Googleアナリティクスは、リアルタイム計測でアクセスが計測できているか、Googleタグマネージャーは、プレビューで正しく動作しているか確認します。
フォーム送信等にコンバージョン設定をしている場合や、特定のクリックなどにイベント設定をしている場合はテスト送信やクリックなどを行い、計測されるかも確認します。
OGP画像が設置されているか
SNSでページがシェアされたときにサムネイル画像が表示されるようにするためには、OGP画像の設定を行う必要があります。
OGPの設定については、以下の記事で詳しく紹介しているので、合わせてご確認ください。
URLリダイレクトの設定は適切にされているか
Webサイトのリニューアルに伴い、サイト構造が変更になった場合、ユーザーが困らないように、ページのリダイレクト設定を行います。
また、wwwあり無しの正規化や常時SSL化対応のための設定も.htaccessに記述します。
.htaccessの記述方法は、サーバーによって異なるので注意しましょう。
社名・人名に間違いがないか
前株、後株など社名に間違いがないか、社長名や役員名などに間違いがないかをパンフレット等を用いて確認します。
住所に間違いがないか
住所や郵便番号に間違いがないか確認します。
Googleマップの埋め込みを行う場合は、ポイントの指定が間違っていないかを確認します。
電話番号・FAX番号・メールアドレスに間違いがないか
電話番号・FAX番号に間違いはないか、メールアドレスのスペルミスがないかを確認します。
電話番号は、スマホからタップして発信できる設定がなされているかも確認します。
お問い合わせフォームの送信完了画面やお問い合わせフォームの自動返信メールに、電話番号・FAX番号・メールアドレスが含まれている場合もあるので注意して確認しましょう。
電話番号やメールアドレスの表記は合っていても、<a href=”tel:⚫︎⚫︎⚫︎”>や<a href=”mailto:⚫︎⚫︎⚫︎”>のようなリンク内の記述が間違っている可能性があるので注意しましょう。
また、メールアドレスを掲載する際には、メールアドレス自動収集ロボットから保護するためにメールアドレスを暗号化するようにします。
表記ゆれがないか
「お問い合わせ」と「お問合せ」、「私たち」と「私達」、「お客様」と「お客さま」など文章に表記ゆれがないかを確認します。
価格に間違いがないか
商品や製品、サービスの価格に間違いがないか、税込・税抜の表記が正しいかを確認します。
コードチェック
W3C Markup ValidatorやHTMLエラーチェッカーを活用して、HTMLの文法エラーが無いかを確認します。
また、GoogleのLighthouseを活用して、Webサイトのパフォーマンスに問題がないかを確認します。
ブラウザチェック
以下のブラウザで表示崩れが起きていないかブラウザチェックを行います。
- Google Chrome
- Mozilla Firefox
- Microsoft Edge
- Safari
公開前(元サイト)のバックアップは行えているか
本番公開時になんらかのトラブルが発生した場合、もとの状態に戻せるように、公開前のサイトのバックアップを取ります。
FTPでファイルをダウンロードするだけではなく、CMS等を使用している場合、DBのバックアップも取得します。
本番サーバーにアップしないファイルの整理を行う
コンパイル前のソースファイルなど本番サーバーに必要ないファイルを除外したり、開発環境と本番環境で記述が異なるファイル(wp-configや.htaccessなど)を本番アップ用に差し替えで公開用のファイル整理を行います。
公開用ファイルのバックアップを作成しているか
整理した公開用ファイルのバックアップを作成して、指定の箇所に保存します。
テスト環境へのリンクが残ってないか
本番サーバーにアップロードするファイル内にテスト環境へのURLの記述が残っていないかを確認します。
エディターで一括検索して、確認すると効率的です。
ロゴのバージョン違い・CIを無視していないか
Webサイトで使用するロゴが正しいものか、余白感のルールなどCIを無視した使用方法をしていないかを確認します。
Webサイトの公開後チェック項目
次に、Webサイト公開後のチェック項目を紹介します。
テスト環境では正しく動作していても、本番環境では正しく動作しない可能性があるので、しっかりと確認を行いましょう。
リンク切れが発生していないか
本番公開したページ内でリンク切れが発生していないか確認を行います。
ツールを活用して確認を行うと効率的です。
外部サービスが正しく機能しているか
GoogleマップやFacebook、Instagram、X(旧Twitter)の埋め込みを行っている場合、正しく機能しているか確認します。
Google Maps JavaScript APIを使用している場合、APIのアクセス許可設定により表示されない場合があるので注意してください。
動作確認用のテスト記事が削除されているか
WordPressでは、投稿ページや固定ページに始めから作成されている投稿があるため、削除されているか確認します。
また、テスト確認用の記事が残っていないかも確認しましょう。
CMS管理画面のログインパスワードは適切な強度になっているか
WordPressなどのCMS管理画面のログインパスワードが適切な強度になっているか確認します。
WordPressの本番公開方法によっては、テスト環境と同じパスワードになり、簡易的なパスワードのままとなってしまう可能性があるので、注意してください。その場合は公開後に強力なパスワードに変更する対処を行います。
CMSのログイン情報は管理できているか
保守契約等により、今後もCMSにログインする可能性がある場合は、適切な方法でID,パスワードが管理されているかを確認しましょう。
フォームの動作テスト
フォームの動作テストを行います。お客様のメールアドレスで正しく受信できるかを確認します。
フォームの自動返信を設定している場合は、複数のメールアドレスで自動返信メールを受信できるか確認します。
Gmailは、セキュリティの関係で受信できない可能性があるので、Gmailでの確認も忘れずに行いましょう。
Googleアナリティクス、Googleタグマネージャーは適切に動作しているか
GoogleアナリティクスやGoogleタグマネージャーが本番サイトで適切に動作しているかを確認します。
Googleアナリティクスは、リアルタイム計測でアクセスが計測できているか、Googleタグマネージャーは、プレビューで正しく動作しているか確認します。
Googleサーチコンソールに登録する
Googleサーチコンソールに登録していない場合は、登録を行います。
登録方法は、こちらの記事にまとめていますので、ご確認ください。
Googleアナリティクスのコンバージョン設定が動作しているか
Googleアナリティクスのコンバージョン設定が適切に動作しているかを確認します。
フォーム送信のコンバージョン設定を行っている場合は、実際にフォーム送信をして動作確認を行います。
Googleアナリティクスのレポートにコンバージョンが反映されるまでには時間がかかるので、しばらくしてから確認を行います。
作業前・作業後のバックアップファイルを保存する
公開作業前と公開作業後のバックアップファイルを決められた箇所に保存します。
公開担当者個人のPCに保存されたままの状態では、問題が起きたときに他の人が対処できなくなるため、確実に保存するようにしましょう。
デザインデータのバックアップを行う
デザインデータについてもバックアップを行い、社内の人がアクセスできる箇所にデータを保存します。
デザイナー個人のPCだけに保存されたままでは、急な休みなどがあったときに対応ができなくなるので注意しましょう。
FTPのアクセス制限が適切に設定されているか
FTPへのアクセスについて、保守契約を行う場合などについては、固定IPでアクセスを制限して社内からしかFTPにアクセスできないように制限をかけましょう。
また、公開用のみにFTPアカウントを作成した場合は、公開作業完了後にFTPアカウントを削除するようにします。
Webサイトの公開に関するトラブル防止のためには、チェックシートを活用しましょう
ここまでWebサイトの公開前・公開後のチェック項目を解説してきました。
Webサイトの公開作業で失敗しないためには、チェックシートを活用しましょう!
複数人でチェックを行うことで、確認漏れやトラブルを未然に防ぐことができます。
本記事で紹介しているチェック項目をシートにまとめたものを配布しています。
以下のボタンから資料をダウンロードしてご活用ください!