navタグとは?|Webサイトのナビゲーションとなる部分を表そう

navタグとは?|Webサイトのナビゲーションとなる部分を表そう
リンゴ
博士、たまにリンクの集まりを<nav>〜</nav>で囲んでるのを見るんですが、これは一体どんなタグなんですか?
博士
リンゴくん、これはWebサイトのナビゲーションとなる部分を表しているタグなんじゃ。
 
 
リンゴ
リンゴ
ブログを書くことが大好きな少年。
世界にたった一つのWordPressテーマを作るため、HTML/CSSについて日々勉強中!
博士
博士
リンゴが師と仰ぐ人物。
毎日HTML/CSSデザインの研究をしており、その知識を余すことなくリンゴに教えてくれる。

スポンサーリンク

<nav>タグとは

 

<nav>

対応ブラウザInternet Explorer / Firefox / Google Chrome / Safari / Opera
分類フロー・コンテンツ / セクショニング・コンテンツ / パルパブル・コンテンツ
利用場所フロー・コンテンツが期待される場所
内容フロー・コンテンツ


 
 
<nav>タグは、ナビゲーションを表す際に使用するタグです。
そのサイト、またはページ内の移動で必要となる、主要なリンクメニューのセクションで使用します。

例えば、一般的にサイトの上部、左右に表示されるナビゲーションはnav要素で表す内容として適しています。

また、よくWebサイトの下部に、利用規約や著作権ページなどのリンクが配置されることがありますが、このような場合にはnav要素を使わず、footer要素の中に入れるようにしましょう。
 
 

博士
リンクの全てにnav要素を使えるわけじゃないんじゃ。
 
 

使用例

 
 

表示例

 
 

まとめ

<nav>タグは、Webサイトのナビゲーションとなる部分を表す際に使用するタグです。
 
 

リンゴ
そのサイトの主要なリンクメニューのセクションで使おう!
 
 
HTML5 タグ図鑑

HTML5タグ全種類を図鑑としてまとめています。タグの意味や使い方でわからないことがあれば、ぜひこのページをご活用ください。

HTML5 タグ図鑑へ

 
HTML5 タグ図鑑

スポンサーリンク








navタグとは?|Webサイトのナビゲーションとなる部分を表そう