Element of
HTML Document Structure
What does <header> do?
The <header> element is used to identify content that precedes the primary content of the web page and often contains website branding, navigation elements, search forms, and similar content that is duplicated across all or most pages of a website.
Display
inline

Page or section header

The <header> element is one of several new semantic document tags introduced with HTML5. It is used to define a header section for the element that contains it. It can be used as a header for a whole page (the most common usage), but can also be used as the header for an article or any other piece of on-page content.

As a page header

Typically, when the <header> element is used as a page header, it contains the site's title or logo (or both) and the main site navigation. This is sometimes known as the "masthead". 
<body>  <header>   <a src="/" id="logo">Site Title</a>   <nav>    <ul>     <li><a href="/">Home</a></li>     <li><a href="/about">About</a></li>     <li><a href="/contact">Contact</a></li>    </ul>   </nav>   </header> <main>  .  .  . </main> <footer>  .  .  . </footer> </body>

As a section header

<article>  <header>   <h2>Title of Article</h2>   <span class="byline">by Arthur T. Writer</span>  </header>  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam volutpat sollicitudin nisi, at convallis nunc semper et. Donec ultrices odio ac purus facilisis, at mollis urna finibus. </p> </article>