Web Design Weekly #46


Hot in web standards!

Lea Verou summarises the latest need-to-know developments in the fast-moving world of the Working Groups. She covers the responsive images saga, CSS blending modes, Shadow DOM and lots more. (netmagazine.com)


Automate client-side unit testing in real browsers using the CLI. Developed by Ryan Seddon who is part of the Modernizr team. If you want to read more on Bunyip, Ryan also wrote a good post on his blog. (github.com)

WordPress 3.4 Is Coming Soon! Find Out What to Expect (wp.tutsplus.com)

Responsive Mode and Layout View in Firefox 15 (paulrouget.com)/

Offscreen Issue 2 (offscreenmag.com)


How CSS Handles Errors

Have you ever been curious about exactly how CSS’s error-handling works? It’s really simple according to Tab Atkins. (www.xanthir.com)

Focus on the right-hand side

Chris Da Sie argues users instinctively have greater trust for content that appears on the right-hand side of the screen. Do you agree? (netmagazine.com)

Accessibility and developers

Accessibility should not be opt-in but opt-out. Another great post by Paul Irish. A no-nonsense post with lots of great links and comments. I am sure we will see a lot more action in this area in the not too distant future. (paulirish.com)


Trent Walton give his thoughts on collaboration. He gives some great points and advice. In his experienced over the years he says it isn’t a particular technology or design style that determines the success of a project, but how well the collaborators—clients, web designers and developers—understand each other. (trentwalton.com)

Google recommends responsive design when possible for best SEO(searchengineland.com)

A Day in the Life of a Developer Evangelist (thenextweb.com)

Deep dive into CSS Preprocessors (verekia.com)

Tools / Resources

CSS Downloads by Media Query

Early this week Scott Jehl put together a GitHub page to test whether today’s browsers will download stylesheets that are referenced with media queries that would not apply on that browser or device. (github.com)

Density Converter

Travis Hines gives a good overview about different densities. He explains how to convert from one density to another and then gives you a Density Convertor to make your life easier. Travis is a good bloke! (teehanlax.com)

Understanding viewport

A comprehensive list of meta viewport examples to help you tame the mobile web beast! (github.com)


I have featured this before but thought it was worth featuring again as Griddle (Nicolas Gallagher side project) now has a dedicated GitHub page. If you didn’t catch it in the previous issue, Griddle is a fluid and modular grid system for modern browsers — IE8+, Firefox, Safari, Opera, Chrome. (github.com)

Font Awesome 2.0 released – 70 new icons, desktop font, vectors, IE7 support (fortawesome.github.com)

IE-friendly mobile-first CSS with Sass 3.2 (jakearchibald.github.com)

Text in Photoshop CS6 (bjango.com)

shortcutFoo (shortcutfoo.com)


Second Story

Super cool horizontal scrolling site by a cool looking company that also happen to have some jobs on offer. (secondstory.com)

Gilbert Guttmann’s personal site (gttmnn.com)

dConstruct 2012 – nicely executed responsive design (dconstruct.org)

Your Script Just Killed My Site (youtu.be)

Last But Not Least…

Instant Bug Fix (instantbugfix.com)