Cursory searches reveal HTML5 implementations are gaining traction among many web sites, some better known than others. While the different elements and properties of the new markup language vary in quality of execution, they reveal the diversity and progress of the new HTML 5 put into action.

What defines an excellent example of an HTML5 website?

The example sites must include elements that currently work on all or most platforms, are compatible with older browser versions, and employ graceful error handling. At a minimum, the example site should include the HTML5 doctype <!doctype html>, and it should utilize at least three other HTML5 elements on the home page, including <canvas>, <aside>, <article>, <hgroup>, and <nav> just to name a few.

The following screen captures, in no particular order, offer a brief description of each property included in each site. Thumbnails are included below, but you might want to view the larger versions in the associated gallery.

10 examples of excellent HTML5 in use on websites

UltraNoir

From a web design and development team based in Paris, France, the UltraNoir website utilizes the HTML5 doctype, canvas, aside, article, and audio elements, among others.

Figure A

FRONTEND 2011

The annual web conference and its web site boasts many superb implementations of HTML5 including doctype, hgroup, nav, and section. Preparations are now underway for FRONTEND 2012.

Figure B

Bruce Lawson

Lawson co-wrote the book HTML5 with Remy Sharp, and his personal web site exhibits many HTML5 elements including doctype, aside, nav, section, and article.

Figure C

Reser’s Fine Foods

This website utilizes the HTML5 doctype, section, aside, and nav.

Figure D

Sushimonstr

This website uses the HTML5 doctype, nav, article, and section.

Figure E

Diesel Civil Trust

The website uses HTML5 doctype, nav, article, section, aside, and footer.

Figure F

Enterprise JQuery

HTML5 elements on display include doctype, header, footer, section, article, and nav.

Figure G

Paperplane

The French marketing company demonstrates the use of HTML5 doctype, header, article, footer, and aside.

Figure H

Digital Hands

The online branding organization utilizes the HTML5 doctype, header, nav, section and article elements.

Figure I

Web Designer Wall

This website brings into play the HTML5 doctype, header, hgroup, nav, footer, article, section, and aside.

Figure J

Your finds?

There are many other sites out there utilizing the power of HTML5, these are just a few that demonstrate good use of the HTML5 technology. What examples of sites have you found that utilize HTML5?

Also see: