サイトの構成と導線の設計

サイトの構成は、会社の組織図ではありません。読み手が「次にどこへ行くか」を迷わないための順路です。 だから合否は見た目では決まりません。決まるのは2つだけで、行き止まりのページが0であることと、どのページからでも問い合わせに届くことです。 この章は、ページを並べ、階層を3段以内に収め、全ページに「次の行き先」を1つ書いて、公開後に足すページの置き場所まで決めるための章です。

この章で分かること

• トップページの役割（全部載せる場所ではない理由）と、階層・クリック数の目安
• 全ページに「次の行き先」を割り当てる表の作り方
• 問い合わせ導線の置き場所と、電話番号・URL・パンくず・追加ページの決め方

トップページは「振り分けるページ」

トップページに情報を集めるほど、問い合わせは減ります。読み手が探す対象が増えるからです。トップページの仕事は3つだけです。

なぜそうなるのかを、順に説明します。サイトを訪れた人は、そのページを読みに来たのではなく、自分の困りごとに答えがあるかを確かめに来ています。確かめる作業は、本人にとって面倒な作業です。面倒な作業に付き合ってくれる時間は、長くありません。トップページに情報が多いほど、この確かめる作業が長くなり、途中で帰る人が増えます。

発注する側から見ると、この理屈は直感に反します。伝えたいことが多いのだから、多く載せたほうが伝わるはずだ、と考えるのが自然です。ところが、読み手の側には「全部読んでから判断する」という選択肢がありません。読み手がやっているのは、読むことではなく、選ぶことです。選ぶ作業を助けるページと、選ぶ作業を邪魔するページがあり、情報量が多いページは後者になります。

だからトップページの設計は、何を載せるかではなく、何を載せないかを決める作業になります。載せないと決めたものは、消えるのではなく各ページに移ります。移す先が見つからない情報が出てきたら、それはそもそも誰にも必要とされていない情報かもしれません。

仕事	具体的に置くもの	置かないもの
何の会社かを言う	1行の説明（誰向けに、何をする会社か）	長い理念・社史
誰向けかを示す	対象・対応エリア・対応できる規模	業界用語だけの事業一覧
行き先に振り分ける	サービス・実績・採用・問い合わせへの入口	全ページへのリンクを並べたメニュー

この表は、左から右へ1行ずつ、対にして読んでください。中央の列が「置くもの」、右の列が「置かないもの」で、同じ行の2つは同じ話題を扱っています。多くの会社でトップページが重くなる原因は、中央の列を置き忘れているからではなく、右の列を一緒に置いてしまっているからです。理念も事業一覧も、それ自体は悪いものではありません。置く場所が違うだけです。

判定は1つです。トップページを開いて5秒で、「何の会社で、自分が対象かどうか」が分かるか。 分からなければ、写真やアニメーションを増やしても直りません。

2章の表1（ページ一覧）の2列目に書いた「起こさせたい行動」を、そのままトップの振り分け先にします。1章の目的の1行が、ここで全ページに分配されます。

構成は「図」にする。表でも代わりになる

構成は、頭の中ではなく1枚の図にします。手書きでもパワーポイントでも構いません。図を書けない場合は、次の表で代用できます。

階層	ページ名	親	このページの役割	次の行き先
1	トップ	—	振り分ける	サービス一覧
2	サービス一覧	トップ	該当するサービスを選ばせる	各サービス
3	サービスA	サービス一覧	問い合わせさせる	問い合わせ
3	サービスB	サービス一覧	問い合わせさせる	問い合わせ
2	実績一覧	トップ	自社と同じ業種を探させる	サービスA／問い合わせ
3	実績（個別）	実績一覧	該当サービスへ戻す	サービスA
2	会社概要	トップ	信用を確認させる	問い合わせ
2	採用	トップ	応募させる	応募フォーム
2	問い合わせ	トップ	送信させる	（完了ページ）
2	お知らせ一覧	トップ	動いている会社だと示す	サービス一覧

この表を作る効用は、完成した表そのものより、埋める過程にあります。「このページの役割」の欄が書けないページと、「次の行き先」の欄が書けないページが、必ず数行出てきます。その行が、公開後に更新されなくなるページです。制作会社との打ち合わせでこの表を広げ、書けなかった欄を先に潰しておくと、後から「このページは何のためにあるんでしたっけ」という会話が起きません。

10ページ前後のサイトなら、この表は30分で埋まります。図を描くより速いことも多いので、図が苦手な方は最初から表で構いません。大事なのは形式ではなく、全ページが1枚に載っていることです。

この表に載っていないページは、作らないか、載せるかのどちらかにしてください。 図にも表にも無いのに存在するページは、公開後に誰も更新しません。

階層は3段、重要ページは2クリック以内

決めごと	目安	理由
階層の深さ	3段以内（トップ→カテゴリ→個別）	4段目に入ったページは、読み手も社内も存在を忘れる
重要ページまでのクリック数	トップから2クリック以内	売りたいページ・採用ページが該当
メニューの項目数	5〜7個	多いほど選べなくなる。スマホでは特に
1ページの役割	1つ	2つ書くと、どちらも中途半端になる

10ページ前後のサイトで4段目が出るときは、たいてい分類の仕方が間違っています。分類は会社の部署ではなく、読み手の探し方で切ってください。

全ページに「次の行き先」を1つ書く

この章の必須項目の1つ目です。読み終わったあとに行く場所が無いページを、行き止まりと呼びます。

よくある行き止まり	直し方
会社概要（読んで終わり）	末尾に「相談する」と、関連するサービスページへの導線を置く
実績の個別ページ	該当するサービスページへ戻す（一覧に戻すだけにしない）
お知らせの個別ページ	サービス一覧か、関連する実績へ
採用の募集要項	応募フォームへ（「気になる方はご連絡ください」だけにしない）
送信完了ページ	返信までの日数を書き、実績かお知らせへ戻す

送信完了ページを忘れる会社がとても多いです。 ここは、問い合わせた人が最後に見る画面です。「送信しました」だけでは、返信を待つ人が不安になります。返信までの日数と、その後の流れを書いてください。

よくあるのは、実績ページはよく読まれているのに問い合わせが増えない、という形です。調べてみると、実績の個別ページの末尾にあるのが、実績一覧へ戻るリンクだけ。読み手は、自社と似た事例を見つけて「これはうちでもできるのか」と思った瞬間に、一覧へ戻されます。戻った先には、また事例が並んでいる。事例を3つ4つ見て、そのまま帰ってしまいます。

直すのは、実績ページの末尾に、該当するサービスページへのリンクと、相談を促す1行を足すことだけです。ページを増やす必要も、文章を書き直す必要もありません。最も読み込んでくれた人を、出口なしで帰すのを止めるだけです。

行き止まりが損をするのは、読まれていないページではなく、よく読まれているページで起きたときです。点検するときは、アクセスの多い順に上から5ページだけ見てください。全ページを一度に直そうとすると、たいてい途中で止まります。

導線を決める手順

ページごとに、次の3行を埋めるだけです。

埋めること	例（実績の個別ページ）
このページを読んだ人は、次に何を知りたいか	同じことを自社でやるといくらかかるか
その答えがあるページはどれか	サービスAのページ
行かせる手段は何か	本文末尾のボタン＋関連リンク

「次に何を知りたいか」が書けないページは、ページの中身が足りていないか、そもそも必要のないページです。

問い合わせ導線は、全ページから届かせる

この章の必須項目の2つ目です。置き場所は決まっています。

場所	置くもの	備考
ヘッダー（全ページ）	「お問い合わせ」ボタン	スマホでも常に見える形にする
フッター（全ページ）	問い合わせ・電話・会社情報	ページの最後まで読んだ人の出口
各ページの本文末尾	そのページの内容に合った誘導文＋ボタン	「お問い合わせはこちら」だけにしない
サービスページの途中	長いページなら中ほどにもう1つ	最後まで読まない人がいる

ボタンの文言は「お問い合わせ」だけにしないでください。 何が起きるか分からないボタンは押されません。「見積もりを依頼する」「まず相談する（無料）」「資料を受け取る」のように、押した後に起きることを書きます。

電話番号の扱いを決める

これは好みではなく、業務の話です。

判断	条件
載せる＋スマホでタップ発信できるようにする	電話で受けられる人が、営業時間中は必ずいる
載せるが、受付時間を明記する	時間外の着信が困る
載せない（フォームだけ）	電話を取れる人がいない／営業電話を増やしたくない

取れない電話番号を載せるのが、いちばん損をします。 かけて出なかった会社に、二度目はありません。電話を受ける人がいないなら、載せないほうが良い判断です。

載せるか載せないかで迷ったら、社内で「誰が取るか」を先に聞いてください。その質問に名前で答えられないなら、載せない側に倒します。「手が空いている人が取る」という答えは、実際には誰も取らないという意味になりがちです。

逆に、電話で受けたほうが早く決まる商売——見積が現地を見ないと出せない、急ぎの依頼が多い、といった業態——では、載せる側に倒してください。その場合は受付時間を必ず明記します。時間を書いておけば、時間外にかけた人は「不在だった」ではなく「時間外だった」と理解します。同じ不通でも、受ける印象がまったく違います。

URLの付け方は、規則を1つに決める

URL（ページのアドレス）は、後から変えると転送設定が必要になります（10章）。作るときに規則を1つ決めて、最後まで守ってください。

決めること	決め方の例
英語か日本語か	どちらでもよい。ただし混在させない
単語の区切り	ハイフンでそろえる
大文字・小文字	小文字でそろえる
階層の付け方	サービス配下なら /services/◯◯ のように親を入れる
末尾のスラッシュ	あり・なしのどちらかにそろえる

日本語URLは、そのまま表示されると読みやすい一方、コピーすると長い文字列になります。社外に貼る機会が多いなら英語、社内資料が中心なら日本語、程度の判断で構いません。どちらでも大きな差は出ません。

検索での扱い（URLの設計が順位にどう影響するか、クラスタとハブの作り方）は、この教科書では扱いません。 SEOの教科書 5章（サイト構造とURL設計） を見てください。この章で決めるのは、発注側が迷わず運用できる規則が1つあるかどうかだけです。

パンくずと、重複ページの整理

パンくず（トップ > サービス > サービスA のような表示）は、トップ以外の全ページに出してください。読み手が今どこにいるかを示す唯一の手がかりです。検索結果から個別ページに直接入ってきた人は、トップを見ていません。

同じ内容のページが2つ以上あるのも、この段階で潰します。

よくある重複	判断
「サービス」と「事業内容」	統合する。片方を消す
「よくある質問」が各ページと一覧に散っている	一覧に集約するか、各ページに置くかを決める
「会社概要」と「私たちについて」	統合する
「お知らせ」と「ブログ」と「コラム」	更新する人がいる入れ物だけ残す（2章の表3）

判定は簡単です。2つのページの違いを1行で説明できないなら、1つにしてください。

公開後に足すページの置き場所を先に作る

サイトは公開後に必ず増えます。増やす場所を先に決めておかないと、トップページの下にページが直付けされていき、2年後には階層が崩れます。

入れ物	何を足すか	要否の判断
お知らせ	会社の動き・休業案内	月1回以上更新する人がいるなら作る
実績・事例	案件ごとの記録	営業で使うなら作る。最も効きやすい入れ物
記事・コラム	検索から人を集める記事	書く人がいる場合だけ。いないなら作らない
よくある質問	問い合わせで毎回聞かれること	作る。問い合わせ対応の時間が減る
採用の募集要項	職種ごとの募集	継続採用するなら作る

「記事・コラム」は、入れ物だけ作って空のまま放置されるページの第1位です。 2章の表3で「社内でやる人」に名前が入らなかったなら、作らないでください。空のブログは、更新が止まっていることを公開し続けます。

作らない・置かない判断

よくある要望	当社の判断
メニューに全ページを並べたい（メガメニュー）	10ページ前後なら不要。5〜7項目に絞る
トップに全サービスの説明を載せたい	載せない。振り分けに徹する
サイト内検索を付けたい	50ページ未満なら不要。構成が正しければ検索されない
各ページにSNSのシェアボタンを付けたい	BtoBではほぼ押されない。押される種類のページだけに置く
動くスライドを一番上に置きたい	1枚目しか見られないことが多い。1枚で言い切るほうが早い
ページを30に増やしたい	「無いと誰が困るか」が書けるページだけ足す（2章）

この表は、要望を断るための表ではなく、要望の裏にある目的を聞き直すための表です。右の列に書いてあるのは当社の判断であって、絶対の正解ではありません。たとえばサイト内検索は、50ページ未満なら不要というのが当社の見方ですが、製品を型番で探す商売なら話は別です。要望が出たときは、右の列を根拠に断るのではなく、「それが必要になるのはどういう場面ですか」と一度聞いてください。場面が具体的に返ってくる要望は、たいてい足す価値があります。

サイト内検索の行は、構成の出来を測る指標でもあります。 読み手が検索したくなるのは、たいてい構成で目的地に辿り着けないときです。

よくある間違いを5つ

「トップページに全部載せる」 ——全部載せると、読み手は自分に関係のある部分を探さなければなりません。探す手間は離脱に直結します。直し方：トップの役割を「何の会社か」「誰向けか」「どこへ行くか」の3つに限定し、詳細は各ページに移す。

「会社の組織図どおりにメニューを作る」 ——読み手は自社の部署を知りません。「第一事業部のサービス」と書かれても選べません。直し方：分類を読み手の探し方（困りごと・業種・エリア）で切り直す。社内の呼び名を外に出さない。

「各ページの最後を『以上です』で終わらせる」 ——読み終わった人がそのまま離脱します。最も読み込んでくれた人を、出口なしで帰すことになります。直し方：全ページの末尾に、次の行き先を1つだけ置く。2つ以上置くと、また選ばせることになる。

「問い合わせページを作ったから導線は足りている」 ——ページがあることと、辿り着けることは別です。メニューの一番右にあるだけでは、スマホではメニューを開かないと見えません。直し方：ヘッダーに常時表示のボタンを置き、フッターと各ページ末尾にも置く。押した後に何が起きるかを文言に書く。

「ブログを作れば人が来る」 ——入れ物を作っても、書く人がいなければ空のままです。更新が止まったブログは、会社が止まって見えます。直し方：2章の表3で「書く人」に名前が入る場合だけ作る。いないなら、実績・よくある質問など、社内の誰かが書ける入れ物に変える。

この章の出口

この章を終えたとき、手元に残っているべきものは3つです。

1. サイトマップ図（または階層の表）。全ページが載っていて、階層は3段以内
2. 全ページの「次の行き先」。行き止まりが0
3. 問い合わせ導線の置き場所とボタンの文言、電話番号の扱い、URLの規則

順路が決まりました。次に決めるのは、その順路に流し込む中身です。 どれだけ導線が正しくても、各ページに書いてあることが「弊社は誠実に対応いたします」だけでは、読み手は判断できません。

次の章へ：6章 サイトの原稿と写真｜誰がいつ書くか