# Webのナビゲーションはどう変わったか — リンク集から検索・文脈型UIまでの4つの転換点

元のページ: <https://chot-inc.com/columns/web-navigation-four-turning-points>

サイト制作 2026.10.30

Web のナビゲーションは「サイト全体の目次」から「ページ単位の案内役」へと役割を変えてきました。リンク集（ディレクトリ）、階層メニュー、検索、モバイル、そして AI が回答を組み立てる文脈型の画面。転換点ごとに利用者の探し方が変わり、設計で守るべき点も入れ替わっています。結論を先に書くと、いまの企業サイトで押さえるべきは次の3点です。トップページ起点の階層設計だけでは足りないこと、すべてのページが入口になる前提でページ単体に現在地と次の一手を持たせること、そして「隠すナビゲーション」のコストは認知が進んだ今も消えていないことです。

## 転換点1: リンク集と人手の分類（1990年代〜2000年代前半）

初期の Web では、人が分類したリンク集が入口でした。Yahoo! は1994年に「Jerry and David's Guide to the World Wide Web」として始まり、カテゴリをたどって目的のサイトへ到達する方式が主流でした。登録サイトは7階層以上に整理されていたとされます。しかし情報量の増加にクローラー型の検索が追いつき、Yahoo! は2002年10月にメインの結果をクローラーベースへ切り替え、ディレクトリ自体も2014年12月末で終了しました。

この時代の探し方は「他人が決めた分類をたどる」ことでした。裏を返せば、分類する側の語彙と利用者の語彙が一致しないと到達できません。企業サイトのグローバルナビが「会社案内／事業内容／IR」のように組織の都合で並びがちなのは、この分類発想の名残です。いまのナビゲーションに求められるのは、組織図の宣言ではなく、来訪者の目的（何を比較したいのか、何を申し込みたいのか）を言葉にした一覧です。

## 転換点2: 検索が入口になり、すべてのページが玄関になった

検索が主流になると、利用者はトップページを経由せず、目的のページへ直接着地します。Google の公式ドキュメントも、同じページに対して利用者がまったく異なる種類のクエリから到達しうることを前提に、本文中のパンくずリストのマークアップを検索結果でのページ分類に使うと説明しています。さらに、パンくずは URL 構造をそのまま反映させるのではなく、そのページに至る一般的な利用者の経路を示すことを推奨し、経路が複数あるページには複数のパンくずを指定できるとしています。

設計上の意味は明確です。階層は「ファイルの置き場所」ではなく「利用者が通る道筋」として設計する必要があります。1つのページが複数の文脈（業種別と課題別など）から参照されるなら、主たる経路を1つ決めたうえで、副次的な経路はタグや関連リンクで補います。また、どのページも単体で「ここは何のページか」「上位は何か」「次にどこへ行けるか」を説明できる状態にしておくことが、検索時代以降の最低条件になりました。なお、検索結果のパンくず表示はパソコン向けの機能として案内されている点にも注意が必要です。

## 転換点3: モバイルと「隠すナビゲーション」の代償

小さな画面への対応で、メニューを折りたたむ設計が一般化しました。その影響は実測されています。Nielsen Norman Group が179人・6サイトで行った定量調査（2016年）では、デスクトップでナビゲーションが隠れている場合の利用率は27%で、常時表示（48%）や一部表示（50%）のほぼ半分でした。モバイルでも、隠れている場合は57%、一部表示では86%と差が出ています。コンテンツの発見率は隠した場合に20%以上下がり、デスクトップではナビを使い始めるまでに5〜7秒多くかかりました。

同社は2025年に認知度の再検証も公開しています。現在は多くの利用者が3本線のアイコンを「隠れたメニュー」と認識しており、とくに画面左上にあれば解釈は安定します。ただし、認識できることと使いやすいことは別で、開く手間（相互作用コスト）は残るため、隠す必要がないなら隠さない、という指針は維持されています。

この2つを合わせると、実務上の判断はこうなります。主要導線のうち2〜4項目は常時表示し、残りを折りたたむ「一部表示型」が、調査上もっとも使われた形です。アイコンは標準的な3本線を左上に置き、必要なら「メニュー」というラベルを添えます。デスクトップで横幅に余裕があるのに折りたたむ選択は、利用率の低下を自ら招くことになります。

## 転換点4: 文脈型UI — 答えが先に出て、クリックが減る

いま進行中の転換は、検索結果そのものが回答画面になったことです。SparkToro と Similarweb のクリックストリーム分析によると、2026年1〜4月の米国の Google 検索のうち68.01%が外部サイトへのクリックなしで終了しました。ゼロクリック率は2016年45%、2019年49%、2024年60.45%と推移しており、直近2年の上昇が最も急です。AI による概要が表示された検索では外部サイトへのクリック率が約60%低下し、1,000回の検索から外部サイトに到達するのは276回まで減ったと報告されています。一方で、同期間に AI Mode へ進んだ検索は全体の0.34%にとどまります。Google は I/O 2026 で AI Mode の月間利用者が10億人を超え、クエリ量が四半期ごとに倍増していると発表しています。

ここから読み取れる実務的な含意を、事実と切り分けて整理します。現時点で流入を押し下げている主因は対話型の AI Mode そのものではなく、結果ページ内で完結する要約型の UI です。つまり「検索結果に出ているが読まれない」状態が標準になりつつあります。これは、残ったクリック1回あたりの重みが増すことを意味します。着地ページに求められるのは、サイト全体の地図を見せることではなく、その文脈で次に必要になる選択肢（料金、導入条件、事例、問い合わせ以外の比較材料）を近い位置に置くことです。

## いまのサイト設計で決めること

4つの転換点を踏まえると、着手すべき順番は次のように整理できます。

1. 入口の実態を確認する。流入上位ページに占めるトップページ以外の割合と、そこからの次ページ遷移を見ます。下層着地が多数なら、グローバルナビの改修よりページ単位の導線整備が先です。
2. ラベルを利用者の語彙に合わせる。サイト内検索のログは、利用者が実際に使う言葉がそのまま残る数少ないデータです。頻出語がメニューに存在しないなら、項目名か分類の切り方を見直します。
3. 表示と折りたたみの線引きを決める。主要項目は常時表示、残りを折りたたむ構成を基本とし、デスクトップでは原則として隠しません。
4. ページの自立性を担保する。画面上のパンくずと BreadcrumbList 構造化データの表記・順序を一致させ、URL の階層ではなく利用者の経路を反映させます。複数経路のページは主経路を決めます。
5. 検証をデバイス別に分ける。ナビの利用率、目的ページへの到達率、到達までの時間は、デスクトップとモバイルで差が出ます。平均値だけで判断すると、隠した影響が見えなくなります。

ナビゲーションの歴史は、案内の責任がサイト全体からページ単位へ移ってきた歴史です。AI が先に答える環境では、その傾向がさらに強まります。まずは自社サイトの着地ページを数本選び、そのページだけを見た人が現在地と次の行動を判断できるかを確認してみてください。

## 出典

- [ITmedia NEWS: 米Yahoo!、原点である「Directory」を年末に終了へ](https://www.itmedia.co.jp/news/articles/1409/28/news010.html)
- [Wikipedia: Yahoo Directory（英語、1994年の開始と2002年のクローラー型への移行）](https://en.wikipedia.org/wiki/Yahoo_Directory)
- [Google 検索セントラル: パンくずリスト（BreadcrumbList）の構造化データ](https://developers.google.com/search/docs/appearance/structured-data/breadcrumb)
- [Nielsen Norman Group: ハンバーガーメニューと隠れたナビゲーションは UX 指標を悪化させる](https://www.nngroup.com/articles/hamburger-menus/)
- [Nielsen Norman Group: 現在のハンバーガーメニューアイコンは認識されるか](https://www.nngroup.com/articles/hamburger-menu-icon-recognizability/)
- [ビジネス+IT: グーグル検索の68%が「ゼロクリック」で終了、AIで検索が変化](https://www.sbbit.jp/article/cont1/185839)

この記事をシェア

## 最新の記事

[セキュリティ 2026.10.30](https://chot-inc.com/columns/vercel-firewall-ai-crawlers-assistants)

### [Vercel FirewallでAIクローラーとAIアシスタントを別々に制御する](https://chot-inc.com/columns/vercel-firewall-ai-crawlers-assistants)

[開発 2026.10.30](https://chot-inc.com/columns/vercel-ip-geolocation-higher-resolution)

### [VercelのIP位置情報が高精度化──市区町村・郵便番号の取得率向上で見直すべき実装](https://chot-inc.com/columns/vercel-ip-geolocation-higher-resolution)

[開発 2026.10.29](https://chot-inc.com/columns/vercel-ci-beta)

### [Vercel CI がベータ公開 — Turborepo の設定1行でCIを動かす仕組みと、導入を判断する基準](https://chot-inc.com/columns/vercel-ci-beta)

[コラム一覧](https://chot-inc.com/columns)
