Mobile optimised website shown on smartphone

The benefits of designing for mobile

The holy grail for many business website owners is to rank well in Google for their key search terms – that is, show up at the top of the Google search results when someone searches for your target business.

The reality, of course, is that it’s a damned sight easier said than done – after all, we’ve all got competition out there, and there can only be one No.1 at any given time.

It’s the stuff that online business owners, web designers and search engine optimisers can, frankly, lose a little bit of sleep over.

Well, recently, Google has given some pretty clear indications about the importance of one particular factor – designing your website with mobile visitors in mind.

The mobile challenge

We’ve all been there: you’ve Googled something on your iPhone and when you click through to the website you’re faced with miniscule text, links you couldn’t possibly click (even if you could see them) and generally zooming and scrolling every which way just to try to find what you’re looking for.

All in all, not a great experience for the mobile user – and it’s this type of experience that Google is trying to discourage.

The situation I’ve just described is that of a website that hasn’t been optimised for mobile – i.e. your mobile device is trying to display the web page in exactly the same way as you’d see it on a large, desktop screen. And, of course, therein lies the problem – because desktop/laptop screens are almost exclusively a wide, ‘landscape’ style format. Mobiles, by their very design, are small and, usually, used in ‘portrait’ view.

The result? The only option that the mobile browser has is to try to cram all of that widescreen content into the space available.

Perhaps ironically, a lot of business website owners would think that’s a good thing – “look…”, they’d say, “it looks the same on a mobile as it does on a big screen – great”. And in a way, I kind of see the point: if they’d spent a lot of time and effort getting their website to look a certain way, then of course it’s natural to want to see that great design on all devices.

But that highlights two issues:

Firstly, you’re NOT seeing that design, are you. You’re seeing the equivalent of a poster being condensed onto a postage stamp. All of the nuances will be lost, and your website visitors will have a genuine struggle to make head or tail of the actual content. And that’s what’s really important, right?

And secondly, it makes the point that your design is clearly prioritising the importance of the ‘desktop’ view – the ‘design for big screens and worry about mobile later’ approach. Now, that’s not necessarily a bad thing, provided it’s a conscious decision. If you’ve done your homework, you know your target market, and have come to the conclusion that people will generally come to your site using a desktop device, then it might well be perfectly valid to prioritise desktop users. But by the same token, you really can’t afford to alienate those using mobile devices.

The Google position

So that, in a kinda roundabout way, brings me to the real issue here:

Google wants their search engine to provide useful search results, simple as. 

So, if someone is doing a Google search using a mobile device, what is the point of them seeing a list of search results whose websites can’t properly be viewed on that mobile device? It doesn’t help the user find what they want and, in turn, that diminishes the value of the search engine.

For some time, Google has been making the point that web content that is optimised for mobile devices is a good thing – it can positively affect your search engine rankings. You can see from official Google press releases (such as here and here) that there is a clear push towards promoting mobile-friendly sites in mobile search results.

But many people believe it actually goes further than that – with non-optimised sites being positively penalised in the search rankings. Maybe that’s just a semantic difference – after all, it still has the same effect of pushing non-mobile-optimised sites down the search results – but its importance can’t be ignored.
Mobile search results showing 'mobile friendly' tag

How do I tell if I’m mobile friendly?

That, at least, is pretty straightforward.

Firstly, if you actually go ahead and do a Google search for your website, take a close look at the ‘SERP’ (Search Engine Results Page) – notice the small ‘mobile-friendly’ tag beneath the website address? Note: you’ll only see this if you actually do your search on a mobile device – don’t expect to see it on a desktop.

Secondly, there are a couple of handy tools provided by Google for the purposes of checking your sites and pages:

The easiest method is to make your way over to Google’s Mobile Friendly Test Tool – simply enter the address of your website, and let Google check it out for you. If all’s good, you’ll see something like the below:

Google's Mobile Friendly Test Tool result page for a mobile optimised site

The other way is by using your Google Search Console account (formerly Google Webmaster Tools) – via the ‘Search Traffic’ – ‘Mobile Useability’ options – but you will need to have your site set up and verified in the Search Console before you’ll have access to that.

So, what makes a page mobile friendly?

Well that, of course, is the big question. We have plenty of guidance from Google but many of the factors are pretty common sense when you think about it.

The main point is to make the website usable for mobile visitors. That means making sure that content is easily readable on small devices, and ensuring that common tasks can be easily performed.

What does that mean? Well, fundamentally, you want to make sure that textual content is displayed at an appropriate font size, that navigation items are clearly visible and easily accessible, and that links are clearly highlighted and sufficiently separated from each other so that users of touch-enabled devices can actually use them. And images – whilst a lot of us are lucky enough to have good mobile 4G coverage, not everyone is – so the use of large, non-optimised images that take forever to download is a definite no-no.

The long and short of it is that your design should be responsive – that is, it should adapt to suit the device that is being used to view the page. Achieving this is, inevitably, a technical process. If you are creating your own website, there are many good responsive templates and themes available which will have a degree of responsive design built into them.

On the other hand, if you’re working with a web designer, you need to make sure that responsive design is right up there on your list of requirements.