Web Design Weekly #65


HTML5 Boilerplate Web Development Book!

Pre-order Divya Manian’s new book! The book aims to be a practical guide rich with information on getting the best out of the boilerplate. This book is for all developers who are familiar with creating web projects using HTML, CSS, and JavaScript, however, no deep knowledge is necessary. (amazon.com)


Prototype iPhone apps with simple HTML, CSS and JS components. Built by Dave Gamache, Connor Sears, and Jacob Thornton who all worked at Twitter once upon a time… Awesomely executed product and site! (github.com)

A Book Apart, Content Strategy for Mobile (abookapart.com)

The CSS physical unit problem (quirksmode.org)


Responsive Navigation: Optimising for Touch Across Devices

As more diverse devices embrace touch as a primary input method, it may be time to revisit navigation standards on the Web. How can a navigation menu be designed to work across a wide range of touch screen sizes? (lukew.com)

Writing Fast, Memory-Efficient JavaScript

JavaScript engines such as Google’s V8 (Chrome, Node) are specifically designed for the fast execution of large JavaScript applications. As you develop, if you care about memory usage and performance, you should be aware of some of what’s going on in your user’s browser’s JavaScript engine behind the scenes. (smashingmagazine.com)

Trimming the Fat

Website optimisation can be a cruel game; everything has a number that begs to be reduced, but doing so requires a lot of experimentation, research and testing. When you’re playing with the last hundred or so kilobytes, there’s little reward for your effort. This great overview from Paul Robert Lloyd will hopefully save you from playing the same guessing game he had. (paulrobertlloyd.com)

Every Desktop Design Has To Go Finger-Friendly

Touch has landed on the desktop. A whole new category of touch devices are flooding the consumer market in coordination with the release of Windows 8: touchscreen laptops and tablet/keyboard combos. These new hybrid combinations of touch and keyboard create a new ergonomic environment and fresh demands on designers. (globalmoxie.com)

Responsive background images with fixed or fluid aspect ratios (voormedia.com)

The Life and Death of Icons (ustwo.co.uk)

HTML5 mythbusting (hacks.mozilla.org)

Tools / Resources

An Introduction to Handlebars

If your site’s data regularly changes, you might want to take a look at Handlebars. Handlebars is a template processor that dynamically generates your HTML page, saving you time from performing manual updates. (net.tutsplus.com)

Web development for Windows Phone

Internet Explorer for Windows Phone is based on Internet Explorer for the desktop; however, there are differences that web developers should consider. (msdn.microsoft.com)

Ten things I didn’t know about HTML

Want to take your inner nerd to the next level? Well, Mathias Bynens can help. In this video, Mathias covers all kinds of wacky quirks that I am sure you don’t know. (vimeo.com)

MQtest – Identify which media queries your device responds to (mqtest.io)

Wireframe – minimal wireframing tool (wireframe.cc)

Retinafy your websites with Sass (github.com)

Chrome Canary for Developers (paulirish.com)

Airbnb JavaScript Style Guide (github.com)


Exploration of Single-Page Websites

The websites showcased in this Smashing Magazine article let you scroll, but they also provide alternative ways of finding cues and means for getting around. Some great inspiration which triger some great ideas for alternate ways to navigate content. (smashingmagazine.com)

Instagram Profiles on the Web! (blog.instagram.com)

Ghost — rethinking WordPress (onolan.org)


Web Designer at Fox News

Fox News Digital is looking for a talented Web Designer to join the Strategy & Design team. As a Web Designer, you will be responsible for driving forward the look and feel of all Fox News and Fox Business web properties. (foxnews.com)

Senior UX Designer at StumbleUpon (stumbleupon.com)

Last But Not Least…

The current browser situation explained in one drawing (lolhehehe.com)