dev

"Mobile First" vs Mobile First⁠™

Never judge a book by its cover


Strategy

It’s 2026.

I’m still hearing the term mobile first used a lot—but every mention seems to have a slightly different interpretation.

It kinda feels like I’m being gaslit. Do I even know what the term means anymore?

Judging by some people’s eternally cracked phone screens—mobile first has something to do with stage diving?

Origins

As anyone who has ever had to come up with a name for something knows: naming is hard. Too short or abstract and you will have to explain it over and over again. Too long or overly descriptive and people will have trouble memorizing it or repeating it correctly.

But once in a while someone comes along and hits a home run.

In 2009 Luke Wroblewski did just that. He coined Mobile first™—which he fleshed out in the book of the same name in 2011 (now available online for free).

He had sniffed out that smartphones would be selling like hotcakes in the years to come. And by not factoring them into your business strategy—you would be losing out on huge potential earnings.

In the book he outlined a framework of thinking to help people include mobile in their businesses—focused mainly on the web.

Then

At the time, most websites were not exactly mobile-friendly; they were designed for computer screens via fixed-width designs—with seemingly no limit to the amount of content put on a single page.

Apple had demoed their state of the art mobile experience in 2007, with Steve Jobs showing off Safari on the iPhone—rendering fixed-width websites on an iPhone. Pinch and zoom.

The websites that were mobile-friendly were often watered-down versions of the main site, hosted on an m. subdomain (e.g. m.cnn.com).

Around the same time—2010—Ethan Marcotte coined responsive web design (with a book in 2011—also available for free online, hat tip to @therealkimblim): one fluid layout that reflows to fit any screen, rather than a separate m. site. It’s easy to lump the two terms together, but they answer different questions. Responsive design is the technical how—fluid grids, flexible images, media queries. Mobile first is the strategic why and what. They pair up well—responsive design became the usual way to ship a mobile-first site—but one isn’t a synonym for the other.

Now

Stacked area chart showing global internet users by device type from 2009 to 2025

Global internet users by device type from 2009 to 2025. Tablet users remained negligible throughout. Mobile users surged from near zero to ~4 billion, overtaking desktop around 2016. Desktop users fluctuated around 2 billion consistently. Total internet users grew from just below 2 billion to 6 billion over the period.

Luke was right.

Mobile use rocketed from a measly 0.7% in 2009—shooting past desktop in 2016—to 62% in 2025 on the web.

So if all you do is look at the percentages, it looks like a chunk of desktop was replaced by mobile. But clearly, the chart shows that desktop use didn’t shrink (in fact it grew by half a billion). Your trusty old desktop users are still there.

What the chart doesn’t show is the overlap between desktop and mobile users. I’ve only been able to dig up numbers for the years 2014 and 2015 in the US; Number of Mobile-Only Internet Users Now Exceeds Desktop-Only in the U.S.:

  • In 2014 19.1% of users were desktop-only, while 10.8% were mobile-only, which would mean a dual-use user share of ~70%.
  • In 2015, the numbers were down to 10.6% for desktop-only and only slightly up to 11.3% for mobile-only, which would mean a dual-use share of ~78%.

A considerable increase in dual-use due to desktop users buying mobile devices.

Two caveats, though: these are US-only numbers, and they come from comScore’s PC-based panels—which are known to undercount mobile and workplace use. So treat them as estimates with a lean, not gospel. Comscore also stopped publishing this particular breakdown after 2018, so the trail goes cold there.

I couldn’t find a comparable series for the years since—so what follows is inference, not measurement: desktop-only use has almost certainly dwindled toward near-zero, while mobile-only use has kept climbing. Every source I could dig up points that way; none of them measures the overlap cleanly. (The closest continuous proxy, Pew’s smartphone-only metric, measures something subtly different—smartphone owners with no home broadband—so it’s more about access than device preference. I’m not leaning on it.)

But while most websites now use responsive web design, as Ethan Marcotte sketched out, I’m not so convinced that they are truly mobile-first.

Mobile First™

Disclaimer: The following is my interpretation—based on the book.

The book spends the first chapters explaining why and what: the growth potential in the market—and the nature of smartphones; constraints (smaller screens, unreliable networks, divided attention, etc) and capabilities (location detection, touch interaction, device orientation, etc).

Those chapters laid the crucial framework for convincing decision-makers in 2011. Today it ought to be common knowledge.

The remaining chapters go into how. Coming from an essentially desktop first (or rather desktop only) web required new ways of thinking about content and design, when starting to include mobile.

The most important principles from the book, which I would consider non-negotiable, are as follows:

  • Prioritize content; smaller screens and the partial attention of users require more intentional content strategies.
  • Design for touch interaction; larger hit areas for fingers, easier-to-read design.
  • Fluid design; make the layout adapt to the screen size.

You may notice that none of these principles are going to make the desktop experience worse, quite the contrary.

More focused content is a boon for everyone. The user finds what they want faster, and the site is more likely to be faster as well—no matter what device they’re using.

Designing for touch means larger hit areas benefit non-tech-savvy users, users with motor/visual impairments, or just users on the go.

Fluid design just gets the most out of the screen size, whatever device the user is on.

These are all things we could’ve/should’ve implemented—even if the smartphone surge hadn’t occurred.

So, for me, mobile first is strategy/design process for making your product better on all devices. It’s just using mobile as a lens to focus your content and functionality. It’s not about either/or-thinking (i.e. desktop vs mobile), it’s about inclusion—not about which device type is currently in the lead.

The Many “Mobile First” Interpretations

It’s easy to write off most misconceptions as people just extrapolating the concept from the book title. The downside of a good name, I guess.

Some of them might be grounded in trying to warp the concept to fit a specific use case.

In my opinion, these all misrepresent the spirit of mobile first, though.

Desktop Later

This is probably the most prevalent of the takes.

By designing and implementing—and maybe even launching—a mobile solution without any thought given to larger screens, you are letting down a chunk of potential customers. Depending on your region or specific demographic, this may be a calculated risk you’re willing to take.

For most desktop users, having a single narrow column of content in the middle of a window is a lackluster experience. It doesn’t really scream “We appreciate your patronage”.

If you fully intend to improve on this at a later point, be wary that unfolding a single column into a more interesting layout on larger screens is not always a trivial task. CSS grid can only do so much.

Sometimes postponing something is just more expensive in the long run. Having given larger screens some thought up front can save time and effort (and frustration) down the line.

This is also a slippery slope to…

Mobile-only

Maybe you decided desktop users are not worth the effort.

While this may be the best solution for you (if your demographic only has, say, 5% desktop users), it’s still not mobile first. It’s exclusion, rather than inclusion as Luke outlined.

Desktop is not Allowed to be Better

With larger screens comes more real estate.

Most things are just better when they get more space on larger screens. There are many easy wins.

This is allowed in mobile first, provided you already made the mobile experience as good as you could possibly make it.

But maybe your desktop experience is better than mobile only because you had…

No Prioritization of Content

This strays the furthest from the book. If you’re just lugging along an old-school desktop content strategy (“leave no content behind”), you’re simply not doing mobile first.

If your users are complaining about confusing content (e.g. non-news content in the newsfeed), you have work to do.

As you narrow down the content to focus on what the user wants/expects, you’re likely to make your website faster as well.

Only One True Way to Build

Mobile first is a philosophy, a way of thinking. As such it does not prescribe a specific way of technically implementing it.

This is the only code Luke actually shares in the book; the humble meta viewport tag (the gateway to responsive web design):

<meta name="viewport" content="width=device-width">

Many developers assume the following CSS pattern to be mobile first:

.nav {
	/* Stack on mobile. */
	display: flex;
	flex-direction: column;
}

@media (min-width: 480px) {
	.nav {
		/* Lay out in a row on larger screens. */
		flex-direction: row;
	}
}

In reality, it is just a way to implement a mobile first approach in responsive web design. It is not a prescribed way of working.

It’s a great pattern, though. And you will probably be using it 99% of the time you reach for media queries. If nothing else, for consistency.

But the same could be written without resetting styles on larger screens, with custom mobile styling in a media query:

.nav {
	display: flex;
}

@media not all and (min-width: 480px) {
	.nav {
		/* Stack on mobile. */
		flex-direction: column;
	}
}

This is not invalid in mobile first—because it doesn’t prescribe a specific approach or methodology.

Conclusion

The power of mobile first is only unleashed, once you use it as intended; a framework for nailing down your content strategy and designing your website.

When paired with Ethan’s Responsive Web Design you have all the pieces you need to build a mobile-first website. Sprinkle it with some Progressive Enhancement for extra brownie points.

If you haven’t yet—please go read the book. It’s free.

Maybe you’ll notice something important I missed.

Time to drop “mobile first” and do mobile first™.