Responsive Design Weekly #52

Hey everybody and welcome to the year long anniversary of Responsive Design Weekly!

Squiz new responsive site

For the past 15 weeks I’ve been thinking of different kinds of things I could do for this edition as a celebration, and now that the time has finally arrived I can share with you what that celebration is…..

Well sadly it’s nothing. What an anticlimax right!?!? I have a couple of things to say though.

Firstly a massive huge loving thanks to Laura, my loving finance, for putting up with me ditching all our Thursday night plans and staying up late to put together the newsletter each week over the past year. XO. Also a big thank you to the sponsors who have recently started and have helped cover the cost of the newsletter and hosting, it has made a huge difference. My biggest thanks is to you. Without your subscription, continued support and your kind words in emails and tweets this would exist at all. Over the past 12 months 162h50m  have been spent on putting the newsletters and site together, and thanks to your ongoing support we’ve reached 7470 subscribers as this newsletter goes out today.

Before we get into the links this week I wanted to remind you that next week is the Responsive Design Summit. Last years single day event was amazing and this year they’re spreading it across three days and three streams including performance, strategy and technical. You can save 20% by signing up with the code below and I look forward to chatting with you in the chat room during the event.

Headlines

Media Queries are a Hack by Ian Storm Taylor

What? How dare you! Oh wait, it turns out that Ian has some really good points in this post. He is pushing for an element media query approach instead, which is interestingly there was a js hack to do the same thing that we linked up in last weeks newsletter. Could there be an @element in the near future?

Our Sponsor

Bring the Experts to Your Desktop

Get 20% off now w/ 20RDWEEKLY code to see RWD experts like Trent Walton, Dave Rupert, Jen Simmons, Ben Callahan and many more for the 3-day online, live conference. Recordings are part of ticket price.

Articles

Hack Your Maps

I thought this was a great article from a list apart looking at maps today, they even finish off with the responsive layouts.

Responsive Maps

Trent takes a look at responsive maps discussed in ALA and the dangers of making them full width. Beware!

Reorganization

Trent (on fire this week) takes a look at some possible workflow changes within the web design process. Get the design out of photoshop sooner and start building in the medium it is intended for will identify any possible issues early on.

What’s Hot and What’s Not

Take a look at a few of the popular RWD sites and see what they’ve done well, at least according to 1 web designer.

Is Your Responsive Web Design too Fragile?

Managing breakpoints can be problematic, especially when browsers approach the same feature in different ways. Make sure you’re not going device specific and the difference between 768 and 772 isn’t always tablet and desktop.

New responsive site

Take a look at how 3seven9 approached their responsive design breakpoints.

The abuse and misuse of Responsive Web Design

A nice insight into some misguided approaches to responsive design.

Nutty responsive assumptions

In this post Andy Clarke takes a look at some silly assumptions made while coming up with some media queries for his nutty header.

Great Responsive Web Design is a Matter of Process

It’s not all about the design or the technique, it’s about the process

Case Study from Breastcancer.org

Articles that look into the approach and decision making when deciding how to build the site are invaluable. This article takes you through the journey and shares some important figures

Tools, Tutorials, and Workshops

TOOLS

Free responsive wireframes (GIF)

A great animated gif from dribble with a link to a psd if you want to take it further.

Responsive Nav

This little JS plugin has a new home and some new features thanks to the hard work of @viljamis.

WORKSHOPS

Ampersand 2013 · RWD Workshop

This full day workshop will help you to construct web sites that will feel natural on a whole range of devices, from mobile phones to tablets, laptops, e-readers and devices we haven’t even thought of yet.

Inspiration

Squiz

This weeks image has come from Squiz with the launch of their new website (who also happens to be where I work now). The team did a wonderful job with some tight deadlines and I’m looking forward to digging further into the implementation.

…and Finally

Web design trends: Responsive web design

It was great to see the am I responsive tool being used across the web, they even got in touch to see if it was okay to use the images. That’s what the tool is there for folks, go crazy (links always welcome but not required).

That’s all we’ve got from this week. A big thanks to everyone that voted for Am I Responsive in the .Net Awards this year. It was an honour to be in the same category as some of the other wonderful side projects.

As always, if you have any articles that you think should be included make sure you reply to this email or shoot me a tweet and let me know.
Thanks for subscribing and making it all the way to the end!

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>