DEV Community

Cover image for Which HTML element tag can be used to represent and show header or introductory content to the user?
MELVIN GEORGE
MELVIN GEORGE

Posted on • Originally published at melvingeorge.me

Which HTML element tag can be used to represent and show header or introductory content to the user?

Originally posted here!

The best HTML element to represent and show header or introductory content to the user is the header HTML element tag.

For example, the header HTML elements tag is used to add header parts of a website like nav (navigation element), h1 (heading level 1 element), etc. HTML element tags that are seen by the user as introductory content on the website.

The header HTML element tag can be written like this,

<!-- Usage of the 'header' HTML element tag -->

<!DOCTYPE html>
<html>
  <body>
    <!-- 'header' HTML element tag  -->
    <header>
      <nav>
        <li>Home</li>
        <li>About</li>
      </nav>
      <h1>Hello World</h1>
    </header>
  </body>
</html>
Enter fullscreen mode Exit fullscreen mode

As you see from the above code we have used the nav (navigation element tag) and h1 (heading level 1 tag) HTML tags inside the header HTML element tag that are introductory content when a user visits the website.

Some common use cases for the header HTML element tags are to hold:

  • Navigation links
  • Top-level Headings (h1)
  • Logo of the website
  • A search bar
  • A menu Icon
  • Hero image

etc. and everything that is introductory to the user who visits the website.

See the above code live in JSBin.

That's all 😃!

Feel free to share if you found this useful 😃.


Discussion (0)