Web Design Weekly #144


Add Dynamic Hues To Your Videos With CSS

Anselm Hannemann explores a pretty rad technique to colorize a video with CSS. A word of warning this technique might effect your site’s performance. (helloanselm.com)

Six technologies that will change the web platform (speakerdeck.com)


Responsive Images using and srcset/sizes explained

A great talk by Matt Steele about Responsive Images. He touches on where most of the bloat is coming from in most websites these days and tips to keep your site lean and fast. (matthew-steele.com)

What You Should Know About Webpage Rendering

Alexander Skutin gives some practical advice on optimisation and a little background into how browsers optimise rendering. (frontendbabel.info)

Using Node.js in Production

When running a node application in production, you need to keep stability, performance, security and maintainability in mind. In this article, Jeff Dickey outlines what he thinks are the best practices for putting Node.js into production. (flippinawesome.org)

Technical Debt 101

A primer about technical debt, legacy code, big rewrites and ancient wisdom for non-technical managers. A great read. (medium.com)

Structuring, Grouping and Referencing in SVG

SVG comes with its own ways for structuring a document by means of certain SVG elements that allow us to define, group and reference objects within the document. In this article Sara Soueidan goes over these elements, highlighting the differences and advantages. (sarasoueidan.com)

Using SVG stroke Attributes (jonibologna.com)

Tools / Resources


A collection of micro-optimisations aimed at making writing very fast JavaScript programs easier. It includes fast replacements for several built-in native methods. (github.com)

Preprocessing is for Everybody

If you are still new to the preprocessing world this presentation by Chris Coyier should help give you a great overview and some direction if you decide to take the leap. (aneventapart.com)

JavaScript Modules

The next version of JavaScript comes with a module system heavily inspired by Node.js modules. This site is dedicated to explaining how they work. (jsmodules.io)

Autopolyfiller — Precise polyfills

This is like Autoprefixer, but for JavaScript polyfills. (github.com)

Simpl – simplest-possible code examples, nothing more (simpl.info)

this: Taking JavaScript out of Context (youtube.com)

Getting Your PageSpeed Score Up (youtube.com)


How and why Prezi turned to JavaScript – and why it took four years (medium.com)

Moving Atom To React (blog.atom.io)


Web Quality Assurance Engineer

MindSource is in search of multiple junior web developers. You will use your great HTML, CSS and JavaScript skills to help test and review pre-releases of our client’s well-known websites. (ziprecruiter.com)

Advertise in next week’s newsletter →

Last But Not Least…

The deferred font loading logic for Smashing Magazine (github.com)

WebP at YouTube (youtube.com)