Thoughts About Responsive Design

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.

iMac, iPhone, and iPad

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 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.

The Acropolis of Athens as seen from Mount Lycabettus

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.

Chinese Farm & 24 Season Clock

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.

Street advertising in Prague

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.

Let's talk about user-experience

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?

Iguana adapting to it's environment

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.

« »

Download a free sample from my book, Design Fundamentals.

8 comments

  1. Great article. I agree responsive web design is more of a way of thinking rather than just a tool. I think the issues brought up by those opposed to RWD are valid and should be addressed. Critics like Matt are necessary to help us push what we have and make it even better.

    Instead of disregarding or ignoring RWD because it has some cons, I would urge developers/designers to work on solving the current issues raised by critics like Matt.

    Nothing is perfect, but with time, trial and error, I’m sure we can figure out best practices for this new approach.

    • Thanks Brett. Sounds like we agree completely on this.

      When I first heard the term responsive design I wasn’t quite sure what to think. I focused in on the media queries and thought so what. Isn’t this just a new way of doing browser detection?

      The more I’ve looked though, the more I see it’s so much more. We now have the tools to develop sites the way I think most of us have known for years we should. We can develop flexibly.

      It’ll be interesting to see what best practices come along. I’m sure they’ll emerge before long.

  2. “Responsive design isnโ€™t about creating more designs, itโ€™s about putting more thought into a single design.”

    Thank you very much for taking the time to write this and especially for the quote above. Push-back and questioning are fantastic and I love to see the challenges being laid out by web professionals regarding web design.

    However, the article that you pointed out has sat wrong with me because it is more of a list of excuses not to change. Zeldman says in the foreword of Ethan’s book “some ideas seem inevitable once they arrive”. This is the way that I feel about responsive web design. It feels so right, more-so than regular fluid layouts ever have.

    Here’s to One Web!

    • I think we agree. ๐Ÿ™‚

      I think the questions are valid, though to me their more about things we need to think about and find a solution for rather than convince us not to adopt responsive design.

      Responsive design is one of those inevitable ideas. I think most of us have felt for a long time that flexible layouts were the goal. The problem is we haven’t had a good solution to the problem. Now we have a good solution.

      We’ll also find new problems as we begin to explore this solution more. We’ll find solutions to those new problems too. The main thing is we have a direction to follow.

  3. Great article.

    I will admit I was against responsive designing at first, can’t call myself an early adopter of the ‘trend.’ After a while it became clear that this was the direction we were heading in as web designers, and I think it is inevitable to practice responsive designing if you want to stay relevant and sustainable at this point.

    You covered the evolution of advertising, which is a great example and parallel. It’s normal to be a bit anxious initially, but it’s better to get excited about it! I don’t see the loss in learning something new.

    • I wasn’t sold on it at first either, but as I took a deeper look it quickly became apparent responsive design is the direction web design is heading. It just makes so much sense.

      I agree too about being anxious where change is concerned, but let’s face it, things change. They always have and they always will.

  4. Responsive web design is hands down one of the most important new ways of thinking that has captivated my imagination about the work I can produce in the future. I’ve never been against it.

    I’m getting a tablet sometime later and when I use that device, it would be nice to get a great user experience on it via the websites I browse. I’ll be testing my websites on that tablet as well.

    My ultimate goal as a creative (I’m also self-studying math ๐Ÿ™‚ ) is to continuously refine my knowledge and research my field, to learn new ways of solving problems. To me, responsive web design is a matter of problem solving. It sure as hell beats doing multiple mock-ups and code overall, which I wouldn’t do anyway. Response design takes a bit more effort, but not to the point to where it’s impractical or you’d have to charge a ton of money.

    My version 2.0 of my web layout will utilize responsive design. Also, http://www.amazon.com looks beautiful on a tablet. ๐Ÿ™‚ I was so inspired from the great experience. It’s inevitable that it happen, because phones and tablets are becoming mainstream devices for browsing the web. People who could be clients, customers, or just readers of your blog. Personally, I don’t want them to miss out. I feel I have an obligation to provide them a decent experience.

    • I think so too, though it took a little time for me to be convinced. Once I really looked it didn’t take that long.

      Interesting way of putting it. I like the idea that it’s a matter of problem solving. I’m working on a redesign of this site and I’m currently developing it to be responsive. There’s definitely extra effort, but I think it’s mostly because I began with the wrong approach. I’ve been learning a lot as I go and I think next time out it’ll go much quicker.

      I have an IPad and iPhone and I’ve been checking out sites I know are responsive to see how they look. I hadn’t realized Amazon was responsive, but I’ll make sure to take a look.

Leave a Reply

Your email address will not be published. Required fields are marked *