I once worked with a developer who built an entire form using divs. No fieldsets. No labels. No semantic input elements. Just divs with click handlers.

It worked. Sort of. Until a client used a screen reader and reported nothing was usable. Until we added validation and realized there were no semantic input fields to attach error messages to. Until we tried to add keyboard support and realized we’d recreated the wheel poorly.

That’s when I learned: HTML isn’t boring because it doesn’t matter. HTML is boring because people don’t respect it. And that disrespect is expensive.

What HTML Actually Is (And Why It Matters)

HTML is not a styling language. It’s not a layout language. It’s not a programming language. HTML is a semantic markup language. It describes what content IS, not how it looks.

A paragraph is a `

`. A heading is an `

` through `

`. A button is a ``. A link is an ``. These aren’t just tags. They’re contracts with the browser, with assistive technologies, and with search engines about what this content means.

When you use `

`, the browser knows it’s a paragraph and treats it accordingly. Screen readers announce it as a paragraph. Search engines understand paragraph context. CSS can style it appropriately. It’s semantic.

When you use `

` and apply `cursor: pointer` and `onclick`, you’ve created something that looks like a button but isn’t one. The browser doesn’t know it’s clickable. Screen readers don’t know it’s interactive. Search engines don’t understand it. You’ve created confusion.

This is what people miss about HTML: it’s not about how it looks. It’s about what it means. And meaning matters for accessibility, SEO, and maintenance.

The Semantic HTML Fundamentals You’re Missing

Most developers know about `

`, ``, and `

`. That covers about 20% of HTML. The rest is where the real utility lives.

Headings: `

` through `

` aren’t just for styling. They create document structure. Screen readers use heading hierarchy to navigate. Search engines use headings to understand what your page is about. You should have exactly one `

` per page. Then nested `

`, `

`, etc., based on content hierarchy—not on how big you want text to be.

Lists: `

` and `
` with `
1. ` aren’t just for bulleted lists. They semantically describe grouped content. A navigation menu is a list. A set of options is a list. Use the semantic element, not divs with styling.

   Sectioning: `

   `, `

   `, `