Web Design Weekly #43


Secret src

There’s been quite a lot of action this week around the subject of standardising responsive images. Jeremy Keith looks at the two different matters in detail, the process and the technicalities. (adactio.com)

Responsive Images and Web Standards at the Turning Point

The goal of a “responsive images” solution is to deliver images optimised for the end user’s context, rather than serving the largest potentially necessary image to everyone. Unfortunately, this hasn’t been quite so simple in practice as it is in theory. (alistapart.com)


Really short answer: SASS. Slightly longer answer: SASS is better on a whole bunch of different fronts, but if you are already happy in LESS, that’s cool. At least you are doing yourself a favor by preprocessing. Much longer answer: Read Chris’s awesome post. (css-tricks.com)

Smashing Daily

Early this week Smashing Magazine released a new daily post called ‘Smashing Daily’ which is written by Vasilis van Gemert (aka The Daily Nerd). (smashingmagazine.com)

The Unbearable Lightness of HTML5 (zeldman.com)

Adobe Creative Cloud (adobe.com)


First, Understand Your Screen

As web developers, we will often need to know the screen size of the device we are displaying content on. Perhaps on the server, perhaps on the client, perhaps to be used as a clause in a media query. //Epic post by James Pearce (Mobile Developer Relations @ Facebook). (tripleodeon.com)

Building The Flickr Web Uploadr

The new Flickr Web Uploadr is the result of a good amount of prototyping, research and good old-fashioned testing across the team that built it. The article goes into some of the details behind the “grid” – the area where photo thumbnails are shown – and sheds a little light on some of the thinking and logic behind the scenes. It’s a little lengthy, but don’t worry, there are pictures! (code.flickr.com)

Don’t link to resources inside of source code repositories (zoompf.com)

So you wanna conditionally load assets for your web app? (blog.grayghostvisuals.com)

Building a Nested Responsive Grid with Sass & Compass (viget.com)

Designing in the Browser is Not the Answer (andybudd.com)

10 Questions with Jeffrey Zeldman(creativebloq.com)

Dealing with the dickheads (boagworld.com)

Tools / Resources

3D Acceleration On Web Pages

Drew Wilson shares a neat little trick about how to speed up browser painting by using the handy rotate3d(x, y, z, angle). (vimeo.com)

Get Yourself Preprocessing in a Few Minutes

Chris Coyier gives a quick overview of how to get into the brave new world of preprocessing. He shows off some tips and tricks and is worth a watch even if you are already a preprocessor. (css-tricks.com)

A cool graph showing the relationship of various web technologies to each other (github.com)

1500 Vector Icons for Wireframes and Interface Design (webalys.com)

Optimizing Graphics with CSS Masks (methodandcraft.com)

OnMediaQuery – Responsive Javascript (springload.co.nz)

Sublime Text 2 tips (opensourcehacker.com)


Sketchnotes Book

In 2011, Eva-Lotta visited lots of UX and design events and took visual notes of over 100 talks by inspiring speakers and panelists. She has just released her book, which looks awesome! (sketchnotesbook.com)

Desks for your inspiration

Net Magazine asked 20 leading web designers to show off their work stations. (netmagazine.com )


Early this week Elliot released another redesign of his site and has already pushed out 3 awesome posts focusing on ‘tomorrow’s web type today’. As always, great work! (elliotjaystocks.com)

Brad Frost’s talk from Mobilism 2012 (ustream.tv)

The Story of Send(google.com)


Front-End Engineer at Yelp in San Francisco (jobvite.com)

Treehouse is hiring like mad! (teamtreehouse.com)

Last But Not Least…

Please Don’t Learn to Code (codinghorror.com)