Member-only story
Don’t use <div> — Have Some Empathy
Not a medium member? Read the article for free here.
I’ve watched countless web development videos on YouTube and written an infinite number of HTML elements — whether in vanilla HTML, React, or other frontend framework. No matter where I go, I see the same old <div>
, and for the longest time, I was fine with that and hardly any YouTubers seemed to care. Then, one day, I heard a YouTuber casually say, ‘You should be using the correct semantic element here, but for the sake of this tutorial, I’m going with <div>.’
That casual comment struck a chord with me. I vaguely recalled hearing about semantic elements back in college but hadn’t paid much attention since. Curiosity piqued, I started digging into the importance of semantic elements. This article is a condensation of my findings, presented without diving too deep into the technicalities (I’ll link to more in-depth resources for those interested).

So what’s wrong with div
?
For most developers (myself included), HTML often feels like it’s all about presentation. This misconception leads to the overuse of <div>
tags. For example, instead of writing:
<p> Some Para... </p>
we might write:
<div> Some Para... </div>