HTML5 introduced a new approach and opened up new and intuitive techniques for organizing page content. Until the advent of HTML, we had tags that assigned heading levels (H1
… H6
), paragraph tags, list tags, and other elements that defined mainly how content would be displayed.
When it came to organizing content into containers or boxes, we were left to our own devices. And so developers created their own sets of ID and class styles—ID styles that were used once per HTML file (like a wrapper style), and class styles that were used multiple times on a page (like a style that defined picture/caption boxes).
HTML5 standardizes the elements used to organize content on a page. The key HTML5 structuring elements are as follows:
<header>
<nav>
<article>
<section>
<aside>
<footer>
The names of these elements are pretty much self-explanatory. The <header>
elements define header content at the top of a page, and <footer...