Brian Taylor, managing digital director at Jaywing, considers the benefits of responsive design in a mobile-first world.

The way in which people consume information has shifted dramatically in the last few years, and the recent Mobile World Congress showed that it is only going to continue to change in the year ahead. Wearable technology emerged as one of the most prominent themes at MWC, and before that at the Consumer Electronics Show in Las Vegas, where the majority of products on display were either connected directly or via a smartphone to the web.

2013 saw a significant audience shift towards mobile and tablet browsing in the UK, with sales of tablet devices and the number of smartphone users both rocketing. According to Gartner’s latest forecast, more than 1bn Android-powered devices will be sold in 2014. These technological developments mean that there is the potential to change irrevocably the way consumers use and interact with brands. Against this rapidly-changing backdrop, it’s more important than ever that brands to turn to responsive design in order to stay ahead of their competitors and establish market share.

This begs the question: why are there still so many non-responsive sites? Recent research by the IAB revealed that just 11 per cent of the UK’s highest-spending advertisers have websites designed automatically to display content in the most appropriate way for whichever device a consumer is using. The commercial reasons for responsive couldn’t be more clear. Poor user experience doesn’t just reduce engagement and raise bounce rates; it can also mean lost sales and long-term damage to a brand. Conversely, great user experience can reap some major rewards and contribute to the bottom line.

Changing consumer habits
Back in 2011 we launched a fully responsive site with a shortened purchase route for First Great Western (FGW). Responsive design was still in its infancy at the time, and the site was considered to be truly pioneering. The site was designed to manage a likely increase in mobile traffic and encourage consumer desire to purchase.

At launch, First Great Western saw an immediate 87 per cent increase in traffic going straight to the booking engine. Since then, mobile traffic to the site has doubled. And rather than losing out to the major changes in browsing behaviour, FGW has seen a modest change increase in visits, an impressive increase in engagement with page views and pages per visit both up two-and-a-half per fold and 35 per cent of traffic heading directly to purchase.

Econsultancy recently cited 14 brands that have raised conversion rate through responsive design. Further research has revealed eye-popping results, such as a 42 per cent increase in revenue across all devices. Some of the figures may be reported against a backdrop of not having responded earlier to consumer behaviour, but they still offer all the more reason to think responsive and user experience now.

Another key point to consider is the importance of enabling emails to render correctly on different devices. There is some debate across email broadcast regarding open rates on mobile devices, with Litmus claiming 47 per cent and Pure360, 28 per cent (but with a tiny clickthrough rate, versus desktop and laptop computers). However, if Litmus’ experience is anything to go by, this is a significant lost opportunity.

User empathy and design
The technical considerations for achieving a successful responsive implementation can’t be underestimated. And responsive design alone isn’t enough. Good user experience architects have a special blend of logical, technical and cognition skills that help them to see things as users do.

Developing empathy with users means putting yourself in their shoes over and over again. It’s easy to imagine how different users have different habits or use difference devices; in UX this is taken to another level, with every tiny detail taken into consideration. Beyond user empathy, UX specialists live and breathe the technologies they work with; they understand what can and can’t be done, tricks and workarounds, the pleasure and pain to help them deliver elegant and intuitive experiences.

It almost goes without saying that beautiful, engaging design is essential. This is where art meets science and becomes greater than the sum of the parts. Indeed, the key to success is collaboration across a range of technical, planning and design skills.

Mobile first in 2014
The Christmas period was a particularly interesting time for responsive design. According to Amazon, more than half of this year’s Christmas shoppers placed their orders using a smartphone or tablet. In fact the UK has the biggest European market for tablet sales, with more than 2.6m shipped between July and September 2013, more than the combined total of laptops and desktop PCs.

It’s important to remember however, that retail is by no means the only relevant sector for responsive design. With sales of tablets are overtaking laptops in the UK, content consumption on mobile devices will only continue to increase across sectors during 2014. In industries where online content is important and booking systems are required, for example airlines, railway, parcel-tracking and ferries, responsive design will become particularly important this year.

Delivering a seamless user experience across devices is a good reason to go responsive. But when backed by the numbers, it’s impossible to ignore the golden combination of expert responsive and user experience design. To finish, here are seven rules for good responsive and user experience design:

1. Get your content strategy sorted. Use real content, prioritise and ensure that key content is prominent across all viewports.
2. Think mobile first. Focus on what is really important and keep page weight down.
3. Map out the entire user journey. Understand the broader ecosystem and don’t view device usage in isolation.
4. Try to divorce initial creative routes from layout by using style tiles or element collages.
5. Create wireframes using HTML. It is quick to do and shows actual behaviour.
6. Responsive MUST be fluid, therefore design in browser with real content.
7. Prototype, test, and reiterate, all on real devices.

Brian Taylor is managing digital director at Jaywing