2011-08-09 14 views
4

私は自分のページにhtmlタグを使い始めましたが、NAVタグの正しい使い方を判断しようとしています。私はドキュメントを読んだところ、私が持っているもので大丈夫だと思われますが、他のほとんどの開発者が "ul" "li"タグ内にナビゲーションブロックを持っていることに気付きました。 divを使用しています。html5 NAV TAG適切な使用方法

私の質問は、divよりもむしろ "ul" "li"タグを使うことの長所と短所は何ですか?

そして、navで次のことはできますか?

<nav> 
    <div id="navBar"> 
     <div id="navItem1"><a></a></div> 
     <div id="navItem2"><a></a></div> 
     <div id="navItem3"><a></a></div> 
     <div id="navItem4"><a></a></div> 
    </div> 
</nav> 

答えて

7

投稿したコードはベストプラクティスではありません。それは次のようになります。


<nav> 
    <ul> 
     <li><a></a></li> 
     <li><a></a></li> 
     <li><a></a></li> 
     <li><a></a></li> 
    </ul> 
</nav> 

<ul><li>タグdivタグを使用するよりも優れている、とほとんど常にメニューに使用されています。 ulliを使用すると、WAYのIDが多すぎるとコードが詰まることはありません。

+1

ご協力いただきありがとうございます。非常に私は私のdivsをul/liに変換します。私はnavタグのためのie7サポートについて心配します。 – SFox

+1

次に、このようなshivを使用したいと思います: '<! - [if IE 9]> ' –

+0

皆さん、ありがとうございました。 =) – SFox

1

カスタムでは、ナビゲーションバーはリンクのリストと見なされ、したがってul-liとみなされます。実際の違いは、ULは(altoughtたぶん私はanidationレベルに

+1

-1。実際の違いは、画面リーダーを使用するユーザーはリストを使用してページをナビゲートし、自動化されたツールは構造を構築するために使用し、検索エンジンはページのインデックス付けなど様々な理由でこれらを使用する可能性があります。 –

3

リストを減らすために、NAV#ナビゲーションバーと直接のdiv#のナビゲーションバーを交換したい、あなたは何をしているかだけで一般的に行わ

は結構です、ありません、ol)はアクセス可能なブラウザ(スクリーンリーダーなど)で追加の意味を持つことができますが、divはそうではありません。これにより、これらのユーザーがサイトを簡単に使用できるようになり、メニューの理由リストの1つが優先されます。

また、リストタグはコンテンツにコンテキスト(メニューはリンクのリスト)を与えますが、divにはコンテキストがありません。