Webコンテンツの区画の整理

WebページのコンテンツはHTMLのbody要素内にhタグやpタグをそのまま利用して記述することができる．しかし，コンテンツが複雑になり，要素の数が増えるとCSSやJSの実装が難しくなる場合がある．このような場合は，Webページの区画整理を行うことによって，文書構造をわかりやすくできる．

モダンなWebサイトの基本構造

モダンなWebサイトの基本構造として以下の３つのエリアで構成されることが多く，HTMLで記述する際も同様に分ける必要がある．

ヘッダーエリア
メインコンテンツエリア
フッターエリア

区画整理に利用されるタグ

HTML5(HTMLの改訂第5番)から登場した新しいタグを利用することによってコンテンツ内の整理がしやすくなった．コンテンツの整理に使用するため，全てbody要素内で使われる．

１．header
Webサイトにおけるヘッダーエリアを明示するタグ．
２．nav
NavはWebサイト内でナビゲーションリンクであることを明示するタグ．
ナビゲーションリンクとはページ内の指定部分や他ページへの誘導を行うもの
３．main
HTML文書内の主要コンテンツであることを明示し，メインコンテンツエリアを担当するタグ．同一タグ内に１つしか使用することができない．
４．section
Webサイト内で文章のまとまりを明示するタグ．基本的に小要素に見出し(<h1>〜<h6>タグ)を持つことが推奨されている．
５．article
ブログ記事のように自己完結するコンテンツを明示する．<article>タグは子要素に見出しを含む形で記述する．<article>タグに<article>タグを配置することも可能
６．aside
サイドバーのように補助的なコンテンツを明示するタグ．広告，人気記事，新着記事，SNSシェアボタンなどのコンテンツを含んだ形で使用する．
７．footer
Webサイト内のフッターエリアを明示するタグ．コピーライトなどを書くのが一般的．