DEV Community

Anthony Maxwell
Anthony Maxwell

Posted on

To <div> or not to <div>? That is the question...

I am starting to appreciate the fact that I came late to the coding game, and one of the things that I am appreciative for are HTML semantics; and how HTML5 brought a plethora of tags that have both vastly reduced the use of the

and greatly improved the understanding of the HTML markup.

One of the interesting things that I like about HTML is that it is simple, it’s as simple as coding comes,in the simplest of terms, HTML is saying ‘put this, there’ and CSS is saying ‘and do it this way’. Both HTML and CSS are complimentary partners, one is plain and simple, matter of fact and the other enjoys a little flair, and to coin a phrase, style.

Think of HTML as Lego, colourless lego to be precise. You fit the pieces together and eventually you get something, but CSS comes along and paints each brick a different colour and before you know it; you’ve got yourself something… anyway, I’m getting away from my original point.

Semantics.

HTML5 has been described by many as “forgiving” and from what I’ve been learning, yes it is forgiving in it’s nature. I will continue to wrap my src and href in “…” but the truth of HTML5 is that you don’t actually have to. The browser will understand what you’re going for and will sort it out. Think of it as a Teams call where a colleague is cutting out, but you still understand the point he’s making. It’s not clean, it’s not the best, but you get it.

HTML likes to keep things simple and for HTML to be both clean and efficient, it also needs to be kept organised, and this why why I am so happy that we are able to structure a page, without relying on the , now don’t get me wrong, I think the is a great tag, it breaks things up, it gives the markup structure, but what it does not give me markup is context.

So whereas we would this and that - now, you can structure your mark up, as an author would structure a story, by giving it a beginning middle and end. We’re taking for you main titles , , , , and there is a TON more! it’s an actual candy store of tags. What this enables you to do is actually think about your page as a piece of organised content, – sidebar, navigation, heading, subheading, article, footer.

When I am designing a page, or preparing the structure - before I even place a finger on the keyboard, (and I’m not going to pretend I’m not new to this), I sketch the page in simple blocks and what happens is that I see a structure that these HTML5 tags help to define – and in reverse, I find that I read a piece of code and I can visualise that structure – I don’t even have try because it’s right there – header, main, article, footer.

So to the almighty , thank you for everything, but like all things, we must evolve. So don't be afraid to explore the semantics in HTML5. Honestly, they make understanding the markup much easier.

Actually that was quite cheesy, but you get my point.

Keep safe.

Top comments (0)