Responsive web design: 6 experts, 4 questions

Brad Frost

Helen Bailey: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
Brad Frost: I think 'responsive by default' is a good mentality. Creating a single codebase to serve to all users is a better way to preserve your sanity. In almost every situation, an organization choosing to create a separate mobile site has everything to do with the organization, process or project scope rather than for technological reasons. I'd say that very rarely are there instances where separate sites are necessary from a technological point of view. As for native apps, that's a whole different conversation. Unfortunately, many organizations conflate apps and sites, so it's important to educate them. I typically ask, "what's this thing supposed to do? Does it need access to device capabilities like your camera or contact list?" If yes, I'd recommend making a native app. However, it's importance to capitalize on the ubiquity of the Web, so even an app strategy needs to have a strong Web counterpart.

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
BF: I typically shy away from prebuilt frameworks. It's not that I think they're worthless, it's just that you're subscribing to how someone else has set things up, and they might not do what you need them to do. I've created a tool called Pattern Lab, which allows designers to create their own design systems. The goal is to allow designers to create powerful systems without really giving them a lot of dependencies or the answers.

HB: Is your personal site/blog responsive or not? Why?
BF: Of course my personal site is responsive and for a lot of reasons. First, it's how I earn my living, so it would be silly for me to talk about responsive design and not have a responsive site. Secondly, your personal site is the perfect place to experiment with new techniques, patterns and more. I highly encourage everything to have their own personal playground where they can continue to evolve their skillset.

HB: Which great resources on responsive web design would you recommend?
BF: I've rounded up and categorized a lot of great resources about responsive design right here in one handy location.

Tim Kadlec

HB: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
Tim Kadlec: I think there are two separate answers here. I don't think it's application OR responsive site: it is often both as I think both serve different purposes. Brad Frost has a post on the topic that I think discusses it very well: http://bradfrostweb.com/blog/post/native-vs-web-is-total-bullshit/ As far as websites go, yes, my default stance is that every site starts out as responsive. With device diversity increasing daily and the lines between device types blurring more and more, I have a very hard time imagining any situation where a site *shouldn't* have some responsive elements. That doesn't mean you can't couple it with server-side approaches if needed, or even that you shouldn't start with a standalone site. Many companies, the BBC included, have taken this approach: a standalone site that is responsive. The goal is that the site will eventually usurp the "desktop" site as well, but they're taking baby steps to get there. Not a bad approach if you ask me.

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
TK: I'm hesitant to recommend any frameworks. I think that our industry in general has it a little backwards: instead of the default being a framework or all these other little plugins and polyfills, the default should be just simple HTML and CSS. Then, as the project needs, you can start including things. But everything you add to a page or project adds something — be that weight, maintenance or complexity — and therefore everything needs to be justified before it gets thrown into play. Start light and vanilla and only add things in if they're necessary. That said, there are some tools I frequently find myself using: the anchorInclude pattern, matchMedia polyfill, respond.js and Modernizr come to mind. I tend to avoid pre-rolled frameworks like Bootstrap altogether: too much overhead for me.

HB: Is your personal site/blog responsive or not? Why?
TK: It is! Thankfully I found some time to do it. Plenty of things to improve, of course, but your own site is the last thing you work on.

HB: Which great resources on responsive web design would you recommend?
TK: I wrote a book, Implementing Responsive Design, that I think turned out ok, and of course Ethan's book on the subject is a must-read. From there, I think Brad Frost's This is Responsive is a great place to go to find links to a bunch of excellent presentations, patterns and articles.

Ben Callahan

HB: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
Ben Callahan: I believe responsive web design is a fantastic safety net. What this means for us is that it’s generally a default decision to build using responsive techniques. Then, if a customer’s users fall through the cracks of device detection, they at least get an experience that allows them to read the content.

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
BC: We use all kinds of frontend developer tooling to make our job more efficient. We rely heavily on SCSS, Compass, Rob Tarr’s media query bookmarklet, Chrome developer tools, and much more. We also have a device lab here in our office, which is necessary for doing this work.

HB: Is your personal site/blog responsive or not? Why?
BC: I use http://bencallahan.com as a playground for experimenting with ideas I have about the web, and often these ideas are related to responsive techniques. Because of this, it’s constantly in flux and often broken. A large part of building for the web is experimentation. We need to be OK with breaking stuff in order to better understand how to make things work! I’ll answer your question of “Why?” with a better question: Why not?

HB: Which great resources on responsive web design would you recommend?
BC:

• Follow @RWD on Twitter to see many new responsive sites launching everyday.
• Subscribe to Responsive Design Weekly
• Checkout This is Responsive, and follow its curator, Brad Frost
• There are tons more, but these will get you pointed in the right direction!

Aaron Gustafson

HB: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
Aaron Gustafson: I think all sites should be capable of adapting to whatever device is being used to access them. To me it’s about offering good customer service and not forcibly ejecting someone from your website (or making them endure a crappy experience) because they happen to be using a browser you don’t like or didn’t bother testing. That’s why we at Easy Designs follow the philosophy of progressive enhancement. And mobile-first, responsive web design is a great tool in the progressive enhancement tool chest.

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
AG: I find Foundation, Bootstrap, and similar frameworks interesting from an educational standpoint, but I would never use one when building a production site. For prototyping a concept, sure, but to take one of these into production you need to be rigorous in your removal of unused CSS and JavaScript or you end up creating a heavy, slow experience for you users. I also think you need to work twice as hard to break out of the theme of the framework. There are a ton of Bootstrap sites out there that look like Bootstrap sites. Your design should be as unique as your product, not some off the shelf thing you just changed some colors on.

HB: Is your personal site/blog responsive or not? Why?
AG: My company’s blog is. My personal website is disrepair, but the new version will be when I get some time to work on it. It comes down to offering a good reading experience. Plus we’re kinda known for this sort of thing, we’d be foolish not to show it off on our own sites.

HB: Which great resources on responsive web design would you recommend?
AG: There are a ton of great responsive resources on the web. One of my personal favorites is This is Responsive.

Dan Mall

HB: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
Dan Mall: Responsive web design is SuperFriendly's natural default, unless we have a good reason not to do so. The same is true with using HTML/CSS; we don't ask clients whether they'd like us to build a site with tables or CSS. We generally assume that we'll be building sites with modern web standards, unless there's a good reason not to do so. When I talk to clients, I'm mostly trying to figure out what their needs and desires are. Responsive websites aren't a goal; they're a means to achieve a goal. When clients talk about things like ubiquitous access or flexible designs, that points me in the direction of creating responsive sites for them as a way to fulfill those requests.

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
DM: I don't think I could build sites nearly as effectively without Adobe Edge Inspect. It makes developing across a range of devices significantly faster. I also love Victor Coulon's Responsive Design Bookmarklet. It comes in really handy when creating major and minor breakpoints. I've used Bootstrap, but mostly when a client already uses it and wants to continue with it. In general for the projects I work on, we've tended to roll our own frameworks. I very much subscribe to Dave Rupert's approach of tiny bootstraps for every client

HB: Is your personal site/blog responsive or not? Why?
DM: It's not, but only because I haven't had time to make it responsive. I'll get to it someday

HB: Which great resources on responsive web design would you recommend?
DM:

• Brad Frost's This Is Responsive is an invaluable resource for learning the latest and greatest.
• Justin Avery's Responsive Design Weekly keeps me up to date with what people are doing with responsive design.
• Having Brad Frost, Tim Kadlec, and Ethan Marcotte on IM isn't so bad

David Rupert

HB: What questions do you ask a client to make sure he/she really needs a responsive website and not a mobile site or application? Or do you believe any website should be responsive?
David Rupert: We (Paravel) tend to get hired to do responsive work so our clients usually already see the benefits of mobile first RWD, but yes, I tend to believe that all sites or apps can be designed to be responsive unless there's an extreme use case, need, or budget to do otherwise. RWD does take some effort, but I think it can be a great tool in reducing technical debt and organizational overhead. So I guess the biggest questions are: Why do you think you need separate sites? And do you have the budget to fully maintain and keep content and feature parity across all platforms?

HB: Are there any tools/frameworks that help you build responsive sites faster and easier? Have you ever used Bootstrap?
DR: I don't usually start a project with a framework. I home-rolled a simple grid that we've used in the past, but we're getting more "bespoke" and building to the project's needs. I did use Bootstrap on a11yproject.com, that I built in 24 hours, so it's a great tool for getting an idea out quickly.

HB: Is your personal site/blog responsive or not? Why?
DR: Yes, my personal site is responsive. It's just a column of text, so not really that hard to implement. But blogs and personal sites make great playgrounds for responsive experimentation. I really encourage any designer/developer to play and experiment. If you dig around on my site, you can see some of my experiments: video embeds, charts and graphs, and a responsive timeline.

HB: Which great resources on responsive web design would you recommend?
DR: There are tons, but Brad Frost's Responsive Patterns library is probably the best resource for deconstructing a responsive design. It's almost à la carte in how you can pick and chose components for your site. Responsive Design Weekly is a great newsletter to subscribe to if you want a good digest. And of course follow @RWD on Twitter for near daily inspiration and discussions.

Helen Bailey is a part of the TemplateMonster team. TemplateMonster is a web design company offering WordPress themes, responsive WP themes and other design-related products.