Page 140 - HTML5
P. 140
</footer>
<!-- The footer alone is sufficient -->
<footer>
<a href="#">...</a>
</footer>
Notes:
• <main> element descendants are not allowed within a <nav>
Adding a role="navigation" ARIA role to the <nav> element is advised to aid user
agents that don't support HTML5 and also to provide more context for those that do.
<nav role="navigation"><!-- ... --></nav>
Screen Readers: (software that allows blind or visually impaired users to navigate
the site)
User agents like screen readers will interpret the <nav> element differently
depending on their requirements.
• It could give the <nav> element a higher priority when rendering the page
• It could delay the rendering of the element
• It could adapt the page in a specific way to tailor for the user's needs
example: make the text links within the <nav> elements larger for someone who's
visually impaired.
Click here to read the official HTML5 Specification for the <nav> element
Section Element
The <section> element represents a generic section to thematically group content. Every section,
typically, should be able to be identified with a heading element as a child of the section.
• You can use the <section> element within an <article> and vice-versa.
• Every section should have a theme (a heading element identifying this region)
• Don't use the <section> element as a general styling 'container'.
If you need a container to apply styling, use a <div> instead.
In the following example, we're displaying a single blog post with multiple chapters each
chapter is a section (a set of thematically grouped content, which can be identified by the
heading elements in each section).
<article>
<header>
<h2>Blog Post</h2>
</header>
<p>An introduction for the post.</p>
<section>
<h3>Chapter 1</h3>
<p>...</p>
</section>
<section>
<h3>Chapter 2</h3>
<p>...</p>
</section>
<section>
<h3>Comments</h3> ...
</section>
</article>
https://riptutorial.com/ 124

