セクショニングって？

 

HTML5からsectionタグが追加されましたね！

それに伴い、セクショニング  という言葉をよく見かけます。

セクショニング  について書きまーす。

 

参考：こことこことここ

 

 

セクショニング

文書構造を明確にする考え方のこと。

＜要素＞

セクショニング・コンテンツ、ヘッディング・コンテンツ

これらの要素を用いてセクショニングすることで、文書は正しいアウトラインを得ることができる。

 

 

セクショニングの歴史

HTML5以前

・divタグとhタグを使って、セクショニングしていた。

・どんな内容でもdivで1つのセクションとしており、

内容を見ないと違いがわからない。

・ロゴなどのサイト全体に関連する情報のセクションを示す方法がない。

・暗黙的にセクショニングした時、どこからどこまでが１つのセクションなのか明確にわからない場合があった。

・文書全体で、hタグのレベルをルール付けする必要があった。

 

これらの問題から、、、

HTML5

・divタグは基本的に使わず、sectionなどのセクショニング・コンテンツ要素を用いる

・section, article, aside, navタグの誕生

・nav, header, footerタグの誕生

・正確なセクション指定と見出しの指定ができるようになり、

文章構造のアウトラインを明確に示すことができる。

・文書全体だけでなく、セクションでのhタグのレベルをルール付けする必要がある。

(同じ階級のhタグをページ内に複数指定することができるようになった。)

 

 

 

 

まとめ

HTML5の目的は、

一つのセクション内に複数の見出しを入れるのではなく、

見出しごとにセクションを明示的に包含させていくことで

文章構造を明確にするためなんだなと理解。