Thoughts About Responsive Design

Posted: 15 Aug 2011 05:30 AM PDT

When offering thoughts on developing a responsive workflow I mentioned that responsive design is ushering in a new phase of web design. It’s more than a few techniques slapped together under a new name.

I see it as a change in thinking about how we design and build websites and it’s going to challenge a variety of existing processes. The changes are going to be similar in scope to when the industry moved from table based design to css based design, including the pains of learning something new.

With all the positive talk about responsive design in the industry it shouldn’t be a surprise that some are now pushing back and raising questions about how useful it really is. Some are calling it the latest trend, and a few even want to see it go away.

Recently I came across a post by Matt Ward titled, I Love Responsive Design, But…, which is an intelligent post worth reading that raises some questions. Matt makes it clear that he’s behind the concept the responsive design, but wonders if people are mistakenly seeing it as the be all solution.

I’ve been spending a lot of time behind the scenes working on a responsive site. I’m convinced this is the way forward and those who ignore its ideas are going to be left behind.

I want to look at the 3 main points of Matt’s article and offer why I think they’re incorrect.

Debunking Myths

In the conclusion of Matt’s post he offers the following, which I think is the gist of his argument.

responsive design, like any other tool, has both benefits and potential shortcomings. As designers, it's our job to weigh both sides of that proverbial coin in order to make appropriate decisions, based on the unique needs and context of the project.

Fair point, though I think it’s a mistake to call responsive design a tool. It’s more a thought process that encompasses a variety of techniques.

These techniques help us create a layout that responds and adapts to different conditions. Responsive design is much more than layout or the sum of a few techniques.

Let’s look at what Matt feels are 3 potential shortcomings or responsive design.

Longer Development Times (and Greater Costs)

I don’t entirely disagree here. We’re naturally doing more to make a site work across more devices so it makes sense there will be longer development time and with that a greater cost.

Where I disagree is with the suggestion that responsive design will double or triple the time and cost.

The thinking for tripling the cost is that we’ll now need to create a unique comp or mockup for every possible state of the design as well as code each of those states with a different stylesheet before merging them together.

That’s not how the process will work. We won’t be designing and coding separate and static versions of different design states. Rather we’ll incorporate more thought about these different possible states into the initial design.

We’ll be thinking more about the need to make our designs flexible and adaptable. This will take time at first to wrap our minds around a new way of thinking, but it will take less time with practice.

Today I can develop the basic layout for a static site in less than 5 minutes. I can do that because I’ve spent years figuring out best practices for those layouts and I have a library of code representing different layouts I commonly use.

It took a lot longer to develop those layouts the first time, but they became quicker and easier with each successive site.

Keep in mind that responsive design is still quite new. Ethan Marcotte’s initial post about responsive design is less than a year and a half old and it’s really only the last few months since the industry at large has begun talking about it.

We haven’t yet developed best practices or built the code libraries. We will and when we do development time will be much quicker than it is now.

Responsive design isn’t about creating more designs, it’s about putting more thought into a single design.

Advertising Conditions

Matt’s 2nd point is that ads are currently sold based on things like their position on the page and the amount of pixels they occupy. Since responsive designs alters these things it will affect advertising.

He adds that advertising becomes a more complicated proposition under responsive design. My response is so what?

To me this is a non issue. There’s no reason to assume the way advertising is done today is the way it should always be done. What we have today is already an evolution from where things were.

Advertising changed when it moved from print to radio, from radio to television, and from television to the web. It’s evolved within print and radio and tv and the web and it will continue to evolve in plenty of ways.

More complicated? Maybe. More opportunity too.

If you recall in the short history of the web advertising started by mimicking what we had in print and on television. Then Google changed ads to being about clicks, links, and context. Then banner advertising came back in improved form.

Trust me when I say advertising isn’t going away anytime soon and both advertisers and designers will find a way to make it work from both sides where responsive design is concerned.

Advertising online is about attention, recall, and clicks. Those don’t require a specific position on the page or a certain pixel size. How we get an ad to grab attention might change, but the fundamentals of advertising won’t.

User Experience(s)

Matt’s final point is that responsive design affects the consistency of a site. If a person who’s always browsed on a desktop now visits on their new phone how much relearning will be necessary to interact with your site?

The issue here isn’t really the design of the site. Relearning is inevitable when moving from one device to another. What works on a desktop computer simply doesn’t work on a phone. Your design has to change to provide a good experience across devices.

A link needs more relative space around it on smaller devices
Text needs to be set at different sizes
Eye candy is less useful on the smaller device
There’s more space to consider on a larger device

Allowing a design to change doesn’t mean it has to become unrecognizable. Enough similarity can be carried to maintain the user experience. Where the experience changes significantly it’s more to do with the device.

Matt seems to be focusing on one or two things that might possibly degrade the experience while ignoring all the positive ways a responsive design can improve the experience.

I think the net effect is that responsive design has much more potential to provide a better experience. Isn’t that the reason we’re trying to adapt to the specific conditions of each device?

Summary

It’s natural that as any topic gains in popularity some will begin to question it. I think Matt raises some interesting points, but I don’t think the points are ultimately valid arguments against not considering responsive design.

In fairness to Matt he’s not arguing against responsive design. He’s mainly arguing for designers to see its pros and cons like they would do with any tool. Good advice in general, but again I don’t see responsive design as a tool. It’s more a change in thinking that makes use of various tools.

The techniques (the tools) will change. As more people develop responsive sites best practices will emerge.

What’s more important is the mindset. That’s why you should be paying attention to responsive design. We’re finally at a place where we have the ability to design flexibly for the dynamic medium we work in. It’s time we start embracing the medium.