JIS X8341-3 5.2g パンくずリストのアクセシビリティ

• グランプリ＆最優秀コーポレートサイト＆内閣総理大臣賞「みずほ証券」
  1. 矢印は「半角スペース>半角スペース」
  2. IDは「topicPathBlock」
  3. div要素#topicPathBlockのなかにp要素で作成しています。
  4. 現在位置部分はパンくず上になく、すぐh1要素で見出しタイトルが出現。
• 最優秀プロモーションサイト「Johnson'sブランドサイト」
  1. 矢印は「 >> 」
  2. IDは「Pankz」
  3. div要素#Pankzのなかにspan要素で作成しています。
  4. 現在位置部分は特に何もせず。
• 最優秀コマースサイト「無印良品 ネットストア」
  1. 矢印は「 > 」
  2. IDは「storeContentHeader」
  3. div要素#storeContentHeaderのなかにp要素で作成しています。
  4. 現在位置部分は特に何もせず。
• 最優秀公共サイト＆国土交通大臣賞「兵庫県ホームページ」
  1. 矢印は「全角＞」
  2. IDは「pankuzu」
  3. p要素#pankuzuのなかに作成しています。
  4. 現在位置部分は特に何もせず。
• 最優秀Flash賞「NTTデータ公式ホームページ」
  1. 矢印は「半角スペース>半角スペース」
  2. IDは「topicPath」
  3. div要素#topicPathのなかにp要素で作成しています。
  4. 現在位置部分はem。
• チャンレンジド賞「横浜市立盲学校Webサイト」
  1. 矢印は「全角＞」
  2. IDは「topicpass」
  3. p要素#topicpassのなかに作成しています。
  4. 現在位置部分は特に何もしていませんが、「（現在の位置）」と表記。
• 審査員特別賞「中部大学webサイト」
  1. 矢印は「全角＞」
  2. IDは「breadcrumb」
  3. div要素#breadcrumbのなかに作成しています。
  4. 現在位置部分は特に何もせず。
• 総務大臣賞「島根県ホームページ」
  1. 矢印は「 >」
  2. IDは「topic_path」
  3. div要素#topic_pathのなかに作成しています。
  4. 現在位置部分は特に何もせず。
• 経済産業大臣賞「COLORs catalog|カラログ」
  1. 矢印は「全角の≫をstrong要素で囲む」
  2. IDは「pagenavi」
  3. div要素#pagenaviのなかにulリストで作成しています。
  4. 現在位置部分は特に何もせず。
• 厚生労働大臣賞「富士通」
  1. 矢印は「 >」
  2. IDは「location」
  3. div要素#locationのなかにolリストで作成しています。
  4. 現在位置部分は特に何もせず。
• 環境大臣賞「ファミリーマートホームページ」
  1. 矢印は「全角≫」
  2. IDは「topicPath2」
  3. div要素#topicPath2のなかにp要素で作成しています。
  4. 現在位置部分は特に何もせず。
• 外務大臣賞「浜松市公式Webサイト」
  1. 矢印は「半角スペース>半角スペース」
  2. IDは「bList」
  3. div要素#bListのなかに作成しています。
  4. 現在位置部分は特に何もせず。

これらを見てみて、多数決ではなく個人的ベストチョイスをしてみると

1. 矢印は「 >」
2. IDは「location」の富士通式
3. div要素#locationのなかにp要素で作成でしょうか。リストは避けたいかも。
4. 現在位置部分は特に何もしないか、NTTデータのようにemで強調させるか。

元同僚せきぐちくんのLike@lunatic「パンくずリストのマークアップ考察」には、
矢印を画像にしてalt属性に「の中の」と入れる、インフォアクシア・植木さん方式もありますし、
CSS HappyLifeさんの「もう、class名やid名で悩まないんだからっ！！」には、
パンくずっぽいののID名が列記されていました。

正解はないのでしょうが、パンくずくらい（といったらパンくずに失礼？）ある程度の
マークアップの方法が示されてもいいのかなぁ･･･と思いました。