Understanding Mobile First UX Design

More than ever, the internet is becoming something we carry with us in our pockets, not just something we have when we are at our desks. With over 1.2 billion mobile web users worldwide, it shouldn’t come as a shock to you that designers are taking a mobile-first approach to ensure that websites function perfectly on mobile. For those of you who monitor your analytics, you’ll have probably already noticed an increase in the number of visitors viewing your website on a mobile device but if not you need to check how users are seeing your website.

What is Mobile-First Design?

For years, web designers and their clients have started projects with the focus on the main desktop version first, leaving mobile design as a secondary part of the process for further down the line. Even when considering responsive design, most people will start with the ‘full size’ version of the website first and then work their way down to mobile. This results in a poor user experience and websites that don’t really work well on mobile.

Mobile-first, as the name suggests, aims to get web designers and their clients to focus their attention on the mobile version of the website first or at least alongside the design of their main full-size website. This is due to the massive growing trend of mobile users and the need for the best user experience on mobile devices.

Understand why visitors are using mobile

We’ve said it before but, identifying and understanding your target audience is entirely key to fully engaging and converting visitors to your website. This is very true in a mobile-first age. The visitors to your website coming from desktop and mobile are going to have very different reasons for browsing your website and it’s important you understand why so that you can offer them the best experience possible and make them more likely to enquire about your service or buy your products.

The first step towards this is to ensure that you aren’t making assumptions about why your visitors are on mobile. We hear it all the time from clients saying that they believe their customers are out and about whilst on their phones but that’s not likely true. A recent study from Google showed that around 60% of mobile users are actually browsing the internet whilst in their own homes.

So it’s important that you take the time to understand why your website visitors are visiting the mobile version of your site rather than the desktop version. This will involve a bit of time and research going through your Google analytics and doing other research trying to find out as much as you can about the motivations of your users and design your site based on that.

Really Focus Your Content

Whilst user-focused content has been important for a while, it’s now more important than ever. With small screen sizes and impatient users, you need to ensure that the content you present to your site visitors meets their needs and answers their questions quickly and efficiently. Mobile users don’t want to scroll through lines and lines of text to find what they are looking for.

Make the most important content easy to reach by placing it higher on the page than other less relevant content. You should also try to minimise clutter on these pages reducing the number of images and fancy gimmicks on the page. At the end of the day, the main goal is for the user to have an enjoyable experience, get the information they want and ultimately enquire.

Simplify the navigation and remember touch

Unlike desktop browsing where you can make very precise clicks and navigation around the website, mobile browsing relies on touch navigation meaning there is a greater need for elements on the page to be large enough to click without overlapping.

For this and many other reasons, traditional desktop menus don’t work on mobile. On mobile these menus take up too much space on the screen and you can’t show dropdown menus when you hover. In order to make things simple for your website visitors, try adding in an icon at the top of the screen used to display the menu on touch or a drop down accordion style menu.

Incorporate Google AMP

Google has indicated a mobile first approach to indexing and ranking websites in search results with the development and implementation of Accelerated Mobile Pages (AMP). The Accelerated Mobile Pages Project, as the name suggests, aims to improve the loading time of websites on mobile devices by loading an optimised version of the website when found on Google whilst browsing on mobile.

Incorporating Google AMP into your website is a really great way of ensuring that your website performs in the best possible way for users searching for your product or service on mobile.

In order to drive your online marketing performance on both mobile and desktop, you need to use this mobile first approach on your next website. Looking at your analytics data can help you identify patterns for a clear understanding of a customer’s intent, behaviour and actions. We take a mobile first approach with all of the websites we build as the user experience is the most important part of building a website that converts and engages. If you are ready to discuss your new mobile first website, get in touch here or send us a message using the blue live chat feature in the bottom right of the screen.