Responsive Design Weekly #32

Responsive Images Community Group

Welcome to another week of responsive goodness. This weeks image is something that everyone should be familiar with… and if you’re not you should really head over to the responsive images group and check it out.

We are a little bit light on this week due to packing up a house in Australia into boxes and shipping them off to the UK where we will follow at the end of the year.  Fortunately there are a few go to people that always seem to have some responsive goodness for us, thank you LukeW and Brad.

Next week will be the start of the Responsive Design Weekly interview series and we’ve got some great contributors. The list is pretty impressive, check out who’s contributing at the conclusion of the email.  The first interviews will be with Dave Rupert and Chris Coyier. Excited!

Alright enough of that now, lets get on with the links.


Marcos Caceres has been working on a generic srcset parser which matches WHATWG document.  Ideally, it should be able to hook it into <img>, <picture>, and <source> for testing and refinement.  The code is far from done, so he could use some help. Right now, he’s mostly wanting to get it 100% conforming to the WHATWG spec.  If this is your thing it’s a great opportunity to get involved in building something that will help shape the site implementations of the future.

Responsive Menu Concepts
When it comes to responsive design we are faced with various techniques on how to best handle altering our navigation menus for small screens. The resources seem endless. Here are four main concepts with advantages and disadvantages of all of them.


Data Monday: Physical Device & Viewport Sizes
With the arrival of the 7″ iPad mini Luke Wroblewski takes a look at how web pages scale when devices get smaller but the resolutions remain the same.

Mobile Apps: The Trouble With Using ‘Responsive Design’ 
An opposing view on responsive design in this article that sides with a mobile specific method. A good read, although some of the arguments for mobile could be argued just as easily for responsive design.

Responsive Image Techniques & Resources
When creating images for responsive layouts you don’t need to spend a whole lot of time coding. There are just a couple of techniques which, if followed properly, will allow you to scale your website very quickly, check out a few of them in this article on Speckboy

Be careful who you build
Jordan Moore illustrates a real problem in situations where web designers and developers try to design for this eventuality – to dazzle and amaze their industry colleagues while losing sight of the project’s audience.

Adaptive Maps
Some web interface elements require only basic resizing in order to function properly across contexts. However, not everything is that simple, and maps is one of those cases that requires more consideration.

The responsive web will be 99.9% typography
James Young had a nagging feeling that the trend towards increasingly large typography and simpler layouts was just that, a trend. He now think it’s a possibly a logical necessity.

Tools, Tutorials, & Meetups


ish. is yet another viewport resizer. What’s with the name, you ask? Small-ish. Medium-ish. Large-ish. That’s the idea.


A responsive workflow for Axure
Axure may be shy of responsive features, but the beloved UX tool can still be used on your next responsive project with a little help from responsive frameworks

15+ Comprehensive Responsive Web Design Tutorials
In this article gonzo shares 18 useful responsive design tutorials to help you get started with responsive designing including fluid grids, fluid images and media queries.

Getting responsive videos with FitVids
This is a short tutorial and video cast on how to get up and running with fitvid.js, a little jquery plugin developed by Dave Rupert and Chris Coyier.

Responsive Web Design and Web Analytics
A great technique on investigating your analytic funnels across devices sizes and orientations.

New sites & Inspiration

Here’s a couple of new sites released by our readers

Oliverhelms Responsive Portfolio – a responsive portfolio site with a great article on RWD. – a responsive Magento e-commerce store.

Just launched a site? Getting ready for a launch? Well then send us a link to the sitewith a bit of information about the choices you made in the build and we’ll feature you in this section.

Wrapping up…

That’s it for this week. Next week kicks off the interview series that will consist of the most influential minds when it comes to responsive design answering the same four questions.

I’m very happy to say that our contributors include Paul Robert LloydMatt Griffin,Trent WaltonBen CallahanLaura KalbagMat MarquisTim KadlecBrad Frost,Jeremy KeithDave RupertChris CoyierJordan MooreAndy Clarke, and Stu Robson.  First up will be the Shop Talk show wonders Chris Coyier and Dave Rupert.

Thanks for subscribing!

Responsive Design Ebook

A collection of interviews, tips, tricks and some responsive sketch pages in one easy to download file.

Learn from more than 26 leading responsive design experts across more than 80 pages for the price of an expensive coffee. Or, think of it like buying me a beer to say thanks for sending you a newsletter each week…. plus you’ll learn tons too.

Buy Now for just $6.99

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>