パンくずリスト
Breadcrumbs
別名: ブレッドクラム、Breadcrumb、トピックパス
生態（さわってみる）
一言定義
いま見ているページがサイト階層のどこにあるかを、上位階層へのリンク列で示すナビゲーション。
分類
使う場面
- 階層が3レベル以上あるサイト（EC・ドキュメント・メディア）
- 検索やSNSから深いページへ直接流入するユーザーが多いとき
避ける場面
- 階層が1〜2レベルしかない小規模サイト
- 現在地がフローで決まるウィザード（→ ステップバーを使う）
近縁種との比較
ステップバーが「これから進む道」を示すのに対し、パンくずは「来た道（いる場所）」を示す。 順序のあるフローにパンくずを使うと逆走リンクだらけになるので使い分ける。 戻るリンクは1階層しか戻れないが省スペース。モバイルではパンくず全段よりも 「< 親カテゴリ」形式に縮約するのが定石。
近縁種
実例リンク
アクセシビリティ
- role
- nav + aria-label="パンくずリスト"、現在ページに aria-current="page"
- キーボード操作
- 通常のリンクとして Tab 移動のみ。追加操作なし