- ベストアンサー
HTML5で乗り物カテゴリーをマークアップする方法について
- HTML5のマークアップには、<section>や<div>、<h2>、<h3>などの要素を活用することができます。
- 質問の文章では、乗り物のカテゴリーをマークアップするために<section>と<h2>を使用しています。
- パターンBのマークアップはパターンAよりも正しいと言えます。div要素を使用することで、<h3>をインデントすることができます。
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
いずれも根本的に間違っています。sectionやdiv sectionは、それが目次の項目としてリストアップされるような文書集合に使用し、通常は見出し[ひとつだけ]を伴います。 ★4.4.2 The section element ( http://www.w3.org/TR/html5/the-section-element.html#the-section-element ) <section>の中に複数の見出しは入りません。入れるときは<hgroup>を使用します。 また、class名は独自のものを使わないように・・ <body> <header> <h1>見出し</h2> </header> <section> <h2>・・・</h2> <section id="transportationList"> <h3>乗り物</h3> <section id="bicycle"> <h4>自転車<h4> <p>・・・</p> </section> <section id="automobile"> <h4>自動車</h4> </section> <section id="train"> <h4>電車</h4> </section> </section> </section> <foooter> </footer> ★HTML5では、見出しレベルはHに付く数字ではなく、sectionの階層レベルになります。 4.4.6 The h1, h2, h3, h4, h5, and h6 elements ( http://www.w3.org/TR/html5/the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements ) 上記のように、階層にしたがってh1→h6を使用するか、すべてh1を使うことが推奨されています。すべてh1を使うほうがメンテナンスは楽になります。 >(divは、H3をインデントするために使用) は禁止です。 【引用】____________ここから 注。 CSSではclass属性が非常に大きな力を持っている。 したがって文書作成者は、体裁に殆ど何の関係も無い要素(HTMLだとDIV要素やSPAN要素など)をベースにして、それらにclass属性でスタイル情報を与えれば、独自の構造化言語を設計できると考えられる。 しかし、文書の構造要素は広く受け入れられている一般的意味を持つ場合が多いので、こういった使用法は避けるべきである。 文書作成者が定めたクラス名では、意味を理解してもらえない場合もある。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[セレクタ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/selector.html#class-html )]より ★HTML5は現状では使わないほうが良いです。未勧告ですからまだまだ変更があります。使う場合はHTML5を理解できない古いIEのためにjavascriptなどでの対応が必要です。 HTML4を使って、 <body> <div class="header"> <h1>見出し</h2> </div> <div class="section"> <h2>・・・</h2> <div class="section" id="transportationList"> <h3>乗り物</h3> のようにしておくほうが良いでしょう。<doctypeを変更すれば・・・そのままHTML5でもあるし。