On the Chrome team, we’ve been curious about the adoption of HTML5. We recently started measuring the usage of certain features in Google’s search index. Today, we’re excited to share a trend chart for element tag names:

http://googlechrome.github.com/webplatform-metrics

Keep in mind that these numbers are only an approximation for the web as a whole because our crawler doesn’t index everything (for example, pages behind user login forms). Even so, the charts clearly demonstrate strong adoption trends for certain parts of HTML5:

* <header> and <footer> tags are now on 7%+ of the web.
* Usage of <nav>, <aside>, <section>, <article>, and <time> is steadily increasing too.

In the future, we hope to regularly share metrics on additional HTML5 features, so stay tuned!
316
80
Victor Costan's profile photoJanine Suvak's profile photoJohn Bielecki's profile photoBrandon White's profile photo
27 comments
 
Have Matt Cutts announce that using proper HTML5 semantic tags gives a site a tiny boost in Google Search, and you'll have HTML5 adoption surge in no time ;)
 
I love HTML5, but not all browsers yet ... 
 
<footer> tags were the cure.
I noticed <thead>, <tbody>, <tfooter> didn't render in Chrome.
Still unsure about the difference between <section> and <div> tags, or maybe that is the difference.
 
+Michel Wilhelm you don't need an awful lot of browser support for semantic tags. I think modernizr covers you back to IE6.

+Jonathan Ballard I use <section> when I have a semantically meaningful subdivision, and <div> when it's purely a CSS / JS hook that I can't justify semantically.
 
Unsure what you meant, +Victor Costan.

I found an answer if we say <section> lets us group content together in more determinate manner than <embed>.
 
I can't think of a reason not to use HTML5 tags. They make much more sense. 
 
+Brandon White
 Flash will never totally disappear. As a web development program, its days are numbered. As a fairly simple animation program-you can import Flash files into After Effects-the possibilities are still endless.
 
+Jonathan Ballard I start out mapping the contents of my page. At this stage, I use semantic tags like <header>, <nav>, <article>, <section>, <aside>, <h1> .. <h6>, <p> etc. Once I apply CSS, I sometimes need more blocks, so that's where I add <divs>.

MDN says "The HTML <embed> Element represents an integration point for an external application or interactive content (in other words, a plug-in)". I'm having a hard seeing how that's related to <section>.
 
Ok, now that sounds likes it works as originally intended.
 
Having a real hard time reading that chart. 
 
What happened to figure and fig caption? I know I don't use them, but…
 
Thanks for the update. Could you possibly label the lines instead of having a legend or key on the side? With 9 different lines, while I recognize they are posted in the legend in the same order they are on the chart, it would be a handier graphic if the key was aligned with the line and color on the chart. Thank you, good information. 
 
switching from flash to HTML5, i think we might soon end-up back with using flash, chrome, good web-browser
 
I'd suggest adding 'canvas' and 'audio' to this list.
 
I'd rather see statistics on usage of the new APIs like WebSockets and IndexedDB. Seeing the use of CSS3 selectors would be interesting as well.
 
This chart is very hard to read for a color blind person like myself.
 
I'd be interested to see figures on how frequently they are used correctly.
 
For me it looks more like wordpress 2013 skin adoption ;)
Add a comment...