Issue
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?
Solution
Yes.
The HTML5 spec defines the nav
element like this:
The
nav
element 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 thearticle
.<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 thebody
sectioning root.<body> <article><h1>Review of my new camera</h1></article> <nav><!-- pagination for next/previous article --></nav> </body>
Answered By - unor
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.