check sheet

チェックシート

top

check sheet

サイト上での確認

テキスト

  1. 誤字・脱字・機種依存文字・ダミーテキストなどは残っていないか

  2. 意図的ではない表記のゆれがないか(例:WEB・Web・ウェブ)

  3. 表記の統一(半角・全角・日付などで表記がブレていないか)

  4. フォントが反映されているか(「WhatFont(Chromeのプラグイン)」、ブラウザの検証ツールなどで確認)

画像

  1. ダミー画像・未購入画像などは残っていないか

  2. 画像を圧縮してファイルサイズを小さくしているか

  3. Retinaディスプレイ対応のため画像は2倍で書き出しされているか

  4. altが正しく設定されているか

コンテンツ

  1. 余白がデザインカンプ通りに設定されているか

  2. カラーがデザインカンプ通りに設定されているか(「ColorPick」などで確認)

  3. 横スクロールは発生していないか

ホバー

  1. ホバー時の動きが指示通りになっているか

  2. ホバー時の動きは、急な変化になっていないか(transition設定ができているか)

  3. ホバー時のカーソルはポインターになっているか

  4. PCのみホバーアクションになっているか

フォーム

  1. バリデーションをフロントサイド・サーバーサイドでかけているか

  2. メールがちゃんと届くか(ユーザー側・管理者側)

  3. 迷惑メール・文字化けなどは起こしていないか

  4. クライアントにメールチェックOKもらっているか

  5. 確認・サンクス画面に遷移するか

  6. スマホで入力欄のfont-sizeを16px以上にしたか(それ以下だと入力時に拡大される)

  7. 同じメールが複数届かないようになっているか(送信ボタンを連打した時など)

アニメーション

  1. 指示通りのアニメーションをしているか

  2. 不自然な動きがないか

エラー

  1. ページ内でリンク切れを起こしていないか

  2. SNSなど外部のリンク先は正しいか

  3. 404ページを作成したか

  4. URLにパラメーターが付いても、jsやPHPの処理が正常に行われるか

  5. 予期せぬリダイレクトはかかっていないか

  6. コンソールエラーが出ていないか(検証ツールで確認)

その他

  1. iframeなど埋め込んだ外部メディア(地図、動画、SNSなど)が正しく表示されているか

  2. スマホでiframe要素が見切れていないか

  3. ブレイクポイント前後でチェック(640pxなら、639, 640, 641で確認)

  4. 表示速度が遅すぎるページはないか(とくにモバイル環境にて)

  5. 対象ブラウザで正しく表示されているか

  6. ページャーなどの2ページ目以降が正しく表示されるか

コーディング

HTML

  1. DOCTYPEが正しく記述されているか

  2. 開始タグと終了タグが対応しているか

  3. 文字エンコーディングが正しく設定されているか

  4. 不正な文字参照がないか

  5. 要素(headやbodyなど)が正しい場所に配置されているか

  6. 要素の階層が正しいか(li要素がulやol要素の子要素であるか)

  7. 要素のグループが正しいか(thead, tbody, tfoot要素はtable要素の子要素であるか)

  8. 要素の組み合わせが正しいか(form要素の子要素にinput要素があるか)

  9. 属性値がクォーテーションで囲まれているか

  10. 不正なタグ名が使用されていないか

  11. 不正な属性名が使用されていないか

  12. 必須の属性が欠落していないか

  13. 無効な属性値が使用されていないか

  14. 不正な文字参照が使用されていないか

  15. 不要な空白や改行がないか

  16. リンクや画像のパスが正しく記述されているか

  17. 画像のAlt属性が適切に設定されているか

  18. 不要なコメントは残っていないか

CSS

  1. セレクタにスペルミスがないか

  2. 不正なセレクタ(不正な要素やID、クラス名など)が使用されていないか

  3. 不正なプロパティ(存在しないプロパティや、対象の要素に対して使用していないプロパティ)が使用されていないか

  4. 不正な値(プロパティに対して適切でない値や存在しない値)が使用されていないか

  5. 単位(px、em、%など)の欠落がないか

  6. ブロック(大括弧{})の欠落がないか

  7. セミコロン(;)の欠落がないか

  8. @ルール(@import,@charsetなど)が正しく指定されているか

  9. URL(background-imageなど)が正しく指定されているか

  10. カラーコード(#000,rgb,hslなど)が正しく指定されているか

  11. ベンダープレフィックスが正しく指定されているか

  12. プロパティショートハンド(background, border, font)が正しく指定されているか

  13. 一貫性を持った命名規則に従ったクラス名にしているか

  14. セレクタの組み合わせが(親子関係、兄弟関係など)が正しく指定されているか

  15. 使用していないセレクタの記述がないか

  16. セレクタの記述が重複していないか

  17. minify化したか

  18. 不要なコメントは残っていないか

javascript

  1. スペルミスがないか

  2. 使用していない変数がないか

  3. 不正な演算子を使用していないか

  4. 括弧が閉じられているか

  5. セミコロンが欠落していないか

  6. スコープが正しく設定されているか

  7. console.logは残っていないか

  8. minify化したか

  9. 不要なコメントは残っていないか

SEO・マーケティング関連

herderタグ内

  1. タイトル・メタ ディスクリプションの設定(下層ページも要チェック)

  2. canonicalの設定(URLの正規化)

  3. noindex, nofollow の解除

  4. ファビコンの設定

  5. OGPの設定

計測タグ

  1. Googleアナリティクス

  2. コンバージョンタグは正しく計測されるか

  3. Google Search Console

  4. Google Tag Manager

  5. その他の計測タグ

権利・セキュリティ関連

権利・セキュリティ

  1. コピーライト表記を入れているか

  2. 著作権侵害の疑いのあるコンテンツを使っていないか

  3. サイトポリシーを表示しているか

  4. プライバシーポリシーを表示しているか

WordPress

WordPress

  1. ログイン画面のURLを変更したか

  2. /?author=1でユーザー名が表示されないか

  3. デバッグモードをoffにしたか

  4. 不要な記事データが残っていないか(下書き含む)

  5. 不要なプラグインは残っていないか

  6. データベースのバックアップ対応の有無

contact
お問い合わせ

お急ぎの方、
コーディング代行を依頼したい方
まずはオンラインで相談したい方
※現在利用不可