Making your small business website as mobile-friendly as possible

Marketing expert Mark Asquith of DMSQD discusses how to plan for adapting your website to the array of devices on the market.

Part two of this miniseries focusses on helping you decide just how to plan for adapting your website to the array of devices on the market.

Part one is How a small business can optimise a website for mobile and tablet users.

I won’t be going into any coding or design practices herein, instead I’ll be focussing on helping along the process from the perspective of someone working with, not in, an agency. In addition, this covers the fundamentals; your website may in fact need much less or much more planning than the steps covered below.

Part one of this miniseries focussed upon the different types of solutions available to you when considering the mobile web. Some of those come with unique issues and considerations, however there are a certain set of principles to bear in mind regardless of the mobile solution.

The ultimate goal is to make the experience of browsing your website on a smaller device as pleasurable as possible. Imagine walking into a shop only to find you had to jump a hurdle and then complete an IQ test just to get to the products; you’d think twice about going back, wouldn’t you?

Similarly, your website cannot put barriers in place for its users: pinching and zooming; difficult, poorly implemented drop down menus; large, slow to load images and a lack of direction throughout the site are amongst the most common issues that we, as users, come across.

Putting users first

In order to circumvent these and other issues, there are a few questions that you can ask, preferably in a workshop with your digital agency:

1. What are my users likely to need from me on a mobile device? Is it simply contact information and how to find me, or do they wish to browse my website as they would on a desktop?

2. What are my key website objectives and how do they map to these smaller screens? Are they as important when someone wants to quickly find my telephone number or will they present a barrier to this?

3. How will my users navigate the site, and how can I make this intuitive for them?

Answers to these core questions will help to formulate your mobile website whilst ensuring you’re keeping the user’s experience as smooth as possible.

Your digital agency will work with you on wireframes for the desktop version of your website; based on those you can start to break down the website into its component pieces and begin to visualise how it could be laid out on smaller screens.

This process should be undertaken equipped with the answers to the questions posed above, along with a planned hierarchy (site map) that shows all of the pages of your site in a clear diagram.

Starting with the desktop wireframe, you’re able to decide where your website will need to break:

– using a responsive website, a ‘break’ is the point at which your website layout is re-formatted to fit a particular screen size

– when implementing a mobile specific website, a ‘break’ is simply the point at which that mobile  site ‘kicks in’, thereby replacing your desktop site on a specific size of device and those smaller than it.

As an example, a responsive website may have ‘break points’ that take effect when a desktop is detected, a tablet is detected and a smartphone is detected; rendering three slightly different website formats using one code base.

A mobile-specific website may kick in when a user visits on a smartphone, with tablet users simply seeing the desktop version of your website.

There is no right or wrong here, instead it is simply still about crafting that experience for your users and optimising that experience for users on different devices.

Once the wireframe mapping process has been discussed and begins to take shape, you will start to see the way that your website will appear on each of these devices, without content or graphic distractions. This process allows you to objectively analyse how your content is represented across each device, and how any calls to action that you need to integrate can be easily factored in, without becoming detrimental to the multi-device experience.

Getting to the point

As your website starts to take shape in this ‘blueprint’ form, there are two other factors to consider:

– content

– navigation

For the most part, and unless you have a very good reason not to, you should put your content first.

And, by first I don’t mean in any order, I simply mean that your website should be built around your content first: sorry, but no one wants to see your logo take up their screen, nor do they want to see pointless stock photographs.

On smartphones especially, screen space is at a premium. This forces users into a rapid judgement process: can I see what I want and can I how to find what I want?

If the answer to any of these questions is no, or even a maybe that forces too much thought, your users may bounce off your website to another, perhaps competitor website that is easier to navigate or digest.

Building from a content-first perspective, your navigation should continue to be a tool and not an item of content. Menu systems are simply a means to an end, and as such need to be simple and intuitive to use whilst not becoming a hindrance when not required.

While there are plenty of ways to implement multi-device navigation systems, some of the most popular continue to grow in abundance.

Tame, learn and adapt

The mobile web is an ever-expanding beast that your website needs to become friendly with. It isn’t going away and it isn’t the future, it is the now.

By asking yourself objective questions about your users and your business goals; by adopting an approach that puts high quality content first and by considering how your users get around your site through careful planning, you can turn the mobile explosion to your advantage and give your users a smooth, simple and effective experience that is ultimately device neutral.

Further reading on small business websites

Related Topics

Social Media

Leave a comment