HTML - Semantic vs. non semantic, or the div dilemna

Hi everyone,

I’m bringing an old subject back on the table as I am diving into HTML: to div or not to div.

In the framework of the fullstack Codecademy course, one of the posts got my attention: “With semantic HTML, do we no longer use the div element?

Reading through the several answers, I gathered that the main argument against dropping non-semantic (or div) was that there are limited “semantic tags” (pardon my french), therefore using div is necessary to attribute ID’s and classes for CSS purposes.

I understand that logic; applying CSS entails leveraging ID’s and classes; but could one not argue that ID’s can be attributed to semantic tags (, , and so on… ) and therefore the CSS aspect is a non-issue? Would this not lead to an ultimately higher quality code since the identification and classification is semantic?

Hi,
of course you can apply css styles to semantic tags. And you should. But if you have a sophisticated design, you’ll need extra tags that can have extra styles. Some fancy effects – like navigation effects – cannot be achieved by just applying styles to the <li> element. In some cases you’ll need extra spans or divs just for styling.

2 Likes

Thank you for the input! I keep running into articles bashing divs and how they are overused, so I am trying to draw a best practice line :slight_smile: many thanks.

1 Like

Hi there!
I’m using both of them. It depend of what I have to do.
I’m doing the Full-Stack Web Developer course as well, and I use both of them. Generally I use semantic tags if I have to create sections.
This is my Website Design Guide, a project that I created for the course!
This is the Github link of the project!
This is an actual preview of the site!

Hope that this helped you! :smiley: :love_you_gesture:

1 Like

Awesome!!!
HTML subject aside, how far along are you in the course, and are you feeling confident about quality?

Just for those out there who are diving into html and css, matteomarras09737791 cf above just shared a really clean piece of code and learners can only gain from it! Definitely check it out, I just have myself. Tip top! Many thanks Matteo :slight_smile:

Thank you very much! :slight_smile:
I started from scratch the last month. Now I’m at 11% with the course, I’m just starting with Flexboxes!
This course is just awesome, is literally priceless for me!
Oh, and if can give you a bit of motivation… I’m Italian, I have to translate all the content! :rofl:
Will is power my friend! :sunglasses: :love_you_gesture:

1 Like

Glad I could help :smiley:
If you want I’m looking for a Pair Programmer Partner to study together!
Maybe can help us both!
Could you be interested?

1 Like

haha! “translating from english to italian to english to HTML”… amazing :smiley:

definitely up for Programmer Partner! I’m probably a bit behind you though, but we can try it out!

nb/ i’m french and american so im sure we’ll be able to communicate (since french is an ugly version of italian and english a better version of code xD

:rofl: :rofl: :rofl:
Perfect :smiley: I sent you a PM :smiley: