Programming the Mobile Web, 2nd Edition

Chapter 9. Feature and Device Detection

Before moving on with more HTML5, CSS, and JavaScript code that we can use on mobile devices, we need to pause and talk about feature and device detection. As we saw in the last chapter, not every browser supports exactly the same features, and even different versions of the same browser may have differences in terms of what we can use.

This book was likely finished a few months (or maybe even years) before you picked it up. I can assure you that what some browsers support today may differ from what they supported at the time I was writing it.

This is not just a book authoring issue. It’s also a development issue, because we can’t constantly update every website and web app we create to suit every new browser version or platform on the market.

Therefore, we need a way to design and develop our code that makes it as future-proof as possible. To that end, we are going to look at some techniques that will be useful for feature detection, device detection, and fallback mechanisms.

In combination with all these techniques, we can use the progressive enhancement technique (covered in Chapter 5) and some graceful degradation hacks to ensure that our code works as well as possible on as many platforms as possible.

Possible Problems

To find the right solutions, first we need to recognize all the possible problems we may need to deal with. We can summarize the possible problems with regard to features as follows:

• An HTML feature we want to use is not available, ...