Web Design Weekly #308


CSS Grid for UI Layouts

Josh Marinacci shows us how to use CSS Grid to improve application layouts that need to respond and adapt to user interactions and changing conditions, and always have your panels scroll properly. (mozilla.org)

Chrome 68, Chrome will mark all HTTP sites as “not secure” (googleblog.com)

Sponsor Web Design Weekly and reach over 27,822 passionate designers and developers


Evolving Patterns in React

A look at some of the patterns that are emerging in the React ecosystem. These patterns improve readability, code clarity, and push your code towards composition and reusability. (freecodecamp.org)

Hyperapp for Redux refugees

A side-by-side comparison of Hyperapp and Redux. Hyperapp sure does look interesting but I’ll leave it up to you to make up your mind as I haven’t had the time to dive in. (medium.com)

Inside Typeform version 2

Part 1 of a 3 part series on how Typeform are rolling out the newest version of the product. Great to see a company taking the time to do things well. Inspiring. (typeform.com)

Shipping system fonts to GitHub

Mark Otto explains why GitHub made the change to system fonts, how they coded and tested it, how they shipped the new fonts, and what they’ve done since initially making the move. (markdotto.com)

People Don’t Scroll (and Other Page Length Myths)

A few myths to avoid and guidelines to follow when writing your page content. (uxplanet.org)

Tools / Resources

Replacing jQuery With Vue.js

Sarah Drasner covers some common use cases in jQuery and then explains how to switch them over to Vue, and why we’d even want to do so. (smashingmagazine.com)

Software Development made easy, visual and agile

Manage your design layouts & coding tasks, plan your timeline visually, and communicate with your team all in one place. Start using the project management tool built for designers and developers. (monday.com)

Everything you need to know about CSS Variables

Ohans Emmanuel shows us how variables work natively in CSS, and how we can use them to make out lifes a lot easier. (freecodecamp.org)


A JavaScript API for drawing unconventional text effects on the web. (blotter.js.org)

Debugging a Create React App with VS Code (youtube.com)

Drawing better looking curves (observablehq.com)


Building your own CDN for Fun and Profit (pasztor.at)

The Disconnect (thedisconnect.co)


Product Designer at Yelp

We’re looking for a senior Product Designer that can help Yelp conquer challenging opportunities across a range of mobile and web products. (yelp.com)

UX Designer at Canva

As a UX designer at Canva it’s your mission to create experiences that distill the complex into the simple and give ordinary people the ability to make extraordinary things. (canva.com)

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

Last but not least…

Web Fonts are ▢▢▢ Rocket Science (filamentgroup.com)