サイトチェック
新CMS完全対応マニュアル
目次
- 1. 各ページに適切なURLとページ名が設定されている
- 2.制作したページが全て公開状態になっている（404含む）
- 3.フォームのサンクスページ、404ページ、パーツ集にNo Indexタグが設定されている
- 4.各ページに適切なタイトル・ディスクリプションが設定されている
- 5.見出しがH1、H2、H3……の順に正しく配置されている
- 6.イメージパーツで設定している画像サイズは、 すべて「オリジナル」&「フィットしない」（グレイの状態）で設定している
- 7.使用している全ての画像にaltが設定されている
- 8.電話番号・お問い合わせボタンなど、クリックを計測すべきリンクがCTAとイベントで設置されている
- 9.全てのリンクが正常に遷移する
- 10.電話番号・お問い合わせボタンなど、クリックを計測すべきリンクがCTAとイベントで設置されている
その他の設定に関するチェック
STEP2ではサイト全体の構成に関わるチェックを行います。
こちらではその他の設定に関するチェック作業の前半部分を解説していますのでご参照ください。
こちらではその他の設定に関するチェック作業の前半部分を解説していますのでご参照ください。
通常案件のサイトチェック時に確認する項目について解説しています。
通常案件のチェック項目に合わせて、LPのサイトチェックを行う際に確認する項目を解説しています。
その他の設定（STEP2）
1. 各ページに適切なURLとページ名が設定されている
01
関連資料を開く
ディレクターから共有される「制作管理用シート」※1を開いて参照します。
※1 通常スプレッドシートの形で別途共有されます
※1 通常スプレッドシートの形で別途共有されます
02
ページ名の確認
「制作管理用シート」B〜C列のページ名を目視し、fOのページ設定の「ページ名」が正しく設定されていることを確認します。
03
URLの確認
「制作管理用シート」E列の「URL」を目視し、fOのページ設定の「URL」が正しく設定されていることを確認します。
作業時のPOINT
第三階層以降のページの場合、直前の階層のURLが抜けていないかをチェックします。
2.制作したページが全て公開状態になっている（404含む）
01
公開ページを開く
「テスト公開URL」をクリックして、ブラウザに表示させます。
02
「制作管理用シート」を上から順にたどりブラウザに表示させる
「制作管理用シート」内のURLを追加し、公開の状態になっていることを確認します。
03
ブラウザ表示を確認する
全てのページが404ページにならないことを確認します。
04
404ページの表示を確認する
適当な文字列をURLに追加し、404ページになることを確認します。
デフォルトの404ページは、左上のロゴがferret Oneとなり、
「お探しのページは見つかりませんでした | ferret One」というタイトルになっています。
個別に作っている場合は、サイト専用の404ページに遷移します。
作業時のPOINT
下記のようにページ設定画面から確認することも出来ます。その場合、公開中（緑色）になっていることを確認します。
注意事項
制作管理用シートに制作予定が無く、使用しないページが非公開で残っていることがあります。
（「使用しないページはこの下層に」というページの下層に不要ページなど）
その場合、ディレクターに該当ページを残すかどうかの判断を仰ぎ、不要な場合には削除してください。お客様とのやりとりの中で残すことが決まっている場合もあります。
（「使用しないページはこの下層に」というページの下層に不要ページなど）
その場合、ディレクターに該当ページを残すかどうかの判断を仰ぎ、不要な場合には削除してください。お客様とのやりとりの中で残すことが決まっている場合もあります。
3.フォームのサンクスページ、404ページ、リダイレクト元ページ、パーツ集にNo Indexタグが設定されている
01
設定を確認する画面を開く
管理画面 ＞ 上記の各ページ一覧 ＞ SEO設定を開きます。
02
設定を確認する
検索エンジン設定の「検索エンジンに対して、インデックスされないように設定する（NOINDEX）」にチェックが入っていることを確認します。
作業時のPOINT
※ページ一覧 ＞ 右上にある「ページの一括設定」ボタンからも確認が可能です。（ページの一括設定 のNo Indexタグの項目が出力するになっていた場合、noindexにチェックが入っていることを確認できます）
※ブログページの表示確認は ページ一覧 ＞ SEO設定 からのみ確認することが出来ます。
注意事項
サンクスページはフォームごとに個別にページがあるので、全て確認漏れのないようにチェックしてください。
4.各ページに適切なタイトル・ディスクリプションが設定されている
01
関連資料を開く
「制作管理用シート」を開きます。
02
設定を確認する画面を開く
管理画面 ＞ サイト ＞ タイトル・ディスクリプション を開きます。
03
関連資料と設定を比較する
「制作管理用シート」と設定を比較し、各タイトルとディスクリプションに空欄や間違いがないかを確認します。
04
ブログページの設定を確認する
ブログページのみ設定方法が例外となります。 ページ一覧 ＞ SEO設定 から確認してください。
作業時のPOINT
「制作管理用シート」のタイトル・ディスクリプションが空欄の場合は担当ディレクターに確認を取るようにしてください。
5.見出しがH1、H2、H3……の順に正しく配置されている
01
公開ページを開く
「制作管理用シート」に入っているページを対象に、fOのページ一覧から「公開ページ」をクリックして、ブラウザに表示させます。
02
拡張機能を使用して確認する
下記の赤枠のアイコンをクリックするとポップアップが出るのでHEADERSをチェックします。
エラーの赤色のテキストが無いかチェックします。（h1のテキスト量が少ない場合のエラーはスルーで問題ありません）
エラーの赤色のテキストが無いかチェックします。（h1のテキスト量が少ない場合のエラーはスルーで問題ありません）
作業時のPOINT
HTMLは入れ子構造になっているため、
のような並びになっているものはOKとします。
もしh1の下にh2がなく、h3になっている場合などにはエラーが出ますので、修正をお願いします。
お客様のご要望や、特殊な構造のデザインの場合にはディレクターに指示を仰いでください。
もしh1の下にh2がなく、h3になっている場合などにはエラーが出ますので、修正をお願いします。
お客様のご要望や、特殊な構造のデザインの場合にはディレクターに指示を仰いでください。
6.イメージパーツで設定している画像サイズは、
すべて「オリジナル」&「フィットしない」（グレイの状態）で設定している
01
編集画面を開く
チェック対象ページの編集画面を開きます。
02
画像1枚ずつ設定を確認する
イメージパーツを使用している箇所をクリックし、「オリジナル」「フィットしない」の設定になっているかを確認します。
下記のリンク先と表示が同じ状態になっているかを確認してください。
注意事項
デザイン上、ラージやフィットするになっている場合もあるので不明な場合は制作者に確認してください。
7.使用している全ての画像にaltが設定されている
01
公開ページを開く
「テスト公開URL」をクリックして、ブラウザに表示させます。
02
関連資料を開く
「制作管理用シート」を開きます。
03
拡張機能を使用する
Chromeの拡張機能「META SEO inspector」をクリックし、「画像」内に「WARNING x images (out of x) with missing ALT attribute」が出ていないかを確認します。
04
全ページの確認を行う
※「WARNING x images」となっている部分がaltが設定されていない画像数となります。
※fOではロゴにaltを設定できない仕様となっているのでチェック対象からは除きます。
※fOではロゴにaltを設定できない仕様となっているのでチェック対象からは除きます。
altチェック対象ではない画像
以下に関しては、チェック時にaltが設定されている必要がありません。
- パーツ集 / 使用しないページの画像
- ヘッダーロゴ
- 背景画像
- 1x1など小さいサイズの画像
- 記事リストパーツの画像
- 擬似要素
8.電話番号・お問い合わせボタンなど、クリックを計測すべきリンクがCTAとイベントで設置されている
01
共通パーツの編集画面、またはボタンパーツを開く
電話番号やお問い合わせボタンといった、クリックを計測すべきリンクの設定を開きます。
02
サイト内で使用している共通パーツ内のボタン・リッチテキストのリンクに、以下の設定がなされているかを確認する
- イベント名（フォーム名など、何のリンクかを入力する）とラベル（「CTA」「ヘッダー」など、設置箇所名を入力する）が設定されているか
- CTAのクリックイベントとして計測にチェックが入っているか
03
サイト内全ての電話番号・お問い合わせボタン・資料ダウンロードボタン等のイベント設定を確認する
ヘッダーやフッター、コンテンツ内に電話番号・お問い合わせ・資料ダウンロード等イベントの設定が必要なボタンのイベント等が設定されているかを確認します
04
リッチテキストのリンクのイベント設定を確認する
リッチテキストのリンクでサイト内フォームのページにリンクしているもの・電話番号のリンクも同様に設定が出来ているかを確認をします。
作業時のPOINT
- サイト内全てのフォームにリンクしているボタン、リッチテキストリンクに対してチェックを行います。
- 直接編集画面で該当箇所をチェックする以外にも、検証ツールを使用してチェックすることが可能です。
- フォームに遷移させるリンクでも、もしフォームが同一ページ内にある場合は「CTAのクリックイベントとして計測」にチェックを入れる必要はありません。
- 資料ダウンロードサンクスページの資料ダウンロードボタンはリンク先がフォームではないのでイベント設定は必要ありません。
- 情報が全て揃っていない場合も、最低限の設定してあるか確認する（例1：TELボタンの電話番号の情報がない場合、リンクに設定しているURLの欄ににtel:の設定があり、イベント設定も完了し、番号だけ差し替えればよい状態になっている。例2:外部リンクでリンク先が未定の場合、別ウィンドウで開くにチェックが入っている）
ラベルの書き方
ラベルは設置個所により、以下のようにわかりやすい名前で書いてください。
（ヘッダ / MV / コンテンツ中部 / コンテンツ下部 / CTA 等）
TELボタンの設定（下記スクリーンショット参照）
- リンク先は「外部サイト」にチェック
- ボタン設定画面の「別ウィンドウで開く」にチェック
- CTAリンクに設定しているURLの項目は tel:00-0000-0000 のように電話番号の前に「tel:」が入っていることを確認する
9.全てのリンクが正常に遷移する
01
公開ページを開く
「テスト公開URL」をクリックして、ブラウザに表示させます。
02
サイト内全てのリンクを確認する
「ロゴ」「ナビゲーション1段目」「グローバルナビ」「コンテンツ内リンク」「共通パーツ」「PAGE TOP」「フッター」内にある各リンクをクリックして、該当ページへ正しく遷移することを確認します。
作業時のPOINT
フッターに関しては、制作時にリンク先が定まっていない場合、仮リンク（#）が設定されている可能性があります。 サイトチェックの時点でリンク先が再設定されていない場合があるので、後述するChrome拡張機能「Check My Links」を補助的に使い、リンクの設定が明らかに必要な箇所を確認することができます。
使用ツール
Googleの拡張機能「Check My Links」を使用して確認することが出来ます。
使用目的：リンクのエラー箇所がないかを確認する際に使用します
追加・設定方法：下記まとめサイトを参考に設定を行ってください（ベーシックとは関係がない外部サイトに飛びます）
使用方法
手順①：追加後Chrome画面右上にアイコンが表示されるのでクリックします。
（［オプション］から必要な設定を行わないとChrome上で正常に機能しませんのでご注意ください）
（［オプション］から必要な設定を行わないとChrome上で正常に機能しませんのでご注意ください）
手順②：クリックするとリンクのチェックが始まり結果が画面上に表示されるので確認します。
チェック結果の見方
①［Valid links］- 有効なリンク
②［Valid redirecting links］- 有効なリンク（リダイレクトするもの）
③［Warnings］- 警告。同一ページ内にリンクさせるなど、リンク先設定が正しくない可能性があるもの（正常な場合もあります）
④［Invalid links］- 無効なリンク（リンク切れ）
②［Valid redirecting links］- 有効なリンク（リダイレクトするもの）
③［Warnings］- 警告。同一ページ内にリンクさせるなど、リンク先設定が正しくない可能性があるもの（正常な場合もあります）
④［Invalid links］- 無効なリンク（リンク切れ）
ページ上のリンク自体にも同時に色付けがなされ、リンクが正常に設定されていない場合は上記のように表示されることがあります。
特に同一ページ内へ遷移させるリンク（エラー200）やリンク切れ（エラー404）と色付けされている場合は重点的にチェックを行うようにしましょう。
特に同一ページ内へ遷移させるリンク（エラー200）やリンク切れ（エラー404）と色付けされている場合は重点的にチェックを行うようにしましょう。
注意事項
- ページ内リンクについてはメニュー固定があると、遷移位置がずれることがあるため、特に注意する。（ずれていた場合は制作者に連絡し修正してもらう）
- フォームのプライバシーポリシーのリンクは内部サイトの場合でも別ウィンドウで開く設定になっています。
チェック結果が素早く出る便利なツールですが、以下のリンクに関しては仕様上認識されない場合があり、クリックし目視で確認する必要があります。すべてのエラーを検出するわけではありませんので、もし使用される場合は十分注意してください
また、このツールの使用はあくまで一例であって、使用を強制するものではありません。
パートナー様が使用されている精度の高いリンクチェックツールがあればそちらを使用していただけます。
パートナー様が使用されている精度の高いリンクチェックツールがあればそちらを使用していただけます。
10.電話番号・お問い合わせボタンなど、クリックを計測すべきリンクがCTAとイベントで設置されている
※ディレクターから固定化しない指示が場合と、新CMSでデザインパーツのみを使用して構築したLPは対象外。
01
共通ナビの編集画面を開く
共通エリア一覧から共通ナビの「編集」をクリックして開く
02
編集画面のメニューパレッドから「ナビゲーションをカスタマイズ」を開く。
デザイン設定 ＞ 位置を固定する にチェックが入っていることを確認します。
03
公開画面を確認する
共通ナビゲーションが固定化されていること（ハンバーガーメニューを含め）、アンカーリンク位置がずれていないことを確認します。
【アンカーリンク位置がずれている場合】
LPのサイトチェックでのみ確認する項目（STEP2）
1. 制作したLPページと関連したページ
（例：404・フォームサンクスページ）が公開状態になっている。
LPページと関連したページ以外は非公開になっている。
01
LPを開く
「テスト公開URL」をクリックして、ブラウザに表示させます。
02
LPに関連したページを確認する
ページの一覧画面からLPに必要なページ（基本はフォームのサンクスページと404ページ）をクリックし、ページ設定 > 表示状態 > ボタンが公開中（緑色）になっているかどうかを確認します。
03
その他のページを確認する
02で確認したページ以外のページをクリックし、ボタンが非公開（灰色）になっているかどうかを確認します。
作業時のPOINT
既存もしくは新規制作予定のサービスサイトがある時など、非公開に設定をしない場合もあります。
※既にサービスサイトを公開していてLPを新規で制作する場合、LPを公開中の状態で制作作業をしないようご注意ください！！
イレギュラーの対応がある場合にはディレクターに確認をしてください。
※既にサービスサイトを公開していてLPを新規で制作する場合、LPを公開中の状態で制作作業をしないようご注意ください！！
イレギュラーの対応がある場合にはディレクターに確認をしてください。
© Basic Inc. All Rights Reserved.