Responsive Design
By Martin Dower. Updated May 2014.
Going mobile is now easier than ever. This is good news for marketing departments and designers but for many it’s an untrodden path. With so much guff on the web, we felt it useful to produce a short paper in simpler language.
Why 30 days? – Timing, a combination of the pace of mobile growth and the emergence of frameworks making mobile development simpler so we thought 30 days was a reasonable amount of time to get started.
TL;DR? (Article too long?) here’s a shorter version.
Why?
Whether you’re a c-level director or an over-worked marketing manager it’s worth being clear about why you should care about mobile.
Your traffic profile is changing. We’ve seen mobile traffic explode over the past 4 years, to almost half of all traffic. Check your web analytics and compare the first quarter of 2013 with the same period this year.
Think that B2B is immune? It might be lagging behind in absolute traffic numbers, but in real terms the lag is less than 18 months.
Websites are “dead” and content meaningless unless mobile-ready, says Asda’s social chief
It’s a killer marketing stroke. I bet your competition have a poor mobile presence. First-mover advantage in the mobile space gives two key benefits; conversion and loyalty. Mobile optimised sites convert 2 to 5 times better and, once using your site, many customers are loathed to change.
Your customers have already gone mobile. 85% of smartphone users expect a rich online experience, regardless of platform. And famously 40% of users have turned to a competitor’s site after a bad mobile experience. [infographic]
The desktop is dead and the future is mobile. It was way back at the end of 2008 when laptops first outsold desktops and tablets outsold consumer laptops in 2013. This should be of concern for over 50% of organisations who don’t yet have a credible mobile presence. Nearly one-third of organisations “went mobile” from Jan ’12 to Apr ’14.
Cost is no longer a limiting factor. The appearance of mobile optimised frameworks such as WordPress reduces the cost of developing in the mobile space and put the management and planning back into the hand of the people that matter.
Surprisingly, most digital agencies have yet to apply any form of mobile optimisation to their own websites.
Having an “App” is not the answer. The mobile/tablet landscape is more unstable than ever with competition between Apple, Google, Microsoft, Samsung, Sony and Mozilla. Do really want to FOUR versions of your mobile websites (feature, smarts, tablets and TVs) and countless versions of your mobile apps for Android, Firefox, iOS, Tizen, Ubuntu and Windows Phone.
Watch the USA. In recent years the UK has slipped behind the US so by keeping a watchful eye across the Atlantic you’ll see what’s coming down the track.
Fear, uncertainty and doubt. Armed with the right information it’s remarkably simple to move into the mobile space. The problem for many organisations is that they rely on their agency to advise them and most agencies don’t understand the mobile space well.
It’s rather shocking to see nearly three quarters not mobile optimised – if they don’t understand it then how can they advise you? Usefully, your competitors are also advised by mobile-ignorant agencies.
When?
The straight answer is NOW. If 10% of your visitors convert twice as well you’ll see a 10% increase in conversions. 30% then becomes a huge prize. If the project costs the equivalent of a months advertising budget then it will payback in less than a year.
How?
Start small. If this is your first foray in mobile development then pretty much anything mobile-optimised (even if it’s only one landing page) is probably better than what you have now. This gets you out of the blocks quickly so you can show return and feed the re-investment. Find a good development house (you can contact us, we think we’re good :)) and get them to build a handful of pages on a decent framework and you’ll be off and running in less than 30 days.
Plan big. You’ll be aiming to incrementally replace the whole of your current site and other digital assets with a mobile-first philosophy. The key points we’d suggest to consider when planning are:
- How can we make it mobile-first?
- Why are we doing this?
- How long is its life-expectancy?
- Can we make it mobile later?
Stay agile and flexible. With the ever-shifting state of the marketplace we reckon there are huge benefits in staying agile; this doesn’t need to be onerous but adopting a deliver early and often approach will help over time.
But don’t forget the detail. For example mobile-optimised email is one not to be missed. Click rates are higher and with mobile opens at nearly 50% it’s a great litle win.
Who?
You’ll need a motivated and bright team linked with good partners (did I mention you can contact us?). It’s a change programme so you have the choice of bringing in an external team or finding a well-placed internal champion to push through the resources needed.
Designers. Choose wisely, check their work and make sure they understand the scope of what is needed. Not all mobile designers were created equal so you’re best off looking for depth of experience, specifically more than a couple of years in responsive design.
Development / Integration. Aim for organisations with a mobile-first philosophy who are steeped in the technology. The key skills required from the web agency is not traditionally back-end programming. What you need are integrators who have skills picking apart and gluing together existing systems.
You might take the opportunity to move to a WordPress framework at the same time?
What?
What do you need to focus on? What should you avoid? What should you aim for? Here are some mobile best practices that you should be aiming to follow. This is not a religion, more of an idealised check-list. Want a more in-depth review?
Simplify navigation. Clear navigation and, on large sites, search functionality, will help your customers easily find what they need. Consider using longer but fewer pages to reduce the number of clicks required.
Quick to load. Mobile users are often short on time. To help them, design your site to load fast and make copy easy to read. Prioritise the layout of content and features that mobile users need most.
Focus on what’s needed. Use site analytics to see what your users are doing and prioritise those functions.
Build it usable. It should work across all mobile devices and all handset orientations. If you have to choose, focus on portrait orientations for iPhone 4/5 and the latest Android phones. Never use Flash. Reduce large blocks of text and use bullet points for easy reading. Not everyone finds reading on a mobile as simple as a desktop so think about larger fonts (14 pixels+), contrast and negative space. People use their fingers to operate mobile devices – especially their thumbs. Design your site so even large hands can easily interact with it so aim for large, centred buttons and give them space around the outside to avoid accidental clicks.
Make it easy to convert. Focus on information that will aid conversion, reducing the number of steps and keeping forms short and punchy. No matter what your site’s objective is, your customers need to be able to do it with a virtual keyboard and no mouse. Keep it simple, stoopid. Use click-to-call functionality for all phone numbers.
Think local. Frequently users are out and about and locational information is more prized. Make sure maps are accurate and link to the internal mapping available in the device. If you can include geo-location services even better but take care with the privacy associated with tracking folks.
Evolve. Focus on the visitor, watch their interactions, listen to their complaints and start a programme of continual improvement. Release new version early and often, build up some momentum.
About Connected
Mobile-first digital agency since 2010 and Europe’s first WordPress dedicated agency, founded in 1996. World class client services and peerless WordPress support.
Building top-tier web sites for nearly two decades. Leader in best practices and new technology adoption with a conversion rate / commercial focus. We offer a full range of agency services and work with partners or in-house teams.
Article first published Mar 2013. (Mildly) Updated May 2014.
