Ian Carrington, Google mobile advertising sales director
Giving consumers the best possible experience on their mobile device is critically important. A poor mobile web experience can negatively shape a consumer’s opinion of your brand and make it hard for them to engage or make a purchase. A recent study asked users about the performance of mobile websites and discovered that 61% of users are unlikely to return to a website that they had trouble accessing on their phone.
Clearly, the best consumer experiences on mobile devices happen on websites that are designed specifically for mobile. But being mobile friendly is more than just fitting onto the screen. Follow these best practices to turn your site into a great mobile experience.
A redirect code
A mobile-site redirect is code that can automatically tell if visitors are using a mobile device and send them to the mobile-friendly version of your site.
Have your site developer implement this redirect code so your customers get the best version of your site for their needs. And because people use multiple screens throughout the day, convert as much of the functionality of your desktop site to mobile as you can to create a seamless experience.
Keep your mobile site quick. Mobile users are short on time, squeezing in online tasks throughout their day. To help, design your site to load fast and make copy easy to scan. Use your desktop site analytics to see what mobile users are doing, then prioritise content accordingly. Reduce large blocks of text, use bullet points and compress images to keep them small for faster site loading.
Clear navigation will help your customers easily find what they need, so use seven or fewer links per page, include back and home buttons, provide a prominent search box and eliminate rollovers. A mobile-friendly site will feature minimal scrolling and a clear hierarchy too.
Design your site for clumsy hands and a small screen. Create large, centered buttons with plenty of breathing room to reduce accidental clicks, and pad out smaller buttons and check boxes to increase clickable areas. Make it easy for your customers to read content by creating contrast between your background and text, while ensuring everything fits and can be read without pinching and zooming.
No matter what your site’s objective is, your customers need to be able to achieve it with a virtual keyboard and no mouse. Make it easy to buy something or contact you by reducing the number of steps needed to complete a transaction and using click-to-call for all phone numbers.
Consumers look for local information on their phones all the time, from locating the nearest florist to finding an open chemist. Include functionality that helps people find and reach you. Feature your address or store locator on the landing page, and include maps and directions.
Ideally, your mobile site should work across all mobile devices and all handset orientations. Find alternatives to Flash, which doesn’t work on all devices, and consider HTML5 for interactivity and animation. Remember to adapt your site for both vertical and horizontal orientations too.
Case study: Kiddicare
The UK’s top online nursery supplier responded to customer demand for a mobile website and saw sales through the channel rocketing
Kiddicare – the UK’s largest online nursery and baby supplier – puts its success down to a strong commitment to customers, so when the company noticed rising mobile visitor numbers, it knew that action needed to be taken.
“We were seeing an increase in traffic coming from mobile devices and we knew that consumers were getting a poor experience from it,” says Simon Harrow, Kiddicare technology officer.
With mobile representing approximately 7% of website traffic, it was important to optimise the mobile experience to maximise conversions.
Harrowrealised the need was particularly urgent because Kiddicare’s desktop site utilises Flash, which doesn’t work on all mobiles. From concept to launch, the build took seven weeks and was entirely accomplished in-house. What was the process?
“We went through the desktop site user journey and took out the elements that were important to our customers, such as price, stock numbers, reviews and video,” he says. “We tried to move as much of the functionality as possible to mobile. We removed anything that would weigh the pages down unnecessarily.”
We tried to move as much of the desktop functionality as possible to mobile, removing anything that would weigh the pages down
The project revealed further best practices. “The ‘Add to Basket’ button has to be within reach of a thumb,” says Harrow. “Having more pages and clicks is not necessarily a problem in mobile, where on desktop you may want to keep clicks to a minimum.”
He also recommends large buttons to accommodate clumsy thumbs, as well as pages that resize automatically according to device orientation.
For Kiddicare, a major priority was enabling the customer’s shopping basket to transfer seamlessly between channels so users have exactly the same experience across all devices. “Our mobile solution is very clean and neat. When you visit by mobile you visit the full Kiddicare website rendered to a mobile device user interface,” Harrow says.
Kiddicare’s mobile traffic has increased 36% since March 2011, but that’s not the only reason it is pleased to have a mobile site. “Between barcode scanning apps and our website search feature, the site turns all of our competitors’ stores into a showroom for us,” says Harrow.
“Because baby goods are a considered purchase and people still like to see, feel and touch items, this gives us a chance to acquire sales from people checking things in other retail brands’ stores and finding that we are typically cheaper and have a price-match guarantee plus next day delivery,” he adds.
Already, 6% of Kiddicare’s business is conducted via mobile. “We think by the end of next year, 20% of our business will be through mobile,” Harrow explains.
So what does he say are the benefits of optimising for a mobile audience? “We don’t believe consumers differentiate between devices,” he says. “Customers are touching your brand; they expect the same experience and the same behaviour. If we’re able to sell cots, car seats and other highly considered purchases through mobile, we believe you can sell anything.”
For Kiddicare, this realisation came not a second too soon. “We had our first mobile order four minutes after going live,” recalls Harrow. “Our technical team was still testing the website.”