Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I'd really like to implement some of the new features that come standard with HTML5 but I want to be able to do it in a way that doesn't break my site.

I know that Progressive Enhancement and checking the useragent is always an option. Are there any better alternatives out there?

share|improve this question

4 Answers 4

up vote 1 down vote accepted

2 Possible approaches:

  • HTML5 Shims, which are code snippets to allow you to use HTML5 features but with error correcting backstops
  • Modernizr, which is a toolkit to apply CSS classes on the body that you can use as part of detecting individual features and displaying warnings or disabling code if those classes are present or not present.

The Detecting HTML 5 Features chapter of Dive Into HTML 5 is a great reference as well.

share|improve this answer

A much more accurate way to determine the type of browser you're dealing with is by feature dectection, not by reading useragent.

jQuery has .support() that is a great way to do this.

As with any feature, just make sure that if you want to implement something that it degrades gracefully for older browsers.

share|improve this answer

In addition to these responses, a lot of HTML5 elements like the form elements degrade gracefully to simple textboxes because if a browser doesn't recognize the type attribute, it defaults to text. Also, if a browser doesn't recognize an attribute (like placeholder) it just ignores it. This graceful degradation means that you can implement these elements without having to worry about things messing up if a user's browser doesn't support HTML5. They just simply won't see anything special.

share|improve this answer

Gmail is the epitome of progressive enhancement, it goes all the way from straight html to all the bells and whistles. Which is why it has such a large audience. So that's a good model to emulate.

I suggest relegating html5 features to something that gets turned on by javascript for compatible browsers. Which still means you'll want to start with html 4.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.