the sky floor

Why Mobile First Web Design is a Certified Scam

October 6, 2022

If you’ve been around the internet for a minute, you’ve likely heard the concept of “mobile first.” The idea roughly equates to this: more and more visitors will be using phones, so you should design your website starting with them, and then you can tackle the larger screens. 

There are only two KingKong-sized problems with this idea. 

  1. Websites still aren’t predominantly viewed on phones (at least in many cases).
  2. It is easier to make a design flow smaller than to make it grow larger. 

Traffic Patterns

After doing this for 15 years, we now have access to over 100 website Analytics accounts, and most of them still see more than 50% of traffic come via desktop. The most shocking thing about this is that ten years ago, many web analysts predicted users would view websites 80% or more on mobile, but that hasn’t materialized. 

For the mobile share of traffic, the highest site we have had was 67% mobile in the last 30 days, but the lowest was only 2%. What does this mean? At the minimum, you need to know your audience and decide how mobile-focused you should be. But no matter what, desktop viewing is still alive and well. If you moved to an utterly mobile-first approach, you might leave 50% or more of your visitors out of an optimized experience. 

It would be best if you designed for all sizes. Perhaps the process should be called “responsive first.” Every screen size represents potential users that you want to reach as much as possible. Where do you start? Point number two gets to the heart of why we reject “mobile first.”

Start Big, Go Small 

The ultimate reality is that a mobile design is predominantly one content column. If you have two or three columns on a desktop device, they will fold into one for viewing on the phone – that is all the width will allow. If you take three columns of content and shrink them into one, all you have to choose is the order want them. Thanks to the latest standards in CSS and HTML (the basic coding blocks of websites), we can put those columns in any order we want on any screen size. 

Sign Up to Get Our Latest Posts Tuesdays and Thursdays

No Spam, Period. Just the latest posts.

Imagine you started with a single column and needed to bring it to the desktop size; now you have to pull that out to a side-by-side layout. If you started with true mobile-first, you would still have a single column on the desktop. When you start on the desktop, you can start with the complex layout, which will still become a single column on mobile. In other words, beginning with the complex makes sense because it will always be more straightforward on mobile. Starting with the most uncomplicated layout means you may unwittingly back yourself into a corner. 

Mobile first assumes that most traffic is on mobile devices and ignores the basic tenants of how the code works. 

In the end, you need to address all screen sizes, but over at The Sky Floor, we will continue to start with the desktop and then carefully check the other screen sizes for adjustments. It makes sense to start with the most complex layout and simplify it. 

Mobile first is OK if you make a mobile app, but you need to address every screen size for a website. Start with the complex, and simplify to the single column after that. 

More to explore