html5でコーディングしているのですが、グローバルナビにul、liを使用する必要ありますか?<nav>タグがあるので、必要ないと思っています。どうでしょうか?
それは対象ブラウザによるでしょ。HTML5非対応のブラウザは全て動作保証外ってことならそれでいいんじゃない?(そういうケースはめったに無いと思うけど)
navタグはナビのセクションであることを示すタグだから、navでulとliを囲むのがいいんじゃないかな
ありがとうございます。すいません聞き方が悪かったですね。HTML5非対応のブラウザでも、polyfill で対応していくのですが、その場合に<nav>タグがあるのに、文書構造的にul、liに意味があるのかと聞きたかったのです。
箇条書き要素は文法違反ですので、テーブル要素を使いましょう。
じゃあ何でメニュー組むんだよ。<nav> だけじゃどうしようもないぞ。
単純に便利だというだけなら、<div>でも全然出来ます。ただul、liを使用しないと文書構造的に間違ってるのなら使わないといけないです、間違ってるんですかね?
div と ul li のタグの元々の意味考えたらわかると思う。
勿論そこら辺は分かった上で聞いているのですが、意味ないというのは間違っていましたね。レスポンシブウエブデザインで、特にフレキシブルGridsystem使用したサイトを見てるとグローバルナビにul、liを使用してないものも結構あるので、文書構造的にどうなんだろうと疑問に思っているのです。
意味ないと思うなら使わないでいいんじゃない?笑
対象の要素がナビゲーションであることと、リストであることは何の関係もない。ナビゲーションだったらnavにすればいいし、リストだったらulないしolにすればいい。
ありがとうございます。グローバルナビゲーションって項目が複数あって、リストと言えなくもないので、そういう意味でulを使っていると思うのですが、実際、ここに回答していただいた方は読む限りそういう意味に取れるのですが、リストではないということですね。
うーん、トピ主さんがどこにこだわってるのか分かりづらい
あ、ごめんなさい汗。
画面の上部に横一列に6個くらいボタンのあるグローバルナビで①意見1ナビゲーションはリストではない。文書構造的に<nav>で囲めば、それがナビゲーションだということがわかるので、その中の要素は<div>等でもよい。
②意見2ナビゲーションはリスト。<nav>で囲んだとしてもul、liを使用すべきだ。
多くのサイトでは実装をみると②なので、正しいのは②かと思うのですが、どっちなんだろうと悩んでいるのです。
同意。一周まわって、逆に理解が浅いのではないかという気がしてきた。
ナビゲーションっていうセクションのリスト
自分はそこで悩んだことはないなあ。navの中身がリストってよりも、色んなリストがある中で「次のリストはナビゲーションなんでnavで囲んで示しておきますね」って感じかな。
なるほどですね。ありがとうございます。
ナビゲーションがリストじゃないケースを考えてみたらいいんじゃないですかねもしリストじゃないケースがあるなら、それはリストじゃないのでリストのタグを使うべきではないよね
リストじゃないならいいと思いますけど、リストならば、<ul><li>で囲んだほうがいいですね。もちろんdivなどでもいいと思うのですが…管理しやすい点もありますね、
ナビゲーションがリストじゃないケースというと、メニューが1つしかない場合でしょうか。そういうお店とかもありますよね。
リストって言葉の定義を誰に求めよう。。、
項目が複数ある場合、たいていスタイリングしやすいからじゃない?慣習的なものもあるだろうけど、タグの定義を考えて書く人がどれだけいるやら…。
リスとテトリスとリスト
回文を期待したのに。
navは、中身がナビゲーションであると示すだけで、そのナビゲーションの書き方までは規定していません。メニューをリストで作りたいならulなどを使えばいいし、リスト以外で作りたいならulを使わなくても構いません。
ナビゲーションの内容が並列できるコンテンツならulじゃないかな大カテ小カテがあるようなナビならdl使うし
どうしたってメニューって箇条書きでしょう。別に何で表現したって構わないが、<ul> を使うのが一番自然だというだけなのに、一体何を嫌がっているのかさっぱり解からん。CSS外して<div>で組んだ奴と比べてみ?
そう、CSSを外した状態で見てみればよくわかりますよね。意味が。
僕はulないとデザイン実現できない場合はulでマークアップするけど、ulなくても実現できる場合は、aのみにします。
<nav> <a href="#">メニュー</a> <a href="#">メニュー</a> <a href="#">メニュー</a> <a href="#">メニュー</a> </nav>
CSSで実現できるかどうかじゃなくて、文章構造的に正しいかどうかじゃないの?
うわぁ。。。
これは推奨されないね。構造的に全体でひとつの(意味不明の)文章として見られる。
これは良くないでしょ。デザイン以前の問題として、文書構造を定義するのがHTMLの目的だと思う。
文章構造的に問題あるかな?
わかりやすいマークアップだと思うんだけど。
> CSSで実現できるかどうかじゃなくて、文章構造的に正しいかどうかじゃないの?
ulなくても文章構造的に正しいと思うので、ul書かなくて済むなら直にaタグを書くという考えです。
文章構造的に問題ありあり。内容はlooInl2nGGejさんが言及してる通り。
文章じゃなくて文書構造だったorz
テーブルで作れば、問題なし。
なんでこんなに評価されているんだ?↑よりもアウトだろ。
HTMLをなんだと思ってるんだろう?素人でもこんなこと言わないよ。プロならなおさら。それ使って飯食ってるなら、せめて正しい仕様を意識する努力をするのは義務だと思う。
皮肉に対する評価でしょ?
どうせhtml5だから、tableタグをレイアウト目的で使用することを明示すればいいと思ってるんだろうけど。。。nav,ulタグっていう文書構造に即したタグがあるわけだし、わざわざtableタグなんて使う必要ないじゃん。
CSS全部オフにした状態でどう見えるか考えればわかることだと思うけど、複数項目のナビゲーションでリスト構造じゃないなんて読みづらくね?
html5の場合は、CSSオフ時の見え方はあまり関係なくて、アウトラインでしょ。
CSSオフにすればアウトラインがある程度可視化できるよってことでしょうね
xhtmlと違って、hタグを宣言しなくても、sectionタグなどでアウトラインが一段下がるわけだから、cssオフにしたところで、それは可視化できないような。。。それはある程度なのか?
アウトラインもCSSオフ時の見え方もどっちも意識すべきなんじゃないかな
ある程度の話でしょ。それにhタグは今は関係なくて、ナビゲーションをリストにした方がいいかどうかでしょ?CSSオフったときの見え方云々は合ってると思うけど。
>それにhタグは今は関係なくて、ナビゲーションをリストにした方がいいかどうかでしょ?
ulかnavかでアウトラインが違うんだよ。CSSオフでそれを確認できないからそういう発想になるんだろ?
IE6だと正しく表示されませんが、
<?doctype html> <html> <head> <title>少しだけ嬉しくなるnav要素の書き方</title> </head> <body> <nav id="Nav"> <rails> <twitter href="http://w3q.jp" /> </rails> <php> <facebook src="/images/fb.png" /> </php> </nav> </body> </html>
もともと<div id="navi"><ul><li></li></ul></div>だったのを、html5で「ここはナビですよ」ってことを、さらにわかりやすくするために、<nav>ってタグが追加されたように認識しているんですが。。てことは、<nav>が出来たから、そのかわりに<ul>タグを失くすってのは、本末転倒というか少しおかしなな感じがするのですが。間違っていたらすみません。
その通りだと思います
私もそういう認識で書いてますね。視覚的なものでもないですし。
言えてる
みんなの回答 27 件
それは対象ブラウザによるでしょ。
HTML5非対応のブラウザは全て動作保証外ってことならそれでいいんじゃない?
(そういうケースはめったに無いと思うけど)
navタグはナビのセクションであることを示すタグだから、navでulとliを囲むのがいいんじゃないかな
ありがとうございます。すいません聞き方が悪かったですね。HTML5非対応のブラウザでも、polyfill で対応していくのですが、その場合に<nav>タグがあるのに、文書構造的にul、liに意味があるのかと聞きたかったのです。
じゃあ何でメニュー組むんだよ。<nav> だけじゃどうしようもないぞ。
単純に便利だというだけなら、<div>でも全然出来ます。ただul、liを使用しないと文書構造的に間違ってるのなら使わないといけないです、間違ってるんですかね?
div と ul li のタグの元々の意味考えたらわかると思う。
意味ないと思うなら使わないでいいんじゃない?笑
対象の要素がナビゲーションであることと、リストであることは何の関係もない。
ナビゲーションだったらnavにすればいいし、リストだったらulないしolにすればいい。
うーん、トピ主さんがどこにこだわってるのか分かりづらい
ナビゲーションっていうセクションのリスト
自分はそこで悩んだことはないなあ。
navの中身がリストってよりも、色んなリストがある中で「次のリストはナビゲーションなんでnavで囲んで示しておきますね」って感じかな。
なるほどですね。ありがとうございます。
ナビゲーションがリストじゃないケースを考えてみたら
いいんじゃないですかね
もしリストじゃないケースがあるなら、
それはリストじゃないのでリストのタグを使うべきではないよね
リストじゃないならいいと思いますけど、リストならば、<ul><li>で囲んだほうがいいですね。
もちろんdivなどでもいいと思うのですが…管理しやすい点もありますね、
ナビゲーションがリストじゃないケースというと、メニューが1つしかない場合でしょうか。
そういうお店とかもありますよね。
リストって言葉の定義を誰に求めよう。。、
項目が複数ある場合、たいていスタイリングしやすいからじゃない?慣習的なものもあるだろうけど、タグの定義を考えて書く人がどれだけいるやら…。
リスとテトリスとリスト
navは、中身がナビゲーションであると示すだけで、そのナビゲーションの書き方までは規定していません。
メニューをリストで作りたいならulなどを使えばいいし、リスト以外で作りたいならulを使わなくても構いません。
ナビゲーションの内容が並列できるコンテンツならulじゃないかな
大カテ小カテがあるようなナビならdl使うし
どうしたってメニューって箇条書きでしょう。別に何で表現したって構わないが、<ul> を使うのが一番自然だというだけなのに、一体何を嫌がっているのかさっぱり解からん。CSS外して<div>で組んだ奴と比べてみ?
僕はulないとデザイン実現できない場合はulでマークアップするけど、
ulなくても実現できる場合は、aのみにします。
<nav>
<a href="#">メニュー</a>
<a href="#">メニュー</a>
<a href="#">メニュー</a>
<a href="#">メニュー</a>
</nav>
テーブルで作れば、問題なし。
CSS全部オフにした状態でどう見えるか考えればわかることだと思うけど、複数項目のナビゲーションでリスト構造じゃないなんて読みづらくね?
html5の場合は、CSSオフ時の見え方はあまり関係なくて、アウトラインでしょ。
IE6だと正しく表示されませんが、
<?doctype html>
<html>
<head>
<title>少しだけ嬉しくなるnav要素の書き方</title>
</head>
<body>
<nav id="Nav">
<rails>
<twitter href="http://w3q.jp" />
</rails>
<php>
<facebook src="/images/fb.png" />
</php>
</nav>
</body>
</html>
もともと<div id="navi"><ul><li></li></ul></div>だったのを、html5で「ここはナビですよ」ってことを、さらにわかりやすくするために、<nav>ってタグが追加されたように認識しているんですが。。てことは、<nav>が出来たから、そのかわりに<ul>タグを失くすってのは、本末転倒というか少しおかしなな感じがするのですが。間違っていたらすみません。
関連するトピックス