Web Design Weekly #269


Base64 Encoding & Performance

In this article Harry Roberts shares some insights into why you should’t use base64 in CSS and why base64 and gzip don’t work well together. (csswizardry.com)

Tools for Radicals (medium.com)

Sponsor Web Design Weekly and reach over 23,430 passionate designers and developers


Do we need a new heading element?

There’s a proposal to add a new ‘h’ element to the HTML spec and Jake Archibald in this post helps us understand the finer details. (jakearchibald.com)

Do responsive sites have to be so tall on mobile?

Height is often overlooked in responsive design. On mobile, pages can get pretty long. Kevin Vigneault asks the question. Should we address this? (viget.com)

Universal JavaScript Apps with React Router 4

Patrick Hund explains how to use the latest version of React Router both on the server side and the client side. (ebaytech.berlin)

JavaScript Start-up Performance

Once the browser has downloaded our page’s scripts it has to parse, interpret & run them. In this post, Addy Osmani dives into this phase and explores how to make sure it’s as fast as possible. (medium.com)

Webpack 2 and beyond

Sean Larkin shares some infomation about the awesome new features in Webpack 2 and why you should make the time to upgrade. (medium.com)

Researching Design Systems (danielmall.com)

Tools / Resources

Webydo – Powerful Web Design Software. CMS & Hosting Included.

Design, launch and manage pixel-perfect websites faster with Webydo’s all-in-one web design software. Perfect for web designers and digital agencies, Webydo has all the tools you need to run and grow a web design business from client billing to white label branding and more. (webydo.com)


A playground for creative coding using JavaScript and the canvas element. A little background on Sandpit can be found here and is totally worth a read. (sandpitjs.com)

Build an Off-Canvas Navigation With CSS Grid

Ian Yates Today explains how to build the classic an off-canvas navigation, using CSS to do the toggling and CSS Grid to form the page structure. (webdesign.tutsplus.com)


Automate your team’s software development processes, from testing through to delivery, no matter the language, environment or toolchain. (buildkite.com)

Best Practices for Writing React Components

Scott Domes from MuseFind shares a guide that represents some best practices when writing React components. Useful, whether you’re a beginner or experienced React developer. (medium.com)

Webpack Lighthouse Plugin

This plugin allows you to run Lighthouse from a Webpack build. (github.com)

Automating Local WordPress Site Setup with Scripts (deliciousbrains.com)

Moving to HTTPS (movingtohttps.com)

Service Worker Detector (github.com)


Optimizing Web Applications with Sam Saccone and Jeff Cross (devchat.tv)

Self Developer – Sara Soueidan (beingfreelance.com)

SEEK Style Guide (seek-oss.github.io)


Senior Product Designer at Strava

Come be a part of a team of designers passionate about creating beautiful and inspiring design experiences that help Athletes train, connect, and reach their full potential. (strava.com)

Need to find passionate developers or designers? Why not advertise in the next newsletter

Last but not least…

Fitness Apps with Web Bluetooth (medium.com)