Responsive design - is it the answer?

Responsive design seems like a brilliant solution for coping with the rise in mobile users but what are its pros and cons, and what has to be considered to make it effective?

The growth of mobile browsing

Browsing the web from a mobile has arrived in a big way and will only get bigger. The number of smartphone users in the UK will more than double between 2012 and 2016, from 19.2 million to 41.9 million, according to eMarketer's forecasts.

Tablet ownership among the GB population is at 13%, with non-iPad ownership increasing steadily with the increasing popularity of android tablets in the market (Ipsos MORI)

Shopping and browsing on mobile devices: 66% of tablet owners have made a purchase from their device, whilst 44% have done the same from their smartphone in recent months, according to eDigitalResearch and IMRG.

But 90% of  websites are not optimized for mobile, and even bigger companies are failing to meet mobile needs as 60% of the UK’s biggest 100 advertisers didn’t have a mobile-optimized site.

Responsive design

One solution is to build separate mobile and desktop sites, but an alternative approach is ‘Responsive’ design. This is a way to show content on various devices in different ways depending on the size of the screen. It involves building a single site and using style sheets to reformat the content based on the browser size.

They key advantages of this approach are:

• You only have to build and maintain one site
• The site displays well on all platforms and so should be easier to use
• Lots of users use mobile for everything - they don’t have different goals or want different journeys on the mobile
• Google likes mobile optimized sites

Some drawbacks are:

• If users have goals that are specific to mobile then it’s harder to balance the competing needs of desktops and mobiles
• Users behave differently on touch and swipe devices (mobile) in comparison with point and click devices (desktops). It’s harder to build an interface that works well in both situations
• For responsive design sites to work well you have to think mobile first. It may be hard to take an existing site optimized for desktop (and an organizational culture that thinks ‘desktop’) and change this to be optimized for mobile.
• Simpler images and layouts are needed for small screens that may not be best for larger screens

What to consider

Notwithstanding the drawbacks, there is little doubt that responsive design is a great solution for many sites, but they have to be designed and implemented well. Issues to consider include:

• Whether to adopt a fully responsive design (lots of states) vs. adaptive layout (limited number of states)
• The number and size of breakpoints in the design
• Where to place, and how to handle, site navigation
• Numbers and sizes of columns/grids at different resolutions
• Text sizes at different resolutions (responsive typesetting)
• Image types
• What functionality and content to hide at small resolutions
• The level of compatibility required with older browsers

How Web Usability can help

If responsive design is something you are looking at then Web Usability can help in a number of ways. We can:

• Help you develop a responsive design strategy
• User test your own responsive design prototypes on a variety of platforms
• Create responsive design prototypes and even design them if required

If you want to know more please get in touch.