Overview

Today’s emphasis on responsive web design (RWD) brings many benefits, but can also gloss over important differences in how people actually use different types of devices. Are there lessons from our not-so-distant past that can help us avoid such pitfalls?

Responsive Web Design

Long ago — way back before 2010 — developing for mobile meant crafting mobile-specific user experiences, such as m-dot sites and native mobile apps. The opportunity to create experiences tailored to new mobile devices and interaction patterns drove much of the excitement around early mobile websites and continues to drive innovation in native apps.

In the past few years, however, the web development community has turned away from mobile-specific experiences. Today’s prevailing wisdom favors re-packaging and re-presenting the same content and functionality, organized the same way, to all users — regardless of what type of device they’re using. This philosophy is embodied in the family of techniques known as responsive web design. RWD uses fluid layouts that allow the same content to flow into different sized containers, and media queries, CSS, and JavaScript to re-format that content to fit whatever device on which it happens to finds itself. It’s an approach that’s backed by many industry leaders, and it’s won justifiable praise and unprecedented adoption. It has also allowed front-end designers and developers to play a holistic part in mobile in a way previously prohibited by siloed skillsets and proprietary tools. This re-enfranchisement of creative, skilled people into the mobile revolution has had a tremendously positive impact on the developer community.

From a user’s point of view, responsive design is a great example of mobilization: taking the same content and functionality and re-packaging it to go. A different approach — in which first-wave mobile development was grounded — is mobile optimization: serving content and services designed from the ground up for what’s distinct about mobile contexts.

To be more specific, responsive web design is an example of client-side mobilization. It stresses parity: the same stuff for everyone. In RWD, all of the intelligence is in the HTML, CSS, and JavaScript delivered to the web browser. All of the re-formatting happens at the point of display; the browser does the heavy lifting. Because the same code and assets are delivered to all devices, developer effort can be unified in a single codebase. On the flip side, all devices have to download and process the same payload, including code and content meant for certain device types and not useful on others. This has led to the proliferation of web pages which render well on different screen sizes, but weigh in at multiple megabytes and require extensive user scrolling to scan and navigate.

Server?side Mobile Optimization

By contrast, server?side mobile optimizationfocuses on delivering optimal content and UX to each type of device. It stresses efficiency, in both users’ time to acquiring their goal and network utilization. It pre-assembles optimal content and flow on the server and only delivers to each user what’s best suited to his or her device. At an extreme, server-side optimization can deliver completely different content, functionality, organization, and navigation to users on different devices. This can lead to highly tailored experiences that are fast, lean, and efficient. The downside is that, on its own, server-side optimization can be very labor-intensive, and risks depriving content to some users just because of the device they happen to be using.

As the tide has turned decisively toward from server-side optimization to client-side mobilization, developers certainly gained some great new tools. Did we lose something as well? Responsive design — adaptation at the point of display — is rooted in the assumption that all users want the same content, organized and navigated in the same way, all the time. But studies show that usage patterns for mobile devices really are measurably different than for other computing devices:

• Mobile devices are used more frequently and for much shorter interactions than laptops and desktops.
• People are increasingly using more than one device at a time, and when they are, at least one of those devices is almost always a mobile device — by definition, split-attention use.
• Users are often alone when using their mobile devices, but sometimes they are in social settings and some portion of those situations pressure users toward quicker, more discreet interactions.
• Handheld devices necessitate a very different physical relationship between software and user, impacting everything from practical information density to touchable target sizes and one-thumb interactions.
• The most common mobile activities — including searching and shopping — are measurably more spontaneous and spur-of-the-moment on mobile devices.

One Eyeball, One Thumb

What’s interesting is that these are largely things we knew way back in 2007, at the dawn of the modern mobile era. With time and skyrocketing mobile use, we have reams more data now than then — but the overall conclusion remains that people use their mobile devices differently from other computing devices. By and large, mobile interactions continue to be dominated by short, bursty, split-attention use — what a leading pundit recently called “one eyeball, one thumb” interactions.

The question you need to ask is: To what degree does this apply to my content and services, and to my users and the ways they interact with that content? The more it applies, the more you see different behaviors and interaction patterns in different contexts, the more value you’ll find in server-side mobile optimization. The more you have a genuine case for one-size-fits-all, where there’s irreducible content and features you need to provide to all users, the more you’ll need to rely on responsive mobilization to give the same experience to everyone.

Beyond the here-and-now, let’s think for a moment about the future. Even if you’re confident that the nature of your content, and the needs of your users, favor a one-size-fits-all approach today, what happens as your content and services, and your users’ needs and expectations, continue to evolve?

What about wearables, such as Google Glass? If you look at Google’s developer guide examples, the basic information density for a card is roughly the same as for an SMS message — less if you use images. Is it even possible to format the same content that fits on a laptop or tablet, or even a phone, to fit this? Is there such a thing as responsively Glassified content? And what about other wearables like smart watches, ambient devices and speech UX? Are you confident that the same content and services, in the same information architecture, will be best served to users on all those devices, in those contexts and the ones we haven’t imagined yet? Or do we need to plan and build now on a system that gives us the ability to pre-optimize, on the server, slightly or radically different IA, UX, and information density for different types of devices?

Mobile Strategy

And in a world where our phones and tablets are going faster and more powerful, don’t forget that the next big wave of devices — wearables, embedded devices, smart appliances, interactive displays, in-vehicle systems, and so on — will be relatively simpler devices that rely on the network for their real capabilities. In some ways, we’ll see a disaggregation of the sensors and gadgets and displays that have been increasingly aggregated into smartphones. Even setting aside what amount and type of content these devices can show and what inputs they can handle, just think about where the compute and networking power lie. No matter how fast your 4G network and multi-core tablet are, your datacenter has vastly more resources. When you think about it that way, especially in light of the coming waves of relatively less-capable devices, does it make sense to base your strategy for your multi-MULTI-device future on the device doing most of the heavy adaptive lifting? Or does the heavy lifting belong on the network — in your datacenter and the cloud?

And what about hybrid native apps? That’s a subtly different technological context in which a user may want to interact with your web?based content. Recent studies by Flurry Analytics, IDG, and others have found that more than 80 percent of users’ time on mobile devices is in native apps, not web browsers — a proportion which is actually growing year by year. The trend these days is for native apps to display more and more of their live content as HTML content, pulled from a web server — what’s called a hybrid native app. What if you simply want that web-based content in your hybrid app to look and feel as at home as possible inside an iPhone app, in a way that’s different from when it’s shown in an Android app or even on an iPad? Don’t you want that content to download and render super-fast and seamlessly, without carrying all the markup and code and script and assets for desktop computers and tablets and basic devices? What’s the responsive approach to hybrid native apps?

Responsive web design is one of those rare really great tools whose use changes the way you see things. It makes people think and ask a lot of the right questions that they weren’t before, and as a practitioner who has been living and breathing this for years, I love that. But if your entire mobile, multi-device strategy is one specific set of tools and techniques, no matter how capable, you’re painting yourself into a corner. It may not seem so now, but it certainly will in the future.

Even the best tools and techniques are not the same as strategy. Techniques are what you use to implement strategy. The best tools can help inform strategy. But strategy itself drives tools and techniques, not the other way around. Your web strategy is fundamentally about your users, your content and services, and how you help each engage with the other. In our rush to embrace today’s conventional wisdom, let’s not ignore what we learned back at the start of the modern smartphone era. Server-side mobile optimization may seem like throwback thinking right now, but it’s actually an important part of our path to the future.

About the Author
Eric Kim is a co-founder and Vice President of User Experience at Modo Labs, a mobile software company based in Cambridge, MA. Eric is an interdisciplinary designer with a specific focus on the architecture and visual design of web and mobile applications for clients ranging from technology startups to Fortune 500 enterprises. He graduated from Harvard University in 1994 with an BA with honors in Visual and Environmental Studies, with a concentration in architecture and graphic design.