レイアウトHTML5のレイアウトHTML5では、要素自体にドキュメントの構造的な意味を持つheader要素、nav要素、main要素、aside要素、footer要素などが追加されたことでブラウザや検索エンジンなどに、単なるレイアウトだけでなくそれぞれのボックスの意味や目的を伝えることができるようになりました。role="main">main</main><aside>aside</aside><footer>footer</footer></body>※記述例の便宜上各ボックスに高さと背景色を設定しています。※HTML5ではmain要素はドキュメントのメイン・コンテンツであることを表しますが、ブラウザなどユーザー・エージェントがこれを実装するまでrole="main"をあわせて記述します。#c0c0c0;}header要素ドキュメントのヘッダー。ドキュメントの最も重要な見出し(h1要素など)を表します。コンテンツの目次や検索フォーム、関連のロゴ、nav要素などを含めることができます。ページの先頭に配置することが望ましいとされるが、同一ページで複数使うこともできます。他のドキュメントや同一ドキュメント内の部分へリンクするドキュメント上重要なナビゲーションのリンクを表します。同一ページで複数使うことができます。main要素ドキュメントのメイン・コンテンツを表します。articl、aside、footer、header、nav要素の子孫としてmain要素を含めることはできません。同一ページで1つしか使うことができません。aside要素ドキュメントから抜粋した要約文、ページに関する補助的なナビゲーション、他Webサイトやブログなどのリンク集などを表します。ページやに関連しているのであれば広告も含めることができます。footer要素ドキュメントのフッター。ドキュメントの著者や著作権などの情報や、関連のドキュメントへのリンクなどを表します。同一ページで複数使うことができます。※HTML5ではブロック・レベル要素、インライン・レベル要素といった要素の分類が、コンテンツ・モデルによるカテゴリの分類に変更されたため、新たに追加された要素が未対応のブラウザのためにレイアウトに用いる要素をブロック・レベル要素としてレンダリングするようにCSSで明示的に宣言する必要があります。id="footer">id="footer"</div></body>※記述例の便宜上各ボックスに高さと背景色を設定しています。