HTML tag hierarchy

[Prev:: HTML tag use should convey meaning] because HTML defines structure and meaning of web content.

So why keep using <div> and <span>? 🤔

I use this tag hierarchy to support this:

  1. semantic: <aside><article><nav><figure>
  2. structural: <p><ul><table>
  3. custom (descriptive): <user-profile><game-over><lotto-ticket>
  4. generic containers when nothing else works: <div><span>

This order prioritises semantics and structure over other aspects and aims to be accessible and SEO-friendly.