I currently have a setup like this:
<section id="intro"></section>
<header></header>
<section></section>
<section></section>
<footer></footer>
The header element is a sticky header with site name and basic information. It doesn't show until after the user scrolls past #intro, hence where it is in the DOM. I was wondering if, from the point of view of semantics and accessibility, it made more sense to just make it a div or a section.
The <header>
tag is not required to be at a specific position in your document, except that it should not be a child of another <header>
, a <footer>
or an <address>
tag. The <div>
element, on the other hand, is strongly suggested as a last-resort element only, to be avoided when another element would fit better semantically. It seems your usage of <header>
is fits well with its recommended usage, though you should keep in mind that IE8 and earlier versions do not support it and it is effectively unstylable with these browsers.