Few can argue the need to serve mobile users, yet many business websites still fail to make allowances for this ever increasing share of web users. Even with 2014 being predicated by many as the year where mobile web use overtakes desktop, the perceived time and cost of making a website mobile friendly is resulting in many businesses turning away their mobile customers.
A complete overhaul with mobile users at the forefront may well be the best solution for your business. Sometimes though circumstances don’t allow for that and a more modest approach needs to be taken. The good news is that a single day spent making your website more mobile friendly can make a real, measurable difference.
Look before you leap
Before doing anything look at the numbers. Google Analytics gives you a nice clear indication of the proportion of “Mobile” and “Tablet” on your website. [ Google Analytics > Audience > Mobile ]
That first report gives you a breakdown of the number of visits attributed to each type of device. You can also easily view the bounce rates for each type of device, which gives you an immediate indication of where to focus your efforts. More insight still can be gained by looking at how those proportions differ if you view goal conversion rate for each device category.>
With just 30 seconds of analysis we can see that, on this particular site, tablet traffic is not performing too badly, but those users on mobile devices are significantly less likely to convert. We also know that those mobile users make up 23% of visits, so there are real gains to be had from improving those numbers.
If you view the devices report you can also see what the most popular devices are for each type. In the case of this site it was largely modern touchscreen smartphones. So, what can we do (without building a new website) to serve those users better?
What we’re not going to do
Dedicated mobile sites and responsive design are often the best answer, but applying that to a complex site is well outside our self-imposed one day limit. We could consider a paid service that scraped our website content to produce a mobile version, but this is a dynamic site and we want conversions not just static pages.
Instead we’re going to focus on quick, practical solutions that get results.
If your users are truly mobile, as opposed to using mobile devices on their regular WiFi, then speed is going to be a huge concern. Study after study has proven the link between load times and conversion rates across all types of device. Speed becomes even more critical for mobile users who might be struggling on 3G or worse and likely feel every second of load time several times over.
It takes time and investment to really drive down load and render times, but significant gains can often be achieved easily. Work through the most popular pages for mobile users and cut out:
- Large images and other media
- Excess CSS
- Unnecessary “flourishes” that add little to the user experience
CDN / Caching services like Cloudflare offer a cheap (or even free) and very quick way to reduce load times further on most sites and can be set up in next to no time. Server side technologies such as pagespeed and gzip are options to ask your developers about, and again bring large benefits quickly.
Even if you only have access to the CMS then compressing images through services likeSmush.it can start slimming down overweight images and making mobile users happier.
Small screen woes
If you are not serving a different layout for users of mobile devices, then you can consider that most small screen users will be using pinch and zoom as their primary way to find their way around your pages. You can help these users by making key parts of the page more visible when zoomed out.
Using size and contrast to ensure that section headings, navigation and those key calls to action are visible when zoomed out can make your pages significantly easier to use for mobile users.
Keeping copy short and to the point usually has a positive effect across all devices, but more so on smaller screens.
Most mobile users navigate using touch screens rather than mouse which introduces a few particular considerations.
Fingers, being fatter than mouse pointers, benefit from larger navigation. Oversized buttons, large text links and a bit of extra space around each reduce accidental clicks and with it, the number of frustrated users exiting your website early.
Touch interfaces also do not have a state equivalent to “hover”, so give some extra attention to how menus and other interface items work in practice for touch-screen users.
Also consider (and test) drop down / fly out menus for how much space they require when activated. Users frustrated by the menu item they want flying off the side of the screen won’t hang around long to find work-arounds.
Despite the range of input methods now available, forms still turn mobile users away in droves. It’s often not possible to remove form inputs completely, as these forms are frequently at the point of conversion, but we can reduce the pain involved in using them.
- Remove unnecessary forms
- Reduce the number of fields used to the absolute minimum
- Use helpers, such as date pickers, where possible.
- Test all those helpers on multiple devices
- Offer shortcuts such as postcode lookups to reduce text inputs
- Remember the details of regular visitors
- Utilise login systems such as as those provided by Facebook or Google to handle sign up and login routines
Focusing on these four areas can improve things for your mobile users significantly in a very short time. These tips and fixes won’t result in a site that performs as well as a site planned and developed for mobile first, but they are cheap fixes capable of bringing a significant return.
With mobile web use continuing to grow, you might (sensibly) be considering a more involved mobile strategy longer term. Unless you have a new site nearing completion, small , practical changes like those mentioned above are still likely to pay dividends. What’s more, the sooner you start implementing them the more return they will bring.