Good design starts with well thought out structure and good structure helps everyone navigate your web pages.
HTML 5 provides sectioning elements that help add meaning and clarity to your structure.
For example, you might have a top level structure like this:
<header></header>
<main>
<article></article>
<aside></aside>
</main>
<footer></footer>
These sectioning elements have implicit ARIA Roles that enable assistive technologies such as screen readers to interpret your content and help with navigation within the page.
You can make use of these elements using Landmark Containers including:
- Main Controls for the main content of your page
- Section Panel Controls for content that should be grouped together
- Header Panel Controls for introductory content, often static
- Footer Panel Controls supplementary content for another section, e.g. its author
- Nav Panel Controls for navigation content
- Aside Controls for content indirectly related to another section
- Article Controls for self-contained compositions, intended to be independently distributed