Remember Matt Stow and his responsive retina images using CSS and a spacer PNG? (Now updated.) Well, Matt’s been at it again, this time with a solution to the image map problem in responsive design. Matt’s solution recalculates area coordinates to match the image size on load and window.resize. Clever. View the demo page or download the plugin from Github.

A lot’s changed since I wrote the original ‘320 and Up’ — my ‘tiny screen first’ responsive web design boilerplate — one year ago.

I’ve been working on a small travel site over the last few weeks and came across an interesting responsive web design challenge.

Read it.

Using simple layout wireframes, this illustrates how a series of pages could work across these different devices, by simulating how the layout of each page would change responsively, to suit the context.

Another fabulous piece of work by James Mellerson a topic that’s been on my mind for longer than I can remember.

You know those responsively designed sites where — on small screens like smartphones — navigation is either hidden or set at the bottom of a layout, then revealed when you click a button? Well, I think we need a standard ‘show navigation’ icon for that button in responsive web design.

Cute.

Via: David Roessli

Poking around Speaker Deck, I found this short presentation from Luke Brooker. In it, Luke has similar thoughts about a responsive design process to those you might have noticed in my workshop slides and up-and-coming chapter for Smashing Book Three.

There was something else familiar about the presentation and it took me a while to figure out that Luke was one of the speakers on the Brisbane leg of What Do You Know, a fabulous night of informal, short talks organised by Web Directions.

Shame on me.

Check out Luke’s presentation on Speaker Deck as well as his accompanying blog post and Pattern Response.

I guess if you’ve been following my tweets or Instagram photos, you’ll know that I’ve been in Australia presenting a series of ‘Fashionably flexible responsive web design’ workshops. I had the most amazing time in Australia and I want to say a huge thank-you to John and Maxine for helping me make it possible. I’d also like to thank everyone who attended for contributing to the discussion and sharing their experiences.

I couldn’t have built a full day’s workshop without referencing the work of others. So my special thanks go to John Allsopp (again), Mark Boulton, Brad Frost, Jeremy Keith, Ethan Marcotte, Brian and Stephanie Rieger, Luke Wroblewski and all the designers and developers whose work I featured.

With the Australian tour now over, I’ll be working on adapting the workshop’s content for a new video. More on that another day. But today I’m making available the slides from my Australian workshops on Speaker Deck. Of course slides without commentary and context are worth only so much. But hell, you just had to be there.

Brad Frost wrote about Responsive Navigation Patterns, Alexis Fellenius Makrigianni followed up with his thoughts. Both mention a responsive design pattern that was the subject of much debate at this month’s series of Fashionably Flexible Responsive Design Workshops in Australia — transforming a navigation lists into a select menu using scripts like TinyNav.js at small screen sizes.

One of the most asked questions at this month’s Fashionably Flexible Responsive Design workshops in Australia was “responsive or device specific?” Here, Luke makes a case for each with, as always, a thorough list of further reading.

Allows ULs that open on li:hover to open on tap/click on mobile platforms such as Android, WP7 etc.

(Via Matt Stow on Twitter.)

Mark Boulton:

The template > slot > ad mental model is engrained both in advertisers, planners and web sites. Providing space for ads needs to be broadened into multiple spaces for one ad concept. This requires closer collaboration between advertisers and web sites, designers and marketeers and sales teams.

This is exactly the issue I’ve faced in my redesign work for STV. My solution, and one that seems to been accepted, has been to:

• Develop a custom grid for STV based on the size of MMU units
• Design a series of page regions to accommodate a fixed number of same-size ad slots to help with adaptive layouts
• Use min-width on ad containers
• Serve leaderboards above the 768 breakpoint only

With STV’s permission, I’d love to publish some of our solutions.

There’s been much written about responsive design, but so much of it has focussed on aspects of technical implementation rather than about the design decisions that responsive design demands. So next February (2012), I’ll be travelling down-under to Australia to host four, yes four, ‘Fashionably flexible responsive web design’ workshops.