The case for responsive design

Responsive design is that which changes in response to the device it’s being viewed on. In this article I’d like to deconstruct responsive design and attempt to explore how we can extend it to new gen devices like wearables.

What responsive design aims to do #

Change layout according to device #

Just because your site is viewable on all devices, doesn’t mean it’s responsive. Changing layout often involves positioning elements differently, as you just don’t have the same luxury as you would do with a computer. You have to account for whether links are tappable, text is readable, whether you need that extra item and so on.

Change navigability to better suit device ergonomics #

Each device is used differently, with actions of its own. On a computer you might click to go next on a slider, but on a phone you’d swipe. On a computer you can afford to display all nav links in the header vs putting it under a dropdown on a phone.

Displaying data relevant to device experience #

Cutting down on unnecessary items for different screen sizes. Not all items of a desktop version may be necessary or relevant for the mobile version.

When responsive is necessary #

Sites with light to heavy amounts of text #

One of the worst mobile browsing experiences is having to scroll leftwards and rightwards on the screen to read a line of text. If you want to keep your readers engaged, make sure to fit your text within device width.

When target demographic is mobile first #

With the influx of smartphones and tablets in the market, it’s likely that your consumer doesn’t own a computer and uses this as their primary device. Another case would be where your application is more likely to be used on the go rather than at a desk. Situational context matters.

When responsive is not so necessary #

Enterprise applications #

Business applications tend to be unresponsive. Either because they’re legacy systems that were built that way years ago and might be too expensive to change, or that they are not likely to be used on a device other than an office terminal. This trend too is changing as business applications grow comfortable with newer solutions.

Sites with secondary consumption sources #

Your main source of traffic might be mobile, but from a different source than your direct browser link. This secondary source could be an app or RSS readers for example. Again, this is changing as mobile becomes more pervasive.

Future of responsive #

Before designing for a new device, we need to understand what user behaviour with the device is going to be like. Before phones with internet connectivity hit the market, no one could predict for sure whether they’d be used for full time browsing, given the screen and navigation issues. Yet now after smartphone penetration in the market, we have an unexplored area of wearable device ergonomics that will reveal itself soon. How can we be sure that a user will use his wearable device’s browser for the same purpose as he does his tablet or computer’s browser? Would the swipe, pinch to zoom and other mobile actions apply equally well to smart watches? We’d need actual data to warrant any facts.

There are apps for smart watches like this Dutch site’s newsreader, but until standards are established and usage patterns studied, it is anyone’s guess as to what responsive on wearables will be.

Developing a mobile strategy has never been as important as it is now. Information is available on the go, and it’s up to the designers and developers to make the experience as smooth as possible.

I’d love to hear your experiences with responsive design, and what your opinions are. Tweet to me at @AbhinavChhikara