Is it too early to use HTML5

Question

I was wondering if it it too early to use HTML5 for a production site. Should I rather wait 6-12 months until users have updated to compatible html5 browsers? This leads me to, how far back does the browsers support HTML5?

Answer 1

No - see http://articles.sitepoint.com/article/html-5-snapshot-2009 or http://www.smashingmagazine.com/2009/07/16/html5-and-the-future-of-the-web/

Answer 2

Depends on your target market and what subset of HTML5 you are planning on using.

For instance, there are workarounds for the HTML5 semantic tags on Internet Explorer. You can also use HTML5 video with a Flash fallback (best of both worlds). Features such as inline SVG and Canvas have no (non-plugin) fallback, so won't work on the IE side of the camp.

CSS3 is another problem, and can be partially mitigated using conditional includes and per-browser style sheets (yuck, but even without CSS3 you need this).

I suggest reading the DiveIntoHTML5 site.

Answer 3

I was wondering if it it too early to use HTML5 for a production site.

Maybe.

Should I rather wait 6-12 months until users have updated to compatible html5 browsers?

You mean 6-12 years, I assume?

This leads me to, how far back does the browsers support HTML5?

Some browsers have supported bits of HTML 5 for longer then anyone has been saying HTML 5 (the features are just now being standardized).

Some parts of HTML 5 see zero support in the market.

Don't just "use HTML 5". Look to see what parts of HTML 5 could be useful to you. Look to see what support is like for them and how it will degrade for browsers which don't support it. See if using those features is worth the cost in mature QA tools (like DTD validators).

Answer 4

If everyone waits for others to start using, no-one will ever use it.

Why not help lead the way? Just stick to browser-supported features and help educate your users about updating their browser.

Answer 5

if you wait you will wait forever. write the html and css so it degrades gracefully, do your best and get ahead of the pack.

Answer 6

Depends on the HTML5 features you use. In general only Chrome and Safari (webkit-based browsers) support most of HTML5, the other browsers including IE8 and Firefox lack support for various features. See http://www.scriptol.com/xml/html-5-browsers.php

Answer 7

It is really a bit of a toss-up. Safari and Chrome support a pretty hefty chunk of the proposed HTML5. Firefox would come in after them with a reasonable amount of support. IE8 however, doesn't offer hardly any HTML5 support. There are some JS hacks that enable some elements, but its far from a solid solution. Just be aware of what you're getting into. check out this overview on Wikipedia

However, to get a bit of a hack-y feeling support for HTML5 in IE, you can check out Remy Sharp's HTML5shiv

There are however, a good amount of HTML5 elements you can implement in your projects now that are supported by most browsers, take a look at this video from nettuts "HTML5 Features you Should be Using Right Now"

Answer 8

A key point you must answer first is: what will HTML5 will bring to the new user? Upon answering find a middle ground:

Could you...

• Offer "traffic generating" content in the most compatible format?
• Seamlessly display the "best format" for a given browser (adaptive CSS)?
• Offer teasers which will encourage the user to download good browsers?
• Offer advanced content in the best format for the content itself?

Sometimes we construct advanced features in a site for ourselves, the web masters, and forget that the user may not even notice our efforts (like the stupid flash animations that everybody skips).

I agree that we all should start pushing the users toward new standards (imagine if we all boycotted IE and all sites refused to serve IE content!), but do so without shooting yourself in the foot and having an amazing site that only you can see.

Good luck.

Answer 9

http://caniuse.com/ has an excellent overview of which features are available, on which browsers - and information on available Javascript/Flash workarounds.

http://www.modernizr.com/ is an excellent library to detect which features are supported on the client browser.

As for HTML5 itself, the term has become a portmanteau for a lot of specifications - new markup, CSS3, canvas…

You have to ask yourself the right questions:

• Who are you making this site for?
  • What kind of IE6 support does your client want? In particular, can you make a site that will have some more features on "non-IE6 browsers", at the cost of nearly no development time?
• What features do you want to use?
  • Some features bring semantic sugar but are not really worth the hassle - even when "supported". (<article>, <date>…)
  • Some features bring (mostly) eye-candy, but absence of support won't usually break your site. (CSS3 corners, HTML5 forms)
  • Some features can become the cornerstone of your site (<canvas>, <video>), especially if you want your site to be accessible from smartphones. (Even with Android getting Flash, I suspect many users won't activate it if not forced in order to spare battery life)
• What features can you afford to use?
  • Some features degrade extremely gracefully - that is, you don't have any work to do when the browser offers no support, and people with non-supporting browsers won't even notice that they are missing on something (HTML5 forms)
  • Most useful features have relatively widespread workarounds for non-supporting browsers (mostly IE), generally implemented in Javascript or Flash. (HTML5 stylable markup, CSS3 corners, <video>, <canvas>) - but it will come at a price in site performance and design time.

Short answer: As a hobbyist web designer (so don't take that advice as more than a barely informed piece of opinion), I do not think it is too early - if your website needs to be accessible on the iPhone and iPad, it will need HTML5 for some features. If your website needs to be accessible from people who are on IE6, then of course the set of available HTML5 functionality is quite limited (Heck IE6 barely supports CSS2.1) - but the most important bits (<video>, <canvas>) have workarounds available.