Reputation: 517
This should be a quick one for you.. I know that in the HTML5 era multiple h1 tags are allowed as long as they are part of sections (always using the "article" or "section" and sometimes "nav").
My question is that is it allowed to have just one single H1 outside of a section respecting the one-h1-rule per page of the pre-html5-era .. and use the rest of h1 inside the sections?
So can these two H1 tags co-exist?
<div id="logo">
<h1><a href="index.html">... </a></h1>
</div>
<div class="container">
<article>
<header>
<h1 style="font-size: 2em;">Sometext</h1>
</header>
</article>
</div>
Upvotes: 1
Views: 374
Reputation: 14964
It's perfectly acceptable to use H1s the way you suggested in your question.
For example, in Bootstrap you could use this:
<a class="navbar-brand" href="#">Navbar</a>
or this instead:
<h1 class="navbar-brand">Navbar</h1>
in the nav bar.
Upvotes: 0
Reputation: 944559
The HTML 5.2 recommendation says:
There are currently no known native implementations of the outline algorithm in graphical browsers or assistive technology user agents, although the algorithm is implemented in other software such as conformance checkers and browser extensions. Therefore the outline algorithm cannot be relied upon to convey document structure to users. Authors should use heading rank (h1-h6) to convey document structure.
So, while you can do as your code example shows in theory, in practise you shouldn't.
Upvotes: 1