Responsive Interview with Dave Rupert and Chris Coyier

Back in 2012 I asked the same 4 questions to a small number of people that contribute consistently to the community through the way of writing and speaking and building out demo’s for us to all follow. This year I’ve asked them to answer those same questions 3 years down the line… lets see what they have to say.

Hello.

Hello and welcome to edition 186 of the Responsive Design Weekly newsletter, and the first week of the responsive interview series Part 2.

Back in 2012 I asked the same 4 questions to a small number of people that contribute consistently to the community through the way of writing and speaking and building out demo’s for us to all follow. This year I’ve asked them to answer those same questions 3 years down the line… lets see what they
have to say.

I will keep the same order as the last time, which means this week we will hear from Chris Coyier and Dave Rupert (I’ve reused the old image, so imagine them 3 years older).

Without further ado, welcome back to the interview series.

Dave Rupert

Dave is a front end developer who works at Paravel Inc. He is the co host for Shop talk show and has been recently working on a progressive web app called Day Trip.

What was the best new implementation of RWD you saw in 2015, and was there a redesign that took your eye

Hmm… tough to not repeat my 2012 self here. The 2015 dconstruct conf site was again a major standout but I think the biggest redesign project that impressed me the most was the CodePen redesign. Sparkbox and the team at CodePen did a great job improving a product I love and use everyday. What
a feat! Imagine trying to redesign something that a bunch of snobby web designers and programmers use every day. That’s no small task and they did an excellent job.

What are 2 RWD Frameworks/Plugins/Shims/patterns that you always seem to go to? (could be Sass mixins, image sizes, sever configurations, navigation patterns, )

First and foremost

<picture>

!!! What a wonderful addition to the HTML language. Mega-high fives to all the individuals involved. I probably use a variant of the following on every project to maintain image hierarchy across viewports:

      
  <picture><source src=”16:9-image.jpg” media=”(min-width: 500px)”></source><img src=”4:3-image.jpg”></picture>
  
  

The second thing I probably use all the time is Pattern Lab or some homebrew version of it. Developing well-crafted modules on the micro-level is very rewarding.

What is the one thing with sites you would like to see improved/developed in 2016?

I’d like to see tooling improve this year to genuinely make things easier. I still feel tools and automation are great, but I also sort of feel like we opened Pandora’s Box of Automation over the past few years and now making even the simplest of websites requires gigs of node_modules installed,
setup, and configured. That’s dark magic for beginners and creates a high barrier for entry. For me the scale on tooling has tipped from “Look at how helpful this is!” to “Ughck. Look at all this stuff I have to download and setup.”

If you could offer 1 piece of advice around building responsively what would it be? (can be strategy, design, code, anything else)

Never underestimate the human side of making websites. What I mean is, it’s easy to think everything is a matter of finding the technical solution to a problem, but often I’ve seen technical solutions end up creating more people problems. People problems are the hard problems to solve.
Whether that’s more work hoops necessary to make a “cross-platform, multi-device, that works on a space yacht” or something as simple as talking out a problem with other people in the office. Behind every website is a usually a team of people working hard to put something out there,
it’s not just 1’s and 0’s.


Chris Coyier

You will probably know Chris from the awesomeness that is CSS Tricks. Chris is also one of the team behind CodePen and has been running the Shop Talk Show with Dave for almost 200 episodes now.

What was the best new implementation of RWD you saw in 2015, and was there a redesign that took your eye

These days, it’s very rare to see a new site or redesigned site that isn’t responsive. I love The Atlantic’s redesign this year. Conference sites are often fun to look at since they can kinda reinvent themselves every year. The designs for XOXO and Webstock are pretty wonderful.

What are 2 RWD Frameworks/Plugins/Shims/patterns that you always seem to go to? (could be Sass mixins, image sizes, sever configurations, navigation patterns, )

My tackling of RWD usually goes like:

  • Try and do as much as I can with CSS. Nested media queries in preprocessors are still the greatest.
  • If I have to, use JavaScript to conditionally load stuff.
  • If I need to load a completely different document, do server side mustard cutting.

What is the one thing with sites you would like to see improved/developed in 2016?

Element queries sound like they could potentially happen. The use cases are pretty clear. 

If you could offer 1 piece of advice around building responsively what would it be? (can be strategy, design, code, anything else)

I’d suggest at least trying to approach the design of something mobile-first. If you can’t dive in on an entire project, try a single page or something. I don’t think it matters much how you approach writing media queries or anything like that, I think it forces you to think about what really matters
and what doesn’t.


That’s all for this week, thank you very much Dave and Chris for your contributions once again.

Next week we’ve got Paul Robert Lloyd and Laura Kalbag which should be awesome… oh and look what arrived today! If you’ve already signed up then you’ll be notified very shorlty they’re ready for purchase.

See you next week!

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.