Use multiples header in a webpage

Web Development Full-Stack
1

Hi everyone!
I am taking fullstack career path. I am vuejs and Laravel developper but using this path in order to organize my mind and what I’ve learned through years.

My question is since semantic tags such main and header are used to organize webpage,
Can we use multiple header in a page.
Example:


<header>
  <nav>links</nav>
</header>
<main>
  <article>
      <header>
        <h1>Article Title</h1>
     </header>
      <p> Article contentn</p>
  </article>

</main>

Thank in advence

2

Short answer, yes, though we need to keep structure and semantics in mind. In your example above, that would be ideal usage of the HEADER element, with one small modification… Give the page an H1 in the MAIN, above the ARTICLE, and have that closely match the TITLE element in the HEAD.

Be sure to check your ideas against the HTML5 Elements listed on W3C (or MDN, a legitimate mirror of the site).

4.4 Sections — HTML5

2 Likes