What is usually included in the header of an HTML document ?
The <header> is a tag introduced in the HTML5. In this article, we are going to discuss the use cases of header tags and what is usually included in the header of an HTML document. HTML5 came up with the <header>, the concept of the header was also there in HTML4. The programmer used to create an HTML <div> with the id of “header” to specify that it is the header.
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML course.
HTML5 <header> tag: In our normal notebook, we use our uppermost section of the page for heading or header. We specify the heading of the content on that page. The <header> tag is generally used to hold the information about the content. It generally gives the user information about what the page is actually for and what the user can expect in the <main> section of the website.
The <header> tag is generally used for heading purposes, you may see the use of these header tags <h1> to <h6>. The <nav> tag is used inside the <header> tag . This may happen if <nav> is very small and if the content of <nav> tag is used to identify the different web content. In such cases, the <nav> is usually taken inside of the <header> tag.
If our web page <main> has more than one section for different contents, then each section can also have their separate <header> tags to hold the information about a particular section.
Where we can / cannot use <header> tag?
As header is used for heading purposes, it cannot be used in the <footer>, but it can be used inside <main> tag for describing different sections such as every <article> tag in our <main>.
Example 2: See the below example for an understanding of what exactly the header is useful for. We can also include our navigation bar in the header as it is also an important part of the web page that defines the structure of our content and navigate through the different sections of the page. Hence it can also be placed inside the header tag.
Note: The default CSS for <header > tag is display: block.