Do you have to put a heading (h1, h2...) inside a header element

Hi,

<header><h2>I am a subtitle</h2></header>

I see this often and I wonder about my own pages. Is that a good idea? It feels like you are saying something twice. Is a header not used to ‘pack’ a lot of stuff, like a logo, a title, maybe a nav element that is repeated on several pages ?

Greets,
Karin

I found this for you, https://stackoverflow.com/questions/25099551/when-do-i-put-h1-h6-inside-an-header-element

TLDR; either is correct and header is mostly optional. I personally use header to wrap the nav bar and such at the top.

2 Likes

Adding to the great link and answer from @yakkya. This topic also involves a concept called semantic HTML.
Semantic HTML basically talks about having the same exact layout and markup for a page but using more meaningful tags. It is an ideology that encourages the developer to use HTML elements like <header> or <section> over generic HTML element s like <div>.
This does not mean you will not use <div> anymore but if you can put some parts of your code within a <main> instead of <div> you would do so.

There are some benefits to semantic HTML:

  • Search Engines would understand it way better, this would evolve into a broader concept called SEO.

  • Screen readers would read your code better

  • You can understand someone else’s code way easier

and etc.

There are some valuable resources at MDN pages and all over the internet about semantic HTML. If you had more questions about it let us know and we’ll figure it out together.

Good luck! :call_me_hand:

2 Likes

Hi,

Thank you for the link to this excellent post.

Greets,
Karin

1 Like

Hi,

Thank you very much for your detailed reply. Semantic html is common sense to me as pages become complex. If I have to read someone else html markup, it will be a lot easier with semantic html.

Greets,
Karin

1 Like