How HTML5 element names were decided

April 2011

I had the pleasure of attending a talk by Chris Mills, creator of the Opera Web Standards Curriculum, which was organised by those Standardistas fellas and Build. Chris was talking about HTML5 and one of the things I found interesting was the research behind how the HTML5 element names came about.

Google research

Google looked at something like a billion web pages and measured what ID and class names were used the most.

The results looked like this:

  1. footer
  2. menu
  3. title
  4. small
  5. text
  6. content
  7. header
  8. nav
  9. copyright
  10. button
google.gif

See the full results here.

Look familiar?

Opera research

Opera then conducted their own research too, which came up with similar results.

Classes
  1. footer
  2. menu
  3. style1
  4. msonormal
  5. text

Full class results here.

IDs
  1. footer
  2. content
  3. header
  4. logo
  5. container

Full ID results here.

And that's how HTML5 element names were decided

As you can see the new HTML5 element names were decided based on the most commonly used IDs and classes that web designers were already using.

Both ‘main’ and ‘content’ are the obvious omissions. I’m not 100% behind the reasoning for this but I guess ‘section’ and ‘article’ work better semantically for the main content areas.

Good to see ‘msonormal’ didn’t creep in there.

Receive more design content like this to your inbox

I promise not to spam you. No more than one email per week.

I blog and share links about web design, user experience, product development, HTML/CSS, email design and anything else I find interesting.

No thanks