html5における、divとarticleとsectionの使い分け

いまさらながら、この3つ、正直区別がハッキリわかっていないので調べてメモメモ。ざっとまとめてみると・・・

div要素

特別な意味のないまとまり(コンテンツ)を囲む要素。多用はさけるべき。

section要素

意味のあるまとまり(コンテンツ)を囲む要素。
sectionごとでテーマが定義されるべき。なので、直後に見出しタグがくる。
セクション=章、節、項といった意味。見出しとその内容というように階層構造になる。

article要素

意味のあるまとまり(コンテンツ)を囲む要素。sectionよりさらに特定的な意味をもち、独立しても成り立つ。ニュースサイトの記事、ブログやお知らせの投稿などを入れる。

kokeko14
うーん、わかったようなわからないような。。。

つまり・・・
意味のあるまとまり ⇒ section、または、articleを使う。
意味のないまとまり ⇒CSSでスタイルを定義するために、divを使う。

divはいいとして、sectionとarticleの使い分けがイマイチはっきりしない感じ。

もう悩まない!HTML5の「section要素」と「article要素」の違いについて
が一番わかりやすくまとまってました!

「RSSフィードで読み込んで、一つの記事として成り立つかどうか。」がポイントだそう。
⇒ Yes ⇒ article
⇒ No ⇒ section