ホームページを訪れたお客様は、最初の数秒で「このサイトに自分の求めているものがあるか」を判断します。そのとき、ファーストビューの次に目が向くのがナビゲーションメニューです。メニューを見て「料金」「サービス」「問い合わせ」の場所がすぐ分かれば、そのまま読み進めてもらえます。逆にメニュー項目が多すぎたり、ラベルが分かりにくかったりすると、どこを見ればいいか分からないまま離脱されてしまいます。
- ナビゲーション設計がサイトの成果に与える影響
- メニュー項目の数と優先順位の考え方
- ラベル(文言)の選び方——伝わる言葉と伝わらない言葉
- スマートフォン向けハンバーガーメニューの注意点
- ページ構造(サイトマップ)の設計方法
ナビゲーションが悪いと何が起きるか
訪問者がサイトで迷子になったとき、「探し続ける」ではなく「ページを閉じる」を選ぶことがほとんどです。Googleもこの行動(直帰率・滞在時間)を評価指標として使っているため、ナビゲーションの使いにくさはSEOにも悪影響を与えます。
ナビゲーションメニューの
適切な項目数の目安
お客様が目的ページに
たどり着くまでの理想のクリック数
スクロールしても
常にメニューが見える状態が理想
ナビゲーションは「作る側の都合」で設計しがち。「お客様が何を探しているか」から逆算して作ることが、使われるメニューを生む。
メニュー項目の数と優先順位
人間が一度に無理なく把握できる情報量は7±2個と言われています。メニュー項目はこれを目安に、多くても7項目以内に抑えることをおすすめします。項目が多くなるほど「どれを見ればいいか」という判断コストが増え、クリックされにくくなります。
度高
必ず入れるべき項目
「ホーム(トップ)」「サービス・メニュー」「料金」「お問い合わせ」の4つは、ほぼすべてのビジネスサイトで必要です。特に「料金」と「お問い合わせ」は、訪問者が次の行動を決める前に必ず確認するページなので、メニューの中で迷わず見つけられる位置に置きます。
次第
業種・目的によって追加する項目
「実績・事例」「スタッフ紹介・プロフィール」「よくある質問」「ブログ・お知らせ」「アクセス」など、ビジネスの性質に合わせて追加します。ただし「あると便利だから」という理由で項目を増やしすぎると、重要なページが埋もれてしまいます。「このページがメニューにないと困るか」という基準で取捨選択しましょう。
ター
ヘッダーではなくフッターに置く項目
「プライバシーポリシー」「特定商取引法に基づく表記」「サイトマップ」などの法的・補足的なページは、ヘッダーメニューではなくページ最下部のフッターに置きます。これらはお客様が積極的に探すページではないため、ヘッダーに置くと重要なリンクを圧迫するだけです。
ラベル(文言)の選び方——伝わる言葉、伝わらない言葉
メニューのラベルは、お客様が「ここをクリックすれば何が見られるか」を一瞬で理解できる言葉を選ぶことが大切です。制作側の視点での命名と、お客様の視点での命名は、しばしばずれます。
| お客様に伝わりやすいラベル ◎ | 伝わりにくいラベル △ |
|---|---|
| サービス内容・メニュー・施術メニュー | WORKS・ソリューション・取り組み |
| 料金・料金プラン・価格 | PRICE(英語のみで日本語なし) |
| お問い合わせ・まず相談する | CONTACT・コンタクト |
| よくある質問・Q&A | インフォメーション |
| 院長プロフィール・スタッフ紹介 | ABOUT・アバウト |
英語のラベルはデザイン的にすっきり見える反面、直感的に内容が伝わりにくいことがあります。ターゲットが40〜60代の方や、Webに不慣れな方が多い業種では、日本語ラベルまたは「日本語(英語)」の組み合わせにすることをおすすめします。
スマートフォンのハンバーガーメニューの注意点
スマートフォンでは画面幅が狭いため、メニューを「☰(ハンバーガーアイコン)」に格納して、タップすると開く形式がよく使われます。これ自体は標準的な設計ですが、いくつか注意が必要です。
ページ構造(サイトマップ)の作り方
メニューを設計する前に、サイト全体のページ構造を「サイトマップ」として整理することをおすすめします。どのページがあって、それがどの階層に属するかを可視化することで、メニューの項目と優先順位が自然に決まります。
「このサービスは何か」「いくらかかるか」「どんな人が担当するか」「実際に来た人はどう感じたか」「どうやって予約するか」——お客様が知りたい順番に書き出します。これがそのままページの優先順位になります。
「複数のサービスがある場合はサービス一覧→個別サービスページ」「スタッフが複数いる場合はスタッフ一覧→個別プロフィール」のように、関連するページをまとめて階層化します。階層は2〜3段階までが管理しやすい目安です。
サイトマップで全ページを洗い出したら、そのうちヘッダーメニューに常に表示すべき最重要ページを5〜7つ選びます。それ以外のページはフッターや各ページ内のリンクで補います。
ナビゲーション設計のチェックリスト
- ヘッダーメニューの項目が7つ以内に収まっているか
- 「サービス」「料金」「お問い合わせ」がメニューに含まれているか
- メニューのラベルが日本語で直感的に内容が分かるものになっているか
- プライバシーポリシーなどの補足ページがフッターに移動しているか
- スクロールしてもメニューが常に表示される(固定ヘッダー)になっているか
- スマートフォンでハンバーガーアイコンが押しやすいサイズになっているか
- 目的のページに3クリック以内でたどり着けるか確認したか
- 現在いるページがメニューで分かる「アクティブ表示」があるか
