Understanding the importance of a mobile-first approach.

  • By
    Yonette de Ru
    January 27, 2019
    July 28, 2021

Think about the last few websites you visited. There’s a high probability that a good number ofthese visits were made using a mobile device. If this rings true, you’re definitely not alone (anddon’t worry - we’re not here to judge you on your possible mobile phone addiction).

Studies have found that more and more consumers are steadily shifting to viewing a large portion of content online. As mobile usage increases on a global scale, it makes sense that tendencies to

consume information through mobile formats would also increase. This leaves designers with

the challenging task of making websites look good on both mobile and desktop. Naturally, as a

UX designer a whole slew of questions come up: How should websites be structured? Are long

scrolls the new norm? Are F shape and Z shape design patterns for reading content no longer

relevant? Is above fold content no longer important? Should the website be responsive or

mobile-friendly? Keeping these points in mind, there are a number of things you should consider

when designing a website.

Mobile First Shift

Naturally, UX design trends shift with user’s preferences. Now that a larger portion of content is

being consumed online, it makes sense that design trends have shifted towards a mobile-first

approach. What mobile first means is: designing for mobile viewing before desktop viewing. The

mobile experience here is the priority and design decisions are made in a way that benefits the

mobile view of a website. A mobile first approach is so prominent that as of March 2018, Google

has rolled out mobile-first indexing. This means sites that are mobile-friendly perform better in

mobile search results. This is an important thing to consider during the design process because

at the end of the day, people need to be exposed to a website to appreciate its design! Users

are also highly unlikely to recommend a business with a poorly designed mobile site.

What this means for designers

This means that typical design principles may no longer apply in this day and age. Even though

typically designers struggled to choose between F and Z shaped page designs, these grids may

no longer apply when it comes to a mobile-first approach.

As you can see, the image above illustrates an F shape page design. Although this design may

definitely be more successful than a Z shaped design on a mobile medium, it still may not have

the same effect as it would on a desktop.

The same goes for the Z shape design illustrated above. Although studies have shown the

benefits of structuring designs this way, these findings go out the door when it comes to mobile


Similarly, the above-fold content design approach is a little less applicable when it comes to

mobile designs.

It’s tricky having to rethink how websites should be structured in order to look good on all

mediums but most importantly, it needs to be highly usable!

How should websites be structured?

The main deciding factor for this is: what is the purpose of the website? What is a customer’s

objective when visiting the site? These questions should give you a clear indication of how a site

should be designed. The most important things to consider here are: 1) who are the

stakeholders and what are their intentions for the site? 2) who is the target audience and what is

their main purpose when reading the site? Sure, long scrolls are typically better on mobile

devices but that depends on the type of website and its function.

Solution: Responsive Web Design and Benefits

Responsive web design allows websites to look and function well on a number of different

devices and screen sizes. In other words, responsive websites adjust according to your device!

This is achieved through a mixture of design and code. This is an extremely beneficial way to

tackle the shift to mobile heavy web consumption.

As seen in the illustration above, benefits of responsive web design include:


As more and more people shift to being heavily reliant on their phones for web use, it’s increasingly important to understand the importance of a mobile-first approach.

On a similar note, it is also important to understand the instances in which it might be beneficial to

stray from a mobile-first approach. The main objective of UX design is to figure out how to best enable users to navigate and get the most out of a website. Sometimes, this takes thorough user research and other times it is intuitive.

As always, the main component of UX based design is understanding and designing for your users. There isn’t necessarily a one-size fits all solution to this shift but it is important to consider heavily how a website is typically viewed. Fuelling design decisions with user usage analytics is always a good place to start. If analytics and user research don’t help you choose a course of action, responsive web design is a beneficial option that will ensure both desktop and mobile website experiences are consistent.


Other articles you may like.

Good UI doesn’t necessarily equal good UX!

  • By
    Sudipt Shah
    August 30, 2018
    July 28, 2021

A major shift in the digital landscape is happening and an increasing number of companies are focusing on their users’ digital experiences.

UX / UI design

The importance of microinteractions.

  • By
    Brooke Cowling
    September 16, 2018
    July 28, 2021

When was the last time you downloaded a song? Did you excitedly watch the status of your download while you waited? That progress indicator you were watching was a microinteraction, my friend! As you may already know, with great user experience and user interface design “the devil is in the details.” You can’t have an amazing digital experience if the details aren’t thought through and executed well. If microinteractions are designed successfully, they make a mediocre experience great, memorable and leave users wanting to return.

UX / UI design
Mobile app

Creating a memorable user experience - 10 UX principles.

  • By
    Brooke Cowling
    September 17, 2018
    July 28, 2021

People often ask "what does good UX look like?". More often than not, people argue it’s how it looks, especially in the Gulf region which is not as digitally mature. Other people say it’s how it works, which is partly true, but again, not the right answer. Yes, design and functionality are important, but we're here to let you in on a little secret: good UX is about how it makes you FEEL.

UX / UI design
Mobile app