Can I put the navigation menu inside the site header?

Asked

Viewed 515 times

1

Could I put the navigation menu inside the header of the site? Normally, it comes after the header (from what I saw). If I put it in, is it wrong? I made a website, after I saw that Nav was inside the header.

html5

  • This is based on opinions but there is nothing wrong there, just keep the layout organized so that you easily identify the navigation in the page header

  • remember that before the HTML5, there were no semantic tags like nav and header. They from the point of view of behavior "do nothing", other than a, img or p, so its function is to organize the layout, its semantic function is to put things in their place. Then something strange would be the footer inside the header, or header inside aside.

  • Only one comment, actually you can have several footers on the page, as they are related to the elements in which they are inside. Then vc can have a footer per session for example. Another interesting thing. Vc tb can have navs and Headings inside the footer!

  • 1

    Truth @hugocsl, if you think of the semantics of footer he’s a footer, we don’t think of him as a "footer" so it could be the footer of anything, page, any panel, etc

1 answer

2


To answer your question in a more assertive way and less guided by opinions, I took the reference of W3C about the tag nav: http://w3c.github.io/html/sections.html#the-Nav-element

In free translation:

The Nav element represents a section of a page that links to other pages or other parts of the page: a section with links to navigation.

That is, it must have navigation itself, which can be at the top, side, etc.

And to take any doubt if you still have, see the same link above Example 10, copied here the relevant part:

<header>
    <h1>Wake up sheeple!</h1>
    <p><a href="news.html">News</a> -
      <a href="blog.html">Blog</a> -
      <a href="forums.html">Forums</a></p>
    <p>Last Modified: <span property="schema:dateModified">2009-04-01</span></p>
    <nav>
      <h2>Navigation</h2>
      <ul>
        <li><a href="articles.html">Index of all articles</a></li>
        <li><a href="today.html">Things sheeple need to wake up for today</a></li>
        <li><a href="successes.html">Sheeple we have managed to wake</a></li>
      </ul>
    </nav>
</header>

That is, navigation inside the header, nothing wrong here, semantic tags header and nav work well together, show exactly what each part of the html ago.

  • +1 emphasis on using HTML5 semantic tags.

Browser other questions tagged html5

You are not signed in. Login or sign up in order to post.