Menu
Is using multiple header tags common practice when it comes to separating a main-header and a sub-header, or should you divide one header into two sections using divs?
For example:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<header class="header--main-header">
</header>
<header class="header--sub-header">
</header>
</body>
</html>
As opposed to:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<header>
<div class="header--main-header">
<!-- Main-Header Content -->
</div>
<div class="header--sub-header">
<!-- Sub-Header Content -->
</div>
</header>
</body>
</html>
Would either of these methods be the "best-practice" way to achieve a website header and sub-header, or is there another approach that I'm missing?
511
asked Oct 23 '25 16:10
You can use as many headers as you like. We tend to use a main header at the top of our HTML containing our h1, navigation, utilities etc. But headers can also be used for the head of a section.
For instance:
<header>
<h1>The most important heading on this page</h1>
<p>With some supplementary information</p>
</header>
<article>
<header>
<h2>Title of this article</h2>
<p>By Richard Clark</p>
</header>
<p>...Lorem Ipsum dolor set amet...</p>
</article>
It is the head tag that should only be used once per page.
178
answered Oct 26 '25 06:10
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With