Re: 第18回 XHTMLの設計〜状況に合った要素選び（3）〜

2007年3月10日 著

益子さんの連載記事「第18回 XHTMLの設計〜状況に合った要素選び（3）〜」で、以下の解説とソースサンプルに疑問を抱きました。

音声読み上げを考えた場合、リストを複雑に階層化しても、ユーザーに適切に伝わらない可能性が高い。テキストによる補足情報を随所に含めておき、ビジュアルブラウザでは不可視化されるようにCSSで設定するとよいだろう。

<div id="category-list">
  <h2>カテゴリーリスト</h2>
  <ul>
    <li>
      <span>（カテゴリー1 ここから）</span>
      <a href="...">カテゴリー1</a>
      <span>（カテゴリー1のサブカテゴリー ここから）</span>
      <ul>
        <li><a href="...">サブカテゴリー1-1</a></li>
        <li><a href="...">サブカテゴリー1-2</a></li>
        <li><a href="...">サブカテゴリー1-3</a></li>
      </ul>
      <span>（カテゴリー1のサブカテゴリー ここまで）</span>
      <span>（カテゴリー1 ここまで）</span>
    </li>
    <li>
      <span>（カテゴリー2 ここから）</span>
      <a href="...">カテゴリー2</a>
      <span>（カテゴリー2のサブカテゴリー ここから）</span>
      <ul>
        <li><a href="...">サブカテゴリー2-1</a></li>
        <li><a href="...">サブカテゴリー2-2</a></li>
        <li><a href="...">サブカテゴリー2-3</a></li>
      </ul>
      <span>（カテゴリー2のサブカテゴリー ここまで）</span>
      <span>（カテゴリー2 ここまで）</span>
    </li>
    <li>
      <span>（カテゴリー3 ここから）</span>
      <a href="...">カテゴリー3</a>
      <span>（カテゴリー3のサブカテゴリー ここから）</span>
      <ul>
        <li><a href="...">サブカテゴリー3-1</a></li>
        <li><a href="...">サブカテゴリー3-2</a></li>
        <li><a href="...">サブカテゴリー3-3</a></li>
      </ul>
      <span>（カテゴリー3のサブカテゴリー ここまで）</span>
      <span>（カテゴリー3 ここまで）</span>
    </li>
  </ul>
</div>

その疑問とは、例示されているテキストによる補足情報が音声読み上げの利用者にとって本当に役立つものなのか？という点です。具体的には、「○○ここから」「○○ここまで」といったメタ情報をマークアップし音声読み上げ環境の利用者に聞かせることは、かえって情報伝達の効率を下げることにならないのか？ということ。単にそれを耳障りに感じる利用者もいるだろうといったことではなく、特定の利用者や環境に対し歩み寄れば、それ以外では当然逆のことが起こりうる（場合によっては不便を強いることになる）、と思うのですが。
自分ならそのようなメタ情報はマークアップしません（マークアップすべき対象は、すべての利用者あるいはユーザーエージェントに対して伝えたい情報であるべき、と考えているので）。あるいは、もし入れ子の階層が深く項目数も膨大になりそうであれば、見出し（上の例であれば「カテゴリー1」とか「カテゴリー2」）と簡単なリストのペアに適宜分割するよう構造を見直し、もともとの情報構造にあった入れ子の関係性は別途本文中で補うようにすると思います。そのほうが、見出しジャンプのような機能を備える音声読み上げ環境や、見出し要素を抽出して目次を生成するような環境では特に、情報が伝わりやすいだろうと思うからです。