iPhone® & iPad® Web Design For Dummies®

Developing a Device Detection System

The basic concept behind device detection is straightforward: The website identifies the visitor’s device when it arrives, then sends the visitor the optimal version of a web page based on what the server knows about the device. (For a more technical explanation, see the nearby sidebar, “User agents and device detection.”)

The challenge with device detection — and the subsequent redirection of visitors — is that more than 8,000 devices are now in use, and more are added all the time. Although the various categories of mobile phones have similarities, the specific support information for each device varies.

Successfully delivering the right version of a site to the right phone is the “secret sauce” of many high-end mobile web design firms. They build up libraries of device capabilities to determine the optimal content to deliver to each device. Some capabilities are simple and address common difference, such as screen size and multimedia support. Others are highly complex and describe capabilities based on combinations of attributes from each device.

Open source solutions are available, as they are for most common problems with the web, thanks to the generosity of programmers who share their work and offer applications for free (or a donation). We cover a few of these solutions at the end of this chapter. In the next section, we focus on relatively simple ways to target designs for the iPhone and iPad.

Setting Up Simple Browser Detection

Using ...