最近HTML5の話題があつくなってきていますねー。Google Insightsで「html5」の検索ボリュームを調べてみても、日本での盛り上がりが他国にまさっているのが伺えます。（Google Insights　for Search – ウェブ検索の人気度: html5」）

直近で言えば「CSS Nite in Ginza, Vol.40」や、「CSS Nite 4周年記念イベント（Vol.40 reprise）」が開催されます。前者は無料、後者は前者の拡大版ですが2,000円ととても安価なので興味がある方はご参加されてはと思いましたが、すでにCSS Nite in Ginza, Vol.40で当日席が空いているだけでした。これは！と思う方は早めに会場に向かって席を確保しましょう。

さてそんなHTML5なのですが、「HTML5 Gallery」などのギャラリーサイトを見ていると、nav要素に見出しがないものが多いんですよねー。仕様でnav要素には見出しを設けなくてはならないと決められているものでもありませんので、これが悪いと言うわけではないのですが、ちょっと気になります。

まず「sectionの使い方とセクション三箇条 – vantguarde – web:g」では「The section element | HTML5 Doctor」の邦訳としてセクション三箇条に関して以下のような説明があります。

• スタイルシートやスクリプトの都合には使わないこと。それらにはdivを使うこと。
• article, aside, navが適切な場合には、そちらを使こと。
• セクションの先頭に見出しが自然に存在してない場合には使わないこと。

さらにこの記事では、

sectionだけがセクションじゃない

なんのこっちゃって話ですが、section以外にもセクションを構成する要素は存在します。article, aside, navです。

ともあります。つまりは、sectionだけでなくてnavもセクションであり、「セクションの先頭に見出しが自然に存在してない場合には使わないこと。」という箇条を考えれば自然とnavの中には見出しが入ってくるでしょう、ということになります。

続けてWCAG2.0の側面から見てみましょう。以下の2項目が関係あると思われます。

ガイドライン 2.4 ナビゲーション可能： ユーザがナビゲートしたり、コンテンツを探し出したり、現在位置を確認するのを手助けする手段を提供する。

2.4.1 ブロック・スキップ： 複数のウェブページ上で繰り返されているコンテンツのブロックを通過できるメカニズムが利用可能である。（レベル A）

2.4.10 セクション見出し：セクションの見出しを用いてコンテンツを体系化している。（レベル AAA）

まず「2.4.1 ブロック・スキップ」ですが、具体的には複数のページで繰り返し出現するヘッダーなどのブロックはあっさりと通過して、ページの主題など、ユーザーが目的とする箇所へすぐにアクセスできるようにしようね、ということを言っています。これをページで実装しようとすると、スキップリンク（参考：http://tinyurl.com/yfj6294）のようにページ内リンクを設けるか、各ブロックに見出しを用意して見出しジャンプ機能（参考：http://tinyurl.com/ygfyx7g）を使えるようにするということが考えられます。

さて、話を「nav内に見出しがない」に戻しますと、Webを閲覧する中で、すばやくnavにアクセスしたいという需要もあるでしょうから、navの中に見出しがないというのはちょっと気になります。スキップリンクを設置しておけば良いじゃないかという意見もあるでしょうが、もしかしたらスキップリンクをサポートしていないが見出しジャンプ機能はサポートしているというユーザーエージェント（以下UA）もあるかもしれませんので、やはり見出しを容易しておくのがベターと言えます。しかも「2.4.1 ブロック・スキップ」に関しましては、レベルがシングルAとなっていますので、是が非でも対応しておきたいものでしょう。

次に「2.4.10 セクション見出し」を考えてみましょう。こちらはセクションには見出しをおきましょう、ということになりますので先のセクション三箇条の最後のものと同じことを、アクセシビリティの視点から言っているものと考えられます。レベルがトリプルAではありますが、セクション内に見出しをおくというのがそれほど難しいものとも思えませんので、しっかりと対応した方が良いでしょう。

まとめ

事件は現場でおこります。この先、HTML5をあたりまえのように利用するとなったときに、nav内に見出しがあるものとないものが混在しているとなると、現場が混乱することが容易に想像されます。最低でも現場で一定のルールを共有することが必要となるでしょう。極端に、nav内にはまったく見出しを設けないというルールがあったとするといかがでしょうか？アクセシビリティを担保してこそのマークアップエンジニアとしては、だいぶ疑問が残るものとなるでしょう。

どんな状況でも100%見出しを設けるべきということもありませんが、より多くのユーザーのためにより良いWebをと考えれば、おのずと答えが出てくるように思います。

その他備考

一時期流行した文字サイズ拡大ボタン。これはブラウザなど、UA側が実装すべきものであり、わざわざページ内に設置する必要はないという意見が目立ちます。同じようにnavに関してもUAがnavを認識して、ユーザーになんらかの形で提供すれば良いのではないか？という意見もあります。