section要素の使い方が未だに理解できません。
過去の質問など検索して調べたりして
>>マークアップ上正しい位置に配置したsectionなどにスタイルを適用するのは有りですが、たんにレイアウト目的のdivをsectionに置き換えるのは無し
という回答例を見たのですが
http://www.mdn.co.jp/di/articles/2605/?page=5
このページの2カラムレイアウトの例のところに
>>上記はコンテンツエリアと、サイドバーエリアにfloatのleftとrightをそれぞれにかけて2カラムレイアウトをした例です。中に何をいれるかなどを考えずに、section要素でそれぞれのエリアを囲みfloatをかけしてしまった悪い例です。
これはマークアップ上正しい位置に配置していないため
(2カラムレイアウトをすることによって
コンテンツエリア > サイドバーエリア、サイドバーエリア > コンテンツエリア
どちらでマークアップされているかわからない)
という事なのでしょうか?
みんなの回答 4 件
HTML5におけるセクションの概念は、簡単に言うと「見出しとそれに属するコンテンツのまとまり」をセクションと言っている
h1~h6要素を作ると、その見出しに対応するセクションが自動的にできる(暗黙のセクション)
このときsection要素(やarticle要素などのセクショニングコンテンツ)を使うことでセクションの範囲を明示できる
というのがsection要素の役割です
なので、section要素の中身としては対応する見出しとコンテンツが入っていないとだめ
そのサイトでは小さく「内容を考えずにdiv要素をsection要素に置き換えはいけません」と書いてあるが、おそらく内容がセクションとして不適切(見出しがないとか)場合を考えていると思われる
逆に言えば、2カラムレイアウトにsectionを使うのは、section要素の中身が正しければ(ちゃんと見出しと対応するコンテンツという形になっていれば)OK
hタグ使う時は必ずsectionタグでくくる。
決まりだから理屈ぬきで覚えればいい。
記事読んでみました。
解釈が違っていたら申し訳ないけども、floatをさせるためだけ(レイアウト目的)にコンテンツエリアとサイドバーをただsectionにするのは良くないけども、内容としてsectionやarticleを使うのが正しければ使って良い(その上で、floatさせるのであれば問題ない)と言っているように見えました。
特に制約がなければ、コンテンツ部分はsection、広告が入っている部分はasideといった具合にするのがわかりやすくていいかもですね。
間違ってたらごめんなさい。
html5は要素が細かく出来るようになってるだけで、別に使う必要は無い。
というか、わからないなら使わない方が良い。
関連するトピックス