Watch/Star/Fork

wsf-xxxii

News

Safari Technology Preview 135 was released with support for the accent-color CSS property, and for lazy-loading images with the loading=lazy HTML attribute, in line with Firefox and Chromium-based browsers. It also premieres the new viewport units that solve the 100vh dilemma on mobile.

Articles

UX, Accessibility

Growing in Your UX Career, a guide by Nielsen Norman Group. Unsure where to start? Use this collection of links to articles, videos, and a free report for advice to grow in your user experience career.

The last two installments in Henny Swan's Browsing with assistive technology series: Browsing with screen magnification and Browsing with speech recognition.

In Defence Of Dialog has Sam Thorogood walk us through some interesting use-cases for the <dialog> element.

CSS

My Custom CSS Reset, Josh W. Comeau's copiously annotated contribution to the time-honored tradition that is the Reset Stylesheet. I myself have been keeping cssremedy at arm's length for the purpose.

Animating height: auto, a novel solution by Nelson Menezes to the classic head-scratcher using CSS Grid.

Cross-fading any two DOM elements is currently impossible, an interactive article in which Jake Archibald illustrates how alpha complicates the compositing of overlapped elements.

Creative Coding

Processing: the Software that Shaped Creative Coding, an oral history of the programming language that cracked the world of code for artists and designers by Liz Stinson. Here's Part I and Part II.

Creating Generative Patterns with The CSS Paint API by George Francis, on using JavaScript paint worklets to draw colorful geometric backgrounds.

Pseudo-Blue Noise, an interactive notebook by Job van der Zwan describing a fast approximation of blue noise for image dithering.

Software engineering

Peritext: A CRDT for Rich-Text Collaboration by Ink & Switch. We believe that CRDTs for rich text could enable new writing workflows, with powerful version control and support for both synchronous and asynchronous collaboration. In this work, we have shown that traditional plain-text CRDTs are not capable of preserving authors’ intent when merging edits to rich-text documents. We have developed a rich-text CRDT that supports overlapping inline formatting, and shown how to implement it efficiently.

How Placemark implements undo/redo to make map making safe and chill by Tom MacWright. Undo is a funny feature to implement, because it can be incredibly difficult to design and code, and once you're done users nod and say, 'oh, okay, it has undo.'

Quality in Software, a presentation by Rasmus Andersson at Seattle Handmade 2021.

Software Development Waste, a summary of causes for activity that produces no value for the customer or user extracted from the eponymous paper.

"This project will only take 2 hours", Austin Z. Henley on how even the simplest-sounding application reveals itself as complex once you spell out how you expect it to work.

A couple of quick programming language tours: A half-hour to learn Rust by Amos, which inspired A half-hour to learn Zig by Isaac Yonemoto (via Simon Willison, André Staltz). Really helpful for get a bit of a mental model going on, would love one for Go to round things off.

Jordan Scales uses a Topological sort algorithm to sort out the CSS z-indexes (z-indices?) of elements based on a series of A above B constraints.

Most of my projects are the result of yak shaving (some of which has been going on for a while now), so I found myself nodding along Lea Verou's On Yak Shaving and <md-block>, a new HTML element for Markdown.

Tools & Resources

I was researching early Apple Human Interface Guidelines and stumbled upon GUIdebook, which is just an incredible website dedicated to preserving and showcasing Graphical User Interfaces, as well as various materials related to them. It was built by Marcin Wichary almost twenty years ago.

tldraw, a tiny little drawing app by Steve Ruiz.

Shadow Palette Generator by Josh W. Comeau, a tool to help you generate CSS box-shadow values.

Remix, a new React-based web framework, similar in purpose to Next.js and Astro.

container-query-polyfill, a small polyfill for CSS Container Queries by Surma.

microdiff, a fast, zero dependency object and array comparison library. Significantly faster than most other deep comparison libraries and has full TypeScript support.

hurl, a command-line tool built on top of curl that runs HTTP requests defined in a simple plain text format. It can perform requests, capture values and evaluate queries on headers and body response.

Media

Two lovely websites. An archive of late artist Gerard Hoffnung's work, an extensive collection of Hoffnung’s cartoons, his biography, rare film footage and audio and an extensive archive of material and memorabilia. Women in Type, rediscovering women’s contribution to type history.

A casual game. Holedown, where you dig deep underground by shooting balls and breaking blocks, traversing your way to the planet cores, was pretty captivating. (via Josh Millard)

An infectious song. Alex Cameron as stylish as ever on his new single, Sara Jo.