Mobile First: What Does It Mean?

By Riley Graham

Published: March 5, 2012

“By implementing responsive JavaScript, it’s possible to tell Web sites to adapt to whatever device a person is using to view a Web site.”

Mobile first has become a popular trend within the UX design and development communities. But, what does mobile first mean, exactly? I first encountered this concept at TechWeek, in Chicago, in the summer of 2011, when I attended a talk on mobile UX design by John Buda, who taught the audience how to write responsive behavior. I was stunned. By implementing responsive JavaScript, it’s possible to tell Web sites to adapt to whatever device a person is using to view a Web site. I had seen Web sites behave in this manner, but until that moment, I hadn’t understood that mobile first is both a strategy and a new way of writing code. I left the conference with some questions, including: What is mobile first? What is a mobile-first strategy? And, why is mobile first becoming increasingly popular? I’ve since come up with some answers to these questions that I’ll share with you in this article.

Mobile First: A Paradigm Shift

“Mobile first requires a new approach to planning, UX design, and development that puts handheld devices at the forefront of both strategy and implementation.”

Many companies caught on to the mobile-first trend awhile back. Google surfaced their mobile-first strategy in 2010. As you’ve probably guessed from the name of this approach to site design, mobile first means designing an online experience for mobile before designing it for the desktop Web—or any other device. In the past, when users’ focus was on the desktop Web, mobile design was an afterthought. But today, more people are using their mobile devices for online shopping and social networking than ever before, and most companies are designing for mobile. Mobile first requires a new approach to planning, UX design, and development that puts handheld devices at the forefront of both strategy and implementation. The digital landscape has changed, and companies have realized that consumers are now accessing more content on their mobile devices than anywhere else.

Mobile first shifts the paradigm of a Web-site user experience. Instead of users’ viewing desktop versions of Web sites on their mobile device with some adjustments, users are now viewing sites that have been created specifically for their mobile device. This begs the question: how will stationary, desktop computer users view these Web sites? They’ll still view versions of Web sites that were developed for the desktop Web—but designed with mobile in mind. This means designers should tailor site user experiences to the needs of users who are on the go and in multiple contexts. Text must be easier to read and navigate. Photos and maps should be easily accessible, and all content should adjust to display properly on the device on which a user is viewing it.

Digital Strategy

“A strategy for a mobile user experience considers all of the same factors: the behavior, the audience, the targeted behavior, and the technology channel, but the relative importance of these factors shifts depending on the user’s context.”

Defining a digital strategy is an essential part of developing a successful product or brand. A desktop-Web user experience strategy differs from a mobile user experience strategy. A traditional desktop-Web user experience is designed for keyboard and mouse interactions, and a strategy for such a user experience should take into consideration the context, the behavior, the audience, the targeted behavior, and the technology channel. The typical assumption is that users are stationary and viewing a browser on a large screen. It’s essential to design desktop-Web user experiences for all users who might access a site—from children to the elderly. On a stationary desktop computer, users can read and understand in-depth content and can type lengthy responses. For games on the Web, users manipulate controls using the keyboard or the mouse.

A strategy for a mobile user experience considers all of the same factors: the behavior, the audience, the targeted behavior, and the technology channel, but the relative importance of these factors shifts depending on the user’s context. Mobile design employs less screen real estate, but introduces greater breadth to a user experience, according with the context of the overall experience. The needs of users change because their context continually changes. Users have a harder time reading in-depth content on a small screen. Without a keyboard, their ability to type is hindered. Mobile devices introduce new modes of interaction such as touch and gestures. It’s possible to play games in a number of different ways, by activating touch targets across an entire screen.

Let’s consider an insurance company’s site as an example, highlighting the differences between a desktop-Web user experience strategy and a mobile user experience strategy. An insurance company wants to build an online experience. The home page of a desktop-Web experience might provide the means for users to call an agent and get a quote as its primary call to action. However, if the insurance company wanted to build a mobile experience, the focus might instead be on users’ context. Users might use the insurance company’s site on the go—to make a claim or get roadside assistance. Therefore, for a site that is optimized for mobile, it would be necessary to reorganize the desktop-Web content.

Why Now?

“Mobile devices are now the primary means by which users are accessing Web sites, and the number of people using sites on mobile devices is projected to triple within the next year.”

Currently, many Web sites are embracing a mobile-first strategy, but it’s taken awhile. Why is mobile first finally becoming a popular strategy? Mobile devices are now the primary means by which users are accessing Web sites, and the number of people using sites on mobile devices is projected to triple within the next year. Today, smartphone sales have actually surpassed personal computer sales.

In addition to the consumption of content on mobile devices, another reason is the arrival of HTML5 and CSS3, which together offer new features that support responsive JavaScript calls. Developers can now tell Web sites to adjust their size and, as necessary, optimize their page layouts for particular devices. The mobile environment allows developers to create rich, context-aware applications. The way people access sites on their mobile devices is yet another reason mobile first has become so popular. The limited screen real estate of mobile devices encourages designers and developers to focus on the most important pieces of content. Thus, mobile devices provide users with a better overall experience for shopping, playing games, and making purchases.

These days, the Internet is moving fast. By the end of 2012, it is projected that, in some countries, mobile networks will deliver one gigabyte of data per second through the Internet. This is 200 times faster than the current speed of the Internet in the United States. This increased speed will better support mobile browsing and Internet access, enabling users to complete many more tasks within a small time period when on the go. Cloud computing has also contributed to the popularity of mobile Web site use. When on the go, people can easily and quickly access large amounts of data in the cloud.

All things considered, mobile first is changing the landscape of the Internet. It is a strategy that we cannot ignore. Examine mobile first as a new approach to designing the best user experiences possible. Considering a user’s context and behavior, as well as nature of your audience helps you to determine the best digital strategy for your product or brand. As new devices continually come onto the market, mobile first—an approach to design and development that considers a variety of devices and contexts—will be pivotal to your creating a successful product or brand.

References

Albanesius, Chloe. “Google’s New Rule: Mobile First.” PC Mag, February 16, 2010. Retrieved February 29, 2012.

Buda, Jon. “Mobile UX Design.” TechWeek, July 23, 2011. Retrieved February 29, 2012.

Kim, Ryan. “It’s Becoming a Mobile First World.” Gigaom, January 6, 2012. Retrieved February 29, 2012.

Wroblewski, Luke. “Mobile First Helps with Big Issues.” LukeW Ideation+Design, June 4, 2010. Retrieved February 29, 2012.

Wroblewski, Luke. “Why Mobile Matters.” LukeW Ideation+Design, February 21, 2012. Retrieved February 29, 2012.

5 Comments

I would be far more inclined to agree with arguments surrounding mobile if we simply removed that dingleberry of a word, first.

I whole heartedly agree that mobile is becoming more important. I agree that designing for context is critical, and ignoring it is lazy. I even agree that responsive design is totally sweet and a great solution for certain scenarios.

But designing for mobile first… Where’s the argument for that? What makes designing for a mobile device “first” a better design solution than simply designing for each context that your platform will exist on?

For instance, look at the arguments you make about what would make mobile first design a better design solution: text should be easy to read, content easily accessed, screen real estate optimized—but those apply to all of the contexts for which we design. They are not mobile specific; they are context agnostic.

I appreciate the passion surrounding mobile. After years of 960 grids and clients worrying obsessively about folds, we have a dynamic new platform that we get to think super hard about. It’s the wild west, and we’re learning every day. Make no mistake, I respect your excitement and your approach.

But it seems like we’re trying to preach mobile first simply as a way to better design overall, so I worry that it may become simply a crutch. Teach a man to fish…

Already in 2013, and I fully agree with Jayson.

Considering I am new to the world of usability and UX, and with limited knowledge, the idea of Mobile First is quite, well, in my view scary!

I think, the information ecology—context, content, and users—needfinding interviews and other exercises should decide mobile when and how!

What concerns me the most about the Mobile First concept is—a lot of folks are quite eccentric about mobile development. They might just go wild with the Mobile First concept—dissing some core principles of HCI and UX design.

Thanks a lot, Riley!!! but…

I can’t solve how to change some of my application’s complex pages into mobile, intuitive, user-friendly, and powerful forms… it’s so frustrating.

I think major Web sites can be developed based on the mobile-first strategy, but not complex Web applications like an insurance company CRM or any other transnational Web app.

Really, I’m worried about if I am being too lazy or if I have become stupid, but please somebody show me how to start with mobile first without sacrificing functional power!!!

Jayson, Masrur, and Ivan,

You’ve all made great points, and I really appreciate all of your perspectives.

Jayson—I agree that the principles listed should be design agnostic. In my experience from working with other designers, namely designers who are new to User Experience, mobile design has been a great way to sandbox big thinking. I see more good mobile design that translates to good Web design rather than vice versa.

Masrur—I also agree with your support of Jayson. As time has passed, I have seen people take things overboard—and it is scary! Everything in moderation. :)

Ivan—You bring up a very interesting issue. I believe you are hinting at complex tasks? If so, that may rightfully transcend the bounds of mobile first. I used to design for a pharma-solutions company that specialized in translating complex data into a more digestible form of information. This was definitely a type of application that wouldn’t benefit from mobile first. In fact, it might be hindered by that approach. However, in that case, there are many basic UX design principles that are sacrificed to maintain and support a highly complex workflow that was designed for only a small set of the population, pharmacists. Which brings me to a tangential question: are complex workflows able to adapt to all UX principles?

I really appreciate all of your responses, and over a year later, I really do believe in everything in moderation, designing for mobile, and helping big thinkers focus on users’ goals. However, sometimes too much emphasis on mobile design can hurt the user experience.

Thanks, Riley Graham, for this article. It helps me a lot. Good luck.

Join the Discussion

Asterisks (*) indicate required information.