If you haven’t got a responsive website, m. site or app, you need to be working on one. Keep these best practice tips for mobile navigation in mind during design and you’re users will love you for it.
Why do I need a mobile site?
Today, we work and play on our desktops. But more and more, we use our mobile phones to browse the internet whilst out shopping, on the go, or during our morning coffee break. Google reports that by the end of 2014 more than half of website visits will come from mobile devices and at Sift Media, our mobile traffic is growing month on month.
Not only do we use our mobiles more, we use them for specific tasks; checking our bank balances, finding contact numbers or looking for a location. With 74% of users more likely to return to a mobile friendly site, it’s vital that they’re able to get to what they want as swiftly and easily as possible. Otherwise, we’re quickly turned off.
Currently, 37% of users think mobile sites are difficult to navigate. So, whether you’re designing your first m. site or re-designing the original, knowing what information your target audience wants will ensure you design the most user-friendly site you can, increasing both pageviews and dwell time.
So how can I make my mobile site the best it can be?
Limit the layers
- Find out what your key users want to access and ensure it takes them as few clicks as possible to get there. 3G slows load speed so the less clicks the more likely users are to stay. 3 levels at maximum are recommended.
Nested navigation
- We’ve become used to the 3 line menu button. Not only does this free up space by using a drop down, but position it at the top of the page and it’s easy to find.
- Check out the examples below:
Clarity of options
- Make it obvious where each click will take a user, placing specific importance on copywriting. Using simple language like the ad below (left) is much easier to understand than the overcomplicated (below right…what is ‘Gallant Love’??).
Icons verses lists
- Using icons is a great way to bring in design aesthetics whilst maintaining a clear menu.
- It also makes for easier thumb clicks.
Obey the 44×44 rule
- 44x44px calls to action should accommodate fat thumbs and prevents the frustration of continually clicking on the wrong place
A few other best practice tips
- Work with the device by letting visitors use their phone’s ‘back’ button, automatically calling a number when clicked on and opening up GPS when locating.
- Avoiding zooming with single column layouts
- Minimise text entry by storing details and using pins, not passwords
- One-time banners for first time users help explain how to use the site.
What are my next moves?
If you don’t already have an m. site, responsive site or mobile app, you need to get one. Mobile device usage is only set to grow in the next two years and with users bouncing off non-mobile sites as quickly as the page has loaded, it is imperative that digital goes mobile. Get designing and don’t forget these key takeaways; keep content minimal, utilise inbuilt functionality of the device and ensure you’re designing for both touchscreen and non-touchscreen users. Simplicity is key. Good luck!