navタグ内で見出しを省略するとアウトライン上では「ナビゲーション」と解釈される

概要

「nav」タグと「aside」タグの見出しは省略すると
それぞれ「ナビゲーション」「サイドバー」と見出しがついていると解釈される、事が多い。
ユーザーエージェントによって異なるので絶対ではない。

「nav」タグと「aside」タグはセクショニング要素

「article」「section」「nav」「aside」はセクショニング要素である。
(「body」はセクショニング・ルート)

セクショニング要素には見出しタグ(「h1」~「h6」)が必要。

セクショニング・コンテンツとなる要素は明示的にアウトラインを生成します。各セクショニングコンテンツは通常、見出しを伴って使用されます。

セクショニング・コンテンツに分類される要素一覧 | HTML5 タグリファレンス | W3 Watch Reference
https://reference.hyper-text.org/html5/categories/sectioning-content/

一部のセクショニング要素はデフォルト見出しがある

「nav」「aside」の見出しは省略しても良い。

省略した場合はユーザーエージェントにより解釈が任される。

These default headings (“Untitled document”, “Navigation”, “Sidebar”) are not specified by this specification, and might vary with the user’s language, the page’s language, the user’s preferences, the user agent implementer’s preferences, etc.

HTML Living Standard – whatwg
https://html.spec.whatwg.org/multipage/sections.html#outline-depth

デフォルト見出し表

タグデフォルト見出し
body無題のドキュメント
navナビゲーション
asideサイドバー
hxタグを指定しない場合はデフォルト見出しで解釈される

省略した場合

<!-- 以下の2つは等価 -->
<nav>
  <ul>
    <li>アイテム1</li>
    <li>アイテム1</li>
    <li>アイテム1</li>
  </ul>
</nav>


<nav>
  <h1>ナビゲーション</h1><!-- デフォルト見出しが補完されるイメージ -->
  <ul>
    <li>アイテム1</li>
    <li>アイテム1</li>
    <li>アイテム1</li>
  </ul>
</nav>

実際に補完されるわけじゃないけど、ブラウザもクローラーもそう解釈するというなら同じ事…だと思う。

備考

  • 見出しタグ(h1~h6)を「hx」タグって表現するのが最近の流行りっぽい。
  • 「sectioning elements」が「区分化要素」って翻訳されている。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です