Alistair
Alistair

Reputation: 1979

html5 - Separating header and hX tags

I am writing HTML(5) which, on a few different pages, has a number of sections which contain a header (represented by a grey bar). This is a common pattern except for 1 page where this grey bar contains some navigational aids, but the header (as in the h1) is not in the grey bar but beneath it.

In terms of writing semantic HTML5 is it a violation to have something like:

<header><a>Go Back<a/></header>

<h1>This is the header</h1>

Or should it be:

<div class="nav-links"><a>Go Back</a></div>

<header><h1>This is the header</h1></header>

The latter requires much more CSS to handle the edge case so if the former is not a violation of HTML then I prefer it.

Does the first way violate HTML5 semantics?

Upvotes: 1

Views: 573

Answers (1)

raam86
raam86

Reputation: 6871

It is valid. You can use w3c validator for these things.

using

<!DOCTYPE html>
<head><title></title></head>
<body>
<header><a>Go Back</a>
</header>
<h1>This is the header</h1>
</body></html>

Validates so it means it's valid by W3C standards.

Upvotes: 1

Related Questions