Menu Close

Mobile First Device Detection

I think Luke Wroblewski’s approach to responsive web design, which he calls RESS (Responsive Web Design + Server Side Components) is a pretty solid concept. I”ll let him explain:

In a nutshell, RESS combines adaptive layouts with server side component (not full page) optimization. So a single set of page templates define an entire Web site for all devices but key components within that site have device-class specific implementations that are rendered server side.

The idea is that instead of serving every device the exact same content the exact same way, some things are served differently depending on the device class (not specific device!).

Luke ends his post with a note that relying on user agent detection can be unreliable at times, and might be an issue in some situations:

That said, there may be a few unsolved challenges.

Relying on user agent detection on the server to decide which device class specific components to include could be an issue for some. There’s a lot of debate about how accurate user agent detection is.

This is a growing rather than shrinking issue; seemingly every day a new mobile device is launched, and keeping up with all the various user agent strings is difficult bordering on impossible.

However, what if, instead of trying to ferret out whether the connecting device is one of hundreds of possible mobile device/browser combinations, we instead attempt to discover if it’s one of a few known desktop browsers, and then beyond that try to separate out large (iPad & other tablets) and small (phone-size) “mobile” devices? This is the approach that Categorizr takes, and I think it has a lot of potential.

What makes Categorizr different?

Instead of assuming the device is a desktop, and detecting mobile and tablet device user agents, Categorizr is a mobile first based device detection. It assumes the device is mobile and sets up checks to see if it’s a desktop or tablet. Desktops are fairly easy to detect, the user agents are known, and are not changing anytime soon. Tablets are also pretty easy to detect.

By assuming devices are mobile from the beginning, Categorizr aims to be more future friendly. When new phones come out, you don’t need to worry if their new user agent is in your device detection script since devices are assumed mobile from the start.

I think this approach allows you to avoid the common pitfalls of responsive web design. Obviously it’s not a panacea (nothing is), but it has potential to be a solid technique.

What do you think is missing with this method? Are there situations or contexts that it overlooks or glosses over?

The Importance of Flexible Content

Jeremy Keith writes about why we shouldn’t be designing around “common” breakpoints. He advocates instead crafting the design and its behavior at various sizes around the needs of the content, rather than picking breakpoints that, while seemingly logical today, are in fact arbitrary and will in all likelihood be much less relevant a short time from now.

I agree wholeheartedly.

Taking this approach a step further, we should be insisting on flexible content. If the content is inflexible, then it won’t be able to adapt and flow into the numerous layouts necessary for today’s devices, much less the multitude necessary for the devices of tomorrow, next week, next month, and next year.

In conclusion, don’t just design with content in mind; create content (or collaborate with those responsible for creating content) with flexibility in mind.

Newer Posts
css.php