Menu
It's very common to see the usage of the tag <nav> in a main menu navigation, but I don't know other examples where I can use it. For example, for pagination:
<div class='my-pagination'>
<!-- first, 2, 3, 4 ... 8, 9, last -->
</div>
Can be:
<nav class='my-pagination'>
<!-- first, 2, 3, 4 ... 8, 9, last -->
</nav>
Is it semantic?
787
Yes.
The HTML5 spec defines the nav element like this:
The
navelement represents a section of a page that links to other pages or to parts within the page: a section with navigation links.
Pagination clearly consists of "links to other pages", and these are "navigation links". And in probably most cases it makes sense to use a sectioning content element for this.
Make sure to place the nav in the correct parent section:
If it’s a multi-paged article, the nav should be a child of the article.
<article>
<h1>Review of my new camera</h1>
<p>…</p>
<nav><!-- pagination for this article --></nav>
</article>
If it’s a multi-paged list of article teasers, the nav should be a child of the section containing this list.
<section>
<h1>All blog posts</h1>
<article><h1>Review of my new camera</h1></article>
<article><h1>I want to buy a camera, any suggestions?</h1></article>
<nav><!-- pagination for this blog posts list --></nav>
</section>
If it’s one full article per page, the nav should be a child of the body sectioning root.
<body>
<article><h1>Review of my new camera</h1></article>
<nav><!-- pagination for next/previous article --></nav>
</body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
