HTML Structural Elements

You can see how a webpage gets full of tags very quickly. The div tag can get overused, so it's best to get in the habit of using these other block elements to structure your page. It helps with search indexing to have a well structure page as well. This top info can be in a <header> tag.


The <main> tag is where the essential/unique part of your web page appears.


This sits in an <article> tag. It is nested in main. Think article of clothing. Trousers and socks are different, but they are both articles.

2nd <article>

It's likely you'd have multiple <article> tags. Anything that is parallel in meaning.


<section> makes sense when chunking various parts of your web page. Big chunks can be in sections, particularly if they are parallel in hierarchy.