Web Design Weekly #120


About Variables in CSS and Abstractions in Web Languages

Variables are coming to CSS, there is no stopping it. In this post Chris Coyier shares his thoughts on situation. (css-tricks.com)


Jeremy Keith shares his thoughts on why keeping complexity out of CSS is a good thing. (adactio.com)

A Home Base for Design Projects

Project hubs can help tame the chaos of the design process by providing a home base for all key design and development materials. Keep the design artifacts in the browser and give clients and colleagues quick insight into your project’s progress. (24ways.org)

What You May Not Know About the Z-Index Property

The z-index property in CSS seems simple enough, but there’s a lot to discover beneath the surface if you really want to understand how it works. In this tutorial Steven Bradley clarifies the inner workings of z-index, by looking at stacking contexts and a few practical examples. (tutsplus.com)

A Moment to Breathe

Like most things in life, it’s about striking a balance between the frantic tempo of our industry and our own internal rhythms. In this post Nick Cox recaps on what he learnt about finding the balance. (alistapart.com)

Tools / Resources

The Runtime Performance Checklist

Most performance advice today centers around Page Load Time (PLT) and this is, of course, critically important to success. We reduce or remove requests, compress our assets and minify JavaScript and CSS. It’s all good stuff, but it’s only part of the picture. (perfplanet.com)

Koa – next generation web framework for node.js

Koa is a new web framework designed by the team behind Express, which aims to be a smaller, more expressive and more robust foundation for web applications and APIs. (koajs.com)

Myth — CSS the way it was imagined

Myth lets you write pure CSS while still giving you the benefits of tools like LESS and Sass. You can still use variables and math functions, just like you do in preprocessors. It’s like a polyfill for future versions of the spec. (myth.io)

Creative effects for loading buttons

A set of flat and 3D progress button styles where the button itself serves as a progress indicator. 3D styles are used for showing the progress indication on one side of the button while rotating the button in perspective. (tympanus.net)

JSHint for Chrome Dev Tools

This extension will automatically run JSHint on JavaScript sources saved in Chrome Dev Tools. (github.com)

How Optimised Are Your Images?

Image optimisation is an essential step in a designer’s workflow, and with so many tools to choose from, there’s bound to be one that suits your needs. Data should bear heavily in your decision, so that you reap bigger rewards, but choose one that is convenient (smashingmagazine.com)

A collection of loading indicators animated with CSS (tobiasahlin.com)

Full-Stack JavaScript with MEAN and Yeoman (addyosmani.com)

Try Handlebars.js right now in your browser (tryhandlebarsjs.co)

Buttons — A CSS button library built with Sass & Compass (github.com)


The Year We Broke Everything

Some very powerful thought provoking words by Mike Monteiro. (the-pastry-box-project.net)

Why I create for the web (neave.com)


Front-End Engineer at Yelp – San Francisco

Our front end engineers are the glue between our engineering team for more than 108 million people who visit our site every month. Yelp is looking for a front end developer who walks the HTML, CSS and JavaScript stack with ease. In this role you would do everything from implementing new UIs and features to battling browser inconsistencies through daily release cycles. (yelp.com)

Post a job in a future issue of Web Design Weekly →

Last But Not Least…

JavaScript Developer Survey 2013: Results (dailyjs.com)

8 necessary Sublime Text plugins (mikejolley.com)

11 free video courses from Tuts+ (tutsplus.com)