If you wish to acquire more new leads and customers through mobile apps or provide an excellent user experience, then you should be running regular mobile usability testing – a process of optimising every web pages for mobile devices.

These days, more people are using their mobile devices to browse websites. According to Google, mobile visitors often re-visit a mobile-friendly website than other websites that aren’t optimised for mobiles. The reason is quite simple: Mobile-friendly websites offer an amazing user experience for mobile users (your potential customers). And, since, according to a recent study, mobile users are often more likely to make a purchase on a mobile device, you can rake in an enormous amount of profits (more sales) through your mobile apps by simply tweaking few simple things.

According to Mobiforge’s report, the user experience is even more crucial on mobile devices as it is one of the key factors that lead to “higher conversion rates.” Mobile usability testing is important not only because it helps remove mobile usability errors, but it also allows your visitors (potential customers) quickly and easily find what they’re looking for on your website. No wonder why so many businesses are leveraging on mobile devices and apps to double and even triple their website traffic, leads, and sales. In the UK alone, Amazon’s audience growth is hovering at an incredible 87% rate.

You can make these six easy and simple changes on your website right now to pass the mobile usability test and deliver an incredible user experience to your mobile users to boost your bottom lines, literally overnight:

In the UK alone, Amazon’s audience growth is hovering at an incredible 87% rate. (Image source: UK Digital Future in Focus 2013)

Tip #1: Include a viewport Meta tag

The viewport is a Meta tag that contains data such as the mobile device width and initial scale, which your browser rendering engine can utilise to display the website content properly on all mobile devices. This piece of code is even more important when you’re building multi-device experience.

(Image Source: Web Designer Wall)

There are several configurations you can include in your viewport Metadata, but here’s what you can use inside the head of your web pages. (You only need to include this piece of code once):

(Image source: WMG)

Tip #2: Use ONE column for your website layout

Well-established brands go an extra mile to make their content stand out, especially after optimising their sites for mobile usability. They remove all elements that get in a way between their users and their content.

One such distraction is using more than one column on a mobile site. According to this post, using more than the single column can actually kill your conversions.

(Using more than one column on a mobile site can actually kill your conversions. Image source: Specky Boy)

Check out Facebook page on your mobile. All their three versions of mobile sites use a single column.

Before you build a mobile website, ask yourself: what do I want to achieve by making my website mobile-friendly?

Take Hyundai, example. When they build their mobile site, they only had ONE goal – i.e. to allow their users to quickly check out their new vehicles.

(Image source: Neil Patel)

Take a look at their mobile site. There are no sidebar or navigation menus on the top – only one picture of their latest model, and that’s all:

Once you’ve determined your goal, also consider the screen and text size when building a mobile site.

Tip #3: Use simple designs

Mobile users often prefer simple, easy-to-browse websites so that they can quickly find what they’re looking for.
Imagine browsing a web page with ads all over the place – on top of the page, sidebar, in the content body, and pop-up ads that show up randomly.

Not only these ads and heavy graphics make things complicated, but they will also make your web pages load slowly on mobile devices.

Mobile users aren’t looking for a fancy website with plenty of graphic elements and cool ads. They want instant delivery of the content they are searching. Using simple mobile designs will help you deliver your visitors the content they desire the most, which helps to keep them engaged on your website longer.

Since mobile users have short attention spans, having a simple and easy to browse website theme can actually be more valuable than having a complex and elaborate theme.

Focus on using simple and easy to browse mobile theme for maximum user retention. (Image source: Digget)

Tip #4: Take care of your font size and buttons

You have to be really careful about which font and button size you’ll use on your mobile websites. Why? Because using the ‘right’ font size for text and buttons can make a huge difference between your visitors reading each word on your page and readers struggling to read what’s on the page and having no clue, leaving your website, once and for all.

Don’t take the font size and buttons for granted.

For font size, I’d highly recommend that you stick to 14px. This will help your mobile users easily and quickly read your content, without having to “zoom in.” The only time you should use smaller font size – i.e. 12px – is for forms and labels.

Use 14px for font size as it will help your mobile users easily and quickly read your content, without having to “zoom in.” (Image source: ThemeCo)

As for buttons, the bigger and clearer it is, the better – it will prevent your mobile users accidently hitting on the ‘wrong’ button or missing it. No wonder why Apple uses button sizes that are at least 44px by 44px in size. The answer is simple: by using bigger and easy to click buttons, they want to offer incredible user experience to their mobile users as well as double their conversions on their store.

Bigger CTA buttons result in a better click through rates. (Image source: Hootsuite)

Tip #5: If it’s possible, use different website versions for your mobile users.

When you have several versions of your website, properly optimised to run on mobile devices, it can save you a lot of money, time, and efforts down the line. Tefal is a good example of doing this:

When it comes to marketing, it’s always a great idea to offer useful alternatives that will ultimately boost conversion rate. (Image source: GroupeSEB)

It allows your people to enjoy an awesome user experience as well as quickly choose the best solution for them.

To put your mobile users first, you can design several designs for your website, or even design a new mobile app.

Samsung Galaxy and iPhone aren’t the only smartphones available in the market today. There are a whole bunch of other models, too. With all these different mobile sets in the market, you also need to adjust your site for various screen size and levels of processing power.

These days, it’s common to find mobile phones with resolutions between 128 by 160 pixels to 620 by 1200.

On top of that, many phones aren’t designed to load a full website, which most advanced smartphones easily do. (Image source: Googleget.)

Tip #6: Bypass Flash

Okay, here’s why you should not be using Flash on your mobile websites.

Last summer, conducted a benchmark test of Flash versus HTML5 on several popular smartphones and the occurrence of dropped frames:

Flash aren’t supported on many mobile devices, including iPhone, iPad, and iPad Touch. Just imagine losing potential customers who use any of these iOS devices. And, even if your user’s mobile device supported it, it can often be difficult for them to view it. All these are HUGE problems that prevent you delivering amazing user experience and boost your bottom lines.

Apart from usability and conversion issues, Flash are also not so good for search engine optimisation (SEO), as Google cannot index it. Result? Your search engine positions may not take over and take you to the 1st page of Google.

And if that’s not enough to ditch Flash forever on your mobile websites, listen to this fact: Flash is too much expensive to develop and maintain, unlike HTML5 and CSS3. Just to make few simple changes, it might take you hours to do with Flash, while it only takes few minutes with HTML5 and CSS3.

So, if you have been using Flash on your mobile theme, remove them all. It doesn’t work well on mobile devices. Rather, switch to technologies such as HTML5 and CSS3.

Flash is dead. It doesn’t work well on mobile phones. Instead use HTML5 and CSS3. (Image source: AmazonAWS)

Conclusion

Be a smart marketer by thinking about your mobile users. Don’t listen to what others are saying. The rules for mobile usability testing and usability application aren’t set in stone.

If you’re short on budget, use pre-designed templates available on the web or create a mobile app. Don’t consider it as a cost. Instead, be a smart investor to make your brand shine through mobile-friendly and easy to use the site.

Maybe, you already have a mobile site, but it isn’t generating enough conversions as you’d expected. Never panic. The simple fact that your site is already mobile-friendly means you’re a million miles ahead of your competitions right now – most B2C and B2B marketers haven’t covered this step so far.

I hope this ultimate guide on mobile usability helped you learn one of two things. But, remember this – the web is extremely dynamic. What is popular today might crackle out in few months’ time.

So, get your site ready for the mobile technology. Right now, your customers are on mobile devices, so you’ll have to take few steps to be where they are, too.

Over to you: Did you take any other steps other than what I shared her to make your mobile site more user-friendly? Please share your ideas in the comment section below.