Four Ways to Rethink Responsive Web Design

Responsive Web DesignWhile the popularity and growing ubiquity of responsive web design has enhanced the web experience across multiple devices for many brands, a mobile-first approach to responsive design is not always the right solution. In fact, as consumers have become more flexible with their use of different devices, design innovation hasn’t always kept pace and some basic rules of responsive design now require rethinking.

These days, prioritizing mobile-first over all else to ensure elegant content flow across multiple screen sizes seems to have trumped the user’s contextual experience with content. At best, developing a well-thought-out web experience with responsive design starts by asking the right questions about what specific users need from specific experiences on specific devices. At worst, responsive design has become an exercise in aesthetics rather than a true exploration of user experience.

When coupled with a human-centered design approach, responsive design can transform user experiences from merely serviceable to contextually engaging—at the right time, in the right place and in the right way.

Here are four ways that we’re rethinking responsive design:

 01. Design Starts With Behavior—Not Device or Screen Size

The fundamental design challenge is uncovering how consumers engage with brands they love, and ensuring that their experiences with brand content are tightly integrated with the context of their experiences. Sitting with a smartphone on a couch in front of the TV is a radically different experience from viewing content on a smartphone in a retail aisle. Assuming that responsive design magically can address these differences without careful consideration of user behavior undercuts the best intentions of responsive design.

Breakpoints should be based on a user’s environment rather than the device that’s being used. This is a subtle but important distinction. Users need information tailored to their environment not simply tailored to fit screen size. And in order to present the right content at the right time, user behavior needs to lead discovery to find the best approach. If user behavior is dramatically different from one device to another, standard responsive design may not be the best solution and we might have to scrap a responsive design approach and create custom adaptive sites to better meet users’ needs.

 02. Mobile-First Doesn’t Necessarily Always Need to Be First

There’s no denying that designing for mobile devices—whether smartphone, phablet or tablet—is critical, but mobile doesn’t necessarily always need to be first. The greatest benefit of starting with mobile is that it distills user goals and business objectives to the essentials of a web experience; however, mobile-first intentions sometime becomes mobile-priority mandates, unduly constraining all other screen experiences.

Conventional wisdom in responsive design thinking dictates that responsive design begins at the smallest breakpoint and works its way up through desktop screen layouts. This assumption is predicated on the belief that all (or most) of all brands’ web traffic originates from mobile channels, which simply isn’t universally true … yet.

While mobile is increasingly the first point of exposure for a consumer to a brand, user behavior research may reveal that a significant portion of a brand’s core users still primarily accesses web content through laptop or desktop screens. If a brand’s business objective is to reach consumers where they are (in this case, not starting at mobile), then ignoring this insight could result in the creation of an excellent mobile experience, but a lackluster laptop or desktop experience—precisely where a desktop-leading brand’s audience is consuming most of its content.

Rather than blindly sticking to a mobile-first approach, we employ an “every screen” strategy and lean on user research to uncover the optimal device and screen that best reaches a user’s preferred mode of content acquisition. An every screen approach allows designers to consider information hierarchy that best suits a user’s needs.

03. Design for Unique Consumers’ Unique Needs

When it comes to responsive design, an overly device-centric focus at the start can lead to false assumptions. After all, mobile doesn’t always mean mobile (as in on-the-go), it could simply mean hand-held. Further, hand-held web experiences can differ significantly depending on where a given device is being used as well as differ significantly depending on the unique perspectives and needs of a given user.

One of the biggest problems about what’s being discussed around responsive design is the fact that the interactive design community seems to have lost track of the most important factor in user experience design, namely the user. Oftentimes, when people consider responsive design, they think about it as a design challenge or technology challenge instead of thinking about it as user experience challenge. Designing with a user-centric mindset at the start leverages understanding of what and where users are experiencing brand content.

Understanding what makes a user unique can help to develop a design approach that addresses each user’s and specific needs. To achieve this, we create unique information architecture for every device, starting where the user is, while maintaining consistent brand and user experiences. Therefore, if the user starts her experience on mobile and finishes on a desktop or if the user starts his experience on desktop then hands off to mobile, we design with each unique point of entry in mind.

Developing an optimized, brand-consistent user experience goes hand-in-hand with staying true to a brand’s business objectives.

04. Best Practices Aren’t Always Best

In the early days, experiences on the mobile web were often radically different from desktop experiences. Then tablets came on the scene and the desire to have a more consistent, on-brand experience took precedence. The problem is that if the same content is essentially being served up on different devices, only in smaller pieces, then all of the opportunities to address a user’s needs are not being considered to the fullest extent.

What keeps us on our toes is that best practices are constantly in flux, which is the nature of design in our business. Mobile devices are becoming more powerful. Laptops are becoming more portable. But only through solid research and discovery can we understand users’ behavior and address their needs.

The promise of responsive design is that there are unified tenets that can help designers and developers iterate more quickly. But at whose expense? The user and the client? A user’s mobile needs may change dramatically over a year, while the user’s desktop needs may not. Would those conditions change a site architecture that no longer fits into the responsive model? In many instances, responsive design may make sense right now, but the harsh reality is that it could cause friction down the line. Like many principles and approaches in this changing landscape, rules for responsive design shouldn’t be seen as absolute.

Check out some of our recent responsive design work, including projects for CBS Interactive, Vera Wang, and NYRP.

By Mike Lee


FOUR32C is an interactive product design agency. We’re curious digital natives who bring creativity and intelligence to the world’s most beloved brands. We create thoughtful, compelling interactive experiences by starting every project with questions. Our process leads to evocative digital products designed with a purpose for every pixel.