Links

Accessible Tooltips & Toggletips | Inclusive Components by @heydonworks

In this article, Heydon Pickering looks at situations which might call for a tooltip or else a toggletip, and formulates inclusive implementations for each.

The Sky Digital Toolkit

The Sky Digital Toolkit is the central resource for designers and developers to understand how to design and build digital products for Sky.

‪A Collection of Interesting Facts about #CSS Grid Layout, by @mmatuzo‬

Manuel Matuzović shares some of the lesser known features of CSS Grid.

The web accessibility basics, by @MarcoZehe‬

Marco Zehe's list of absolute web accessibility basics every web developer should know.

Design Principles, collected by Jeremy Keith (@adactio)

A huge collection of design principles from various disciplines. 

Space in Design Systems, by @nathanacurtis

From Basics to Expanded Concepts to Apply Space with Intent

Basecamp Employee Handbook

“So, this is where we’ll try to share what’s worth knowing about Basecamp the company, our culture, our process, and our history.”

Practical CSS Grid: Adding Grid to an Existing Design, by @meyerweb

“It’s been decades since CSS first emerged, but it’s never contained a system anything like this.” – Eric Meyer on CSS grid and the process of progressively enhancing his site to use grid.

Getting started with variable fonts, by @clagnut

Richard Rutter explains the basics of variable fonts and the new values coming with CSS4.

A Practical Guide to SVG on the Web, by @jakegiltsoff

The guide aims to give a practical overview of how you can use SVGs on your websites — with some tips and tricks along the way to get the most out of them.

Understanding Flexbox: Everything you need to know, by @OhansEmmanuel

A concise and complete introduction to CSS Flexbox.

Get the Balance Right: Responsive Display Text, by @clagnut ◆ 24 ways

Richard Rutter (Clearleft) shows how to use vmin and a hybrid method of sizing text using CSS calc() to achieve balanced font-sizes for different viewports.

cssreference – a free visual guide to CSS, by @jgthms

Learn by example cssreference.io is a free visual guide to CSS. It features the most popular properties, and explains them with illustrated and animated examples.

“Who Will Command The Robot Armies?” – a talk by @baconmeteor about accountability in automated systems

It’s a rant by Maciej Cegłowski about chatbots, machine learning, and the issues of accountability and power that go with automation.

Designing for the Web, by Mark Boulton

Modern web design is a discipline that spans a huge range of skills. In his book, Mark Boulton masterfully guides you through things like process and workflow, research, typography, colour, layout, and much more.

Using WebP Images – a great introduction by @malchata

If you want to fight large images and save bandwidth with WebP, a file format created by Google that provides superior lossless and lossy compression, then this article is a really helpful introduction.

Fractal – build and document web component libraries & styleguides

Fractal by @allmarkedup, frontend dev @clearleft, lets you build and document web component libraries and styleguides, and then integrate them into your projects. It is flexible, data-driven, and can be seamlessly integrated into your site.

The Web’s Grain – A view on designing for the web

One of the best articles on designing for the web, by @frank_chimero. As wonderful as important. Required reading.

Making And Maintaining Atomic Design Systems With Pattern Lab 2 By

Pattern Lab 2 is an open-source suite of tools to help you and your team create and maintain thoughtful UI design systems. At its core, it’s a static site generator that stitches together patterns and allows you to design with dynamic data.

How Will Web Components Change CSS Architecture?

With the slow rise of Web Components—the breakdown of interfaces into self-contained chunks of HTML, JavaScript, and CSS—will we see an evolution (or revolution) in how we manage the way we write, build, and bundle the CSS for our web sites?