The Google Mobile algorithm rolled out on the 21st April, and we’ve already covered how important this change is, (or isn’t), depending on your business, but if it is important to your business, you need to know what to do to become ‘Mobile Friendly’.
Basically, no matter what business you are in, you should be providing a mobile experience for users. This is not just because Google likes it, but because users are a fickle bunch, and if they have to faff about trying to navigate your site on a smartphone when one of your competitors can offer a better experience, chances are they’ll sack you off and convert with them instead.
Once you’ve confirmed whether or not you need a mobile-friendly site, there are some important considerations to make before you commit to designing a new website. There is no point in putting together a site that is half-baked or cobbled together to make it vaguely OK for mobile. If you are going to invest in doing it – do it right.
We’d recommend getting a developer involved, as even responsive themes, like those available in WordPress, may not cut the mustard if you decide that you want to tweak the layout. Then you end up with elements kicking about all over the shop – which looks totes grim.
The main things that you are looking to improve are:
As part of these three core areas, you’ll need to think about:
Can you read the font without tapping or zooming? No? Neither can they. Do you have to scroll horizontally to see all the content? That’s not ideal, is it?
‘Cause Flash won’t work on mobile, bro.
No dialling wand required
Cater for those with more voluptuous fingers (48 dp (density-independent pixels) is the minimum recommended touch target, with at least 8 dp between targets).
If you insist on using a pop up, make sure the touch target for the close button is big enough (this not being the case on the Complex mobile site drove me mad this week – I did not want to watch a trailer for ‘Unfriended’, but I couldn’t close it, so I ended up bailing).
Equally, don’t use hover-over or mouse-overs or mega menu navigation that you have to be lightning quick to click on the right link. This is well annoying.
Don’t make users play a guessing game
Make sure key elements are the same as on your desktop site. Make sure everything is clearly labelled, and provide quick access to all the functions they’ll expect on your site. If you’re an ecommerce site, that means things like product search and the shopping cart (and mobile-friendly tools like a store locator) should be really, really obvious.
Keep it simple
How much fun is it getting through a great mobile experience only to be sent to a checkout where you need to provide a gazillion details before you can pay? It’s 0% fun. Make it as simple as humanly possible to fill in forms on a mobile device.
Oh my Lord, will it ever load?
If a user is searching on a mobile, it could be because they are pressed for time, or like me, are too lazy to walk across the room to get my laptop. Users expect to be served content almost immediately, no matter what device they are on. If your site doesn’t load quickly on a mobile device, I’ll click the back button and try elsewhere – even if my laptop is right next to me – so will lots of other users.
You also need to bear in mind that the data connection on a mobile device may be slower, so make it as fast as you possibly can. Google likes a speedy site, and research has shown that sites with a faster page load speed boosts visitor engagement, retention and conversions.
Here are a few bits and bobs that can help you to identify where you need to improve the mobile experience for users:
The Google mobile usability error message
You might have already seen one of those lovely messages with a big red exclamation mark proclaiming that you must fix critical mobile usability issues in Google Webmaster Tools. This is a good place to start looking for what Google expects you to fix. You can also navigate to this under ‘Search Traffic’ in GWT.
A nice guide from Google
Google have provided a guide that helps you to learn the fundamentals of responsive design. Pretty good if budgets are limited, but you have some understanding of code.
Pop a URL into the Google Mobile Testing tool and you’ll get a lovely list of recommendations. It can even identify what your site is built in, and will point you towards the correct guide.
See how it looks on devices of all sizes
If you think that your site is responsive, but Google says nay, it may be worth checking how it looks in different screen resolutions. I’ve found that the web developer tool which can be used in a Chrome browser is pretty comprehensive – just press Ctrl + Shift + I to open the developer tools window, and then click the teeny mobile image at the top. You can then see how your site looks on loads of popular devices.
For more help and advice on making the most of mobile, get in touch with Browser Media today.