Subscribe / Unsubscribe Enewsletters | Login | Register

Pencil Banner

Why responsive web design is here to stay

Jonathan Hassell | Nov. 7, 2013
Most Web design trends are just that. But in an increasingly mobile world, with an increasingly diverse number of mobile devices, the principles of responsive Web design aren't going to go away. Here are three ways developers need to respond to the demands of responsive Web design.

An informal moniker for responsive Web design and its attendant development is " mobile first," which recognizes that a significant portion of website traffic these days comes from portable devices of all sizes and form factors.

From smartphones to mini-tablets to regular-size tablets, a significant and growing portion of Web consumption is happening on devices on the go. You and your developers can no longer assume that your sites are being used on a full-screen desktop PC and develop mobile sites as an afterthought.

Frankly, the state of the mobile website market today is pretty dismal. Have you ever visited an airline website on your phone, for example? That was most likely a frustrating experience. Picture a dumbed-down site that lets you do one or two things — check flight statuses and maybe, just maybe check in for your flight — but kicks you back to the full site for tasks such as booking tickets or checking your frequent flyer mileage balance. The full site takes 45 seconds or more to load, mind you.

That's certainly not a mobile first experience. Indeed, wouldn't an airline website be the perfect site for a mobile first design? You have a phone in your pocket or bag most of the time at an airport; you're not carrying your powered-on, logged-on laptop everywhere. Why shouldn't you grab a boarding pass, rebook a flight, view yourself on standby or upgrade lists by default on mobile sites? A customer at an airport is a valuable asset, but airline websites are often designed for the person at home. Under a responsive Web design paradigm, that would change.

Users Want Content Right This Second
More websites are being accessed on the go, over cellular connections, so it's important to design pages that respond well and are usable over slower and/or higher latency connections as soon as possible, even before the page is finished loading. This often involves creating server-side components that detect what sort of device a user is consuming content on, then accessing a comprehensive database of device differences to serve the right content and client-side controls (such as JavaScript) so pages load faster than they otherwise would on any given device.

With responsive Web design, media queries are used to send the properties of the device a user is using - in particular, the width of the browser - and the server serves up different CSS style rules that end up letting the user have the best version of the site experience possible.

However, this can quickly balloon into an expensive approach. For one, that device database will always be changing, and it will essentially be a big list of quirks — for this phone, load this version of the code and send this version of the CSS, but for this tablet, send this particular version of the code, and so on. Creating and maintaining this database will be time consuming and require many man-hours of expertise.

 

Previous Page  1  2  3  Next Page 

Sign up for CIO Asia eNewsletters.