Cntlog > 運用 > 【チェックシート付】品質アップにつなげるWebサイト公開時のチェック項目

【チェックシート付】品質アップにつなげるWebサイト公開時のチェック項目

皆さん、新規のサイトを公開するとき、チェックってしてますか?

私もチェックはするのですが、なんだかんだで漏れがあったりでミスする事がよくあるのと、人にお願いするときどこをどうチェックしてもらえばいいか頼むのに結構苦労したのでチェックシートを作りました。
私仕様の規約で作成しているので、ここの内容がWEB業界の標準なんてことはありませんが、どなたかの参考になれば嬉しいです。

チェックシート

チェックの際は新規ユーザーのつもりになって見るほうが良いので、普段使っていないブラウザかchromeのシークレットモードを使うのがおすすめです。
シークレットモードを使えばcookieや過去に保持したデータを0にして確認できるのでより新規ユーザーに近い形でチェックできます。

基本項目

IP制限・ベーシック認証の削除
テスト環境を作らず、そのまま本番環境でチェックしている場合があるとき、公開したつもりでもhtaccessで閲覧制限している場合は必ずチェックしましょう。
404ページの有無
404ページの設置が必要か確認して、ページデザインも一緒にチェック。
ただリンクが切れたというより404でページがなくなってる事をユーザーに伝えるほうが親切ですよね。
また、Googleアナリティクスのようなアクセス解析を入れておけば404が多くなったときにアラートを出して事故に気が付きやすかったりします。
Google タグマネージャーは設定されているか
bodyタグの直下にGoogle タグマネージャーが入っているかチェック。
また、別サイトのGoogle タグマネージャーが入っていないかも確認する必要があります。
たまにまぎれてるくるんですよね…
私はGoogleアナリティクスをはじめとしてタグ関連がGoogle タグマネージャーで管理しています。
Google タグマネージャー
Google アナリティクスで目標設定は設定済みか、正常に数字を取れるか
Google アナリティクスを入れてるだけだと公開したあと後悔する事になると思います。
目標設定が取れてないとクライアントに怒られるかもです…。
フォームは正常に動くか

公開前にテストはしてると思いますが、念のためもう一度確認。
きちんと送信できているか、送信完了メールは迷惑メールに入ってないか、送信があったメールはクライアント(担当者)にも受信できているかも確認が必要です。
気が付きにくいところですが、ここでエラーが出ているとクライアントとユーザーにも迷惑をかけるのでかなり激おこされます。

META関連

titleタグは適切に記載されているか
何が適切かとか言われそうですが、ページにあったタイトルになっているか、他ページと重複していないか、空白になっていないか、30文字程度に収まっているかはチェック対象に入れても良いかと思います。
descriptionは適切に記載されているか
これまた何が適切かとか言われそうですが、本文のコピペではなく検索したユーザーが興味を引くような説明になってる事が好まれるでしょう。
不要なページは検索に引っかからないようになっているか
コンテンツとして中身の薄いページ、検索して訪問してほしくないページなどnoindexなどで検索対象にならないようになっているかのチェックです。不要なページを検索対象から外すのも立派なSEO対策なんですってよ。
OGPは正常に表示されるか(twitter・facebook)
忘れがちなOGPの確認。実際のURLで試しておかないと思わぬ落とし穴があったり…。
公開前の知らない間に仕様が変わるなんて事もありますしね…。
faviconは設定されているか
faviconの有無はchromeのデベロッパーツールでもエラーとして表示されてるので個人的にはもう必須と思っています。
タブブラウザが主流の今faviconがあるとないのって結構違いますしね。
faviconはブックマークされたときも見栄えが差別化されるので役に立ちます。

SEO関連

サーチコンソールの設定は済んでいるか
通称さちこ。sitemap.xml、robots.txtの登録も同時に確認。
検索ワードなど後々解析するのにも大助かりです。
サーチコンソール
パンくずはページ内に適切に記載されているか
そもそもパンくずはあるか。URLのディレクトリとばらばらになっていないか確認。
静的ページを量産したときにコピペの修正漏れでコピー元のパンくずになっていることなんて事もありますよね。
見出しタグはクローラーが理解しやすいようになっているか
サイト内にh1タグh2などがきちんと順番通りに並んでいるか。急にh3タグとかでてきてないか。
私はchromeでエクステンション入れて確認してます。
HTML5 Outliner

コンテンツ関連

文言は適切か
誤字脱字はないかの確認。私はよく誤字脱字します!
ダミー画像はないか
レンタルポジの素材が購入前のサンプルのままで公開してないかのチェックは非常に重要ですね。
画像にaltの漏れはないか
全部の画像にaltが必要なんてことはないですが、わかりにくい文言だったりしてないか今一度確認。
私はchromeでエクステンション入れて確認してます。
Alt & Meta viewer
リンクは適切か
別のページに遷移してないか、リンク切れになっていないかのチェック。
もちろんPC/スマホどちらも要チェックですね。

私はchromeでエクステンション入れて確認してます。(リンク切れのみ)
Check My Links

JavaScriptにエラーはないか
ブラウザのコンソールを使ってJavaScriptがエラー出してないかもチェック。
おそらく制作時にプログラマ・コーダーがチェックしてると思いますが念のため。
公開後に修正となるとみんなテンション下がるので、エラー関係はなるべく公開前にかたずけて置きたいものです。
ファイルのリンク切れはないか
PDFへのリンク切れやCSS、画像などのリンクが切れてないかもチェックが必要ですね。
私はWindowsユーザーなのでWebsite Explorerを使っていますがmacで類似のツールがあれば教えてください…。

最後に

炎上してる案件ほど公開前のチェックがずさんになるので人の協力が必要になってくると思います。
WEBの基礎知識がない人でも協力してもらえるところはたくさんあるので、炎上してる時ほど、適切な人員配置の人海戦術をしてチェックする体制が取れる状態で臨みましょう。

スプレッドシートで公開してるのでみなさんの使い勝手のいいようにカスタマイズしちゃってください。
チェックシート

そもそも炎上したら絶対ダメなんだからね(*ゝω・*)

需要がありそうならWordPress用のチェックシートも公開するかもです。

関連記事

炎上は嫌だ…チームで使える進捗管理表(作りました)... 制作スケジュールって立てたは良いけど守れたりしてますか? そもそも気がついたら遅れてるなんて事ありませんか? 私はちょくちょくあります(´;ω;`) スケジュール管理の難しさ スケジュール管理ができなくなる原因を考えてみるとすごく単純でスケジュールが共有されていない&勝手に順調に...
【サンプル有】【簡単】スプレッドシートで記事のシェア数を一覧で取得する方法... Webサイトを運営していると、PVとかはGA(GoogleAnalytics)とかで一気にチェック出来ますが、SNSのシェア数のチェックは中々難しいですよね。 PVや離脱率も大事ですが、反響という意味でシェア数を一つの指針に加えるのはとても重要なことです。 私...
Webデザイナもアクセス解析を覚えるとハッピーになれる話|Web解析 Advent Calendar... Web解析 Advent Calendar 2015の9日目の担当です。 このAdvent Calendarきちんとスケジュール通り記事書かれてなかったり、リンク切れてたり、過去の記事にリンク張っただけの人いたり、Web解析の人って自由な方多いのかしらと思い、真面目で堅物な私が書いて良いのかしらっ...
WEBアンケートをGoogle Driveで作って良かった... 簡単なアンケートや申し込みフォームを必要な場合は、Google Docs の「フォーム」を利用すれば簡単にできました。 気に入ったところ 簡単 すぐ作れる。 集計も取れる。 フォームのタイプが豊富 必須項目もつけれる 回答者が回答後も再編集可能な点 不満 デザイ...