I hate divs, and so should you
Hello dear reader, it's a pleasure to have you here on my silly little web page, which deals with a topic close to my heart...
Semantic HTML. It's super neat! And you know what's not semantic? div. What the hell is that? According to MDN it's a division, more like it makes me want to cause division and unrest by writing up a page espousing why divs=bad
I'm going to assume if you're here, you've at least heard of semantic html, but if you haven't, you might at least sort of know some bits and pieces, like "< p >" and bam, paragraph
I make it a point of pride that for all of my personal websites I have, there is not a single div. "But notna!" I hear you cry, "What if I just want a generic holder for other html elements to go in". Use header, main, section, footer. "But I need subsections!", then call it sub-section, wack that bastard between two angle brackets, and bam, custom html element. Even better use that brain of yours to come up with a meaningful name. The only rule is that it needs a hyphen in it.
Personally, I'm not completely convinced of the whole "Block Element Modifier" thing which is used in the css world, but I see no reason why the same thing can't be applied to html elements. So, hear me out... I have my nav, and within there I could have my "< nav-link >". (Personally, I would probably do an unordered list and then apply styling to make it look correct, but that's because I see a nav as a list of links, the nav-link html element just made sense)
I recognise that this is a page, entirely for nerds who at least know html, no normal person is seeing "semantichtml.fyi" and being like, oh yeah, lets click on that. There is a further discussion here where I talk a little bit deeper on being intentional with how we create in the technology age. I've chosen to leave these other thoughts on another page to keep this somewhat steamlined
I will admit, there are a few wrinkles in my steadfastnest to deny any and all divs, and that is accessibility and times when you have to do stuff with the shadow dom. PSYC. No there's not. chuck an aria label on things, and it's as accessible as anything. and Shadow DOM, more like banish that argument to the shadow dimension yugi boy The shadow dom just takes it in and handles it like it's no big deal. (Assuming you're doing thing correctly, like, if it's a button, you make it a < button >, right? You are doing that, aren't you?) But if you're really worried about it, you can run some javascript which customised and extends the custom element from a real base one, which I *guess* could be a div, if you really must but it's entirely unnecessary
Jokes aside, there is legitimately, a small group who aren't able to use autonomous custom elements (the real name of "these bastards with a hyphen in them" I've been going on about), if a user is using a browser from before 2018, they might not get proper support. Which is unfortunate, but luckily for you, I've written a small bit of javascript where if a browser which doesn't support them, it will fall back and replace them with divs. If your user is using a pre-2018 browser, with javascript disabled. Well... They're an oddity to say the least
This is all to say, if you're writing a new page, and you care about it's contents and are in the process of enjoying the creation. It is my strong assertion that you should...
p.s. Originally, this was going to be at div.fyi, but someone bought the domain before I had fully committed to it. So instead I've ended up here instead. It's probably a better url if I'm honest, but at the same time having a url which was 7 letters long including the the tld and the ".", now that's living, but I guess for now I'll survive with my handful of other domains