Designing websites for a mobile world

By 7th September 2021News

70% of website traffic comes from mobile devices, and Google now uses a mobile-first indexing algorithm when displaying its search results. But how do you design a website that works on all devices, as well as a ‘traditional’ desktop? Read our top tips below…

What is a mobile-friendly website?

Simply put, a site that is designed and optimised for hand-held devices such as smartphones and tablets. A responsive site is one that adapts to the screen size it’s viewed on, giving the viewer an optimum experience however they’re viewing. If you’ve logged onto a non-responsive site on your mobile, you’ll know how annoying it can be to have to zoom in and out on content and scroll around the screen to find the button you’re looking for – in a lot of cases, you’d probably give up and find a site that works better for you. According to Google, 59 percent of shoppers say that being able to shop on their mobile devices is important when deciding which retailer or brand to buy from.

How to optimise your mobile website experience:

1

Use large buttons

Buttons need to be large enough for users to tap without having to zoom in, and there needs to be enough space around each button or link so that users don’t accidentally click the wrong link.
2

Make text large enough to read

It might sound obvious, but users will be put off your site if they must zoom or scroll left/right to read the text on your website. Make sure that it is large enough on all devices and fills the screen appropriately.
3

Create a simple menu structure

By now, most users are used to seeing a ‘hamburger’ or accordion style menu, where they click a small button on your site to expand a simple list of pages. Don’t overcomplicate your navigation structure and, again, use large buttons that are easily clickable on a mobile.
4

Create forms that work

No one wants to spend a lot of time filling in excessive amounts of form fields on your site and will likely drop off partway through. Intuitive forms and forms that use pre-formatted and auto-fill features can be a great way of speeding up the process. Again, ensure the fields are large enough to complete without zooming.
5

Avoid pop-ups

The majority of content pop-ups really don’t work on mobile devices – they can block useful content and the cancel buttons are often really difficult to press. In fact, Google now penalises websites that serve specific types of pop-ups on mobile devices. Best avoided – integrate the information into your main page structure instead. If the pop-up mentions an offer or promo code, you could add a small banner to the top of your page, or if you are looking for newsletter sign-ups, try a simple form field after your main content on each page.
6

Give the user opportunities for communication

Don’t make it difficult for your customers to contact you; it could put them off making a purchase or finding out more about your services. As well as a good contact page, try adding a ‘live chat’ feature (this could be delivered via a chatbot if you do not have the staffing resource to offer it) and clear instructions on how visitors can contact you, plus be open and honest (and stick to!) about response times.

With a wealth of experience when it comes to designing and building websites that work, get in touch with OWB today and we’ll help you achieve your site goals.