ARCHIVE · FRONTEND RESOURCES · JULY 2020

Collective #614

Resource roundup CSS · Tooling

A roundup from the week in July 2020 when GitHub quietly shipped profile READMEs and the frontend community spent the weekend decorating theirs. The rest of the set held up on its own: a revival of the CSS Zen Garden idea, a talk on duplication versus abstraction that still gets quoted, and two accessibility pieces that answer questions documentation avoids.

01
How To Create A GitHub Profile README

Monica Powell documents the then-new GitHub profile README feature days after it appeared, the post that taught half of GitHub the trick.

aboutmonica.com
02
Awesome GitHub Profile README

The companion list: a curated collection of profile READMEs pushing the new feature well past its intended limits.

github.com
03
The WET Codebase

Dan Abramov’s conference talk arguing that duplication is often cheaper than the wrong abstraction.

overreacted.io
04
Style Stage

Stephanie Eckles’ modern revival of the CSS Zen Garden idea: one HTML file, restyled by contributors, showcasing what current CSS can do.

stylestage.dev
05
Grids Part 1: To grid or not to grid

Sarah Higley on when an ARIA grid role helps a screen-reader user and when it actively harms, with the decision tree most articles skip.

sarahmhigley.com
06
The State of Pixel Perfection

Ahmad Shadeed on why pixel-perfect implementation stopped being a coherent goal, and what to aim for instead.

ishadeed.com
07
Webwaste

Gerry McGovern’s A List Apart piece counting the environmental cost of bloated pages: early, uncomfortable and still relevant.

alistapart.com
08
Zettlr

An open-source Markdown editor built around the Zettelkasten note-taking method.

zettlr.com
09
Foam

A personal knowledge-management system on top of VS Code and GitHub: the linked-notes idea, self-hosted in your editor.

github.com
10
Super Expressive

A JavaScript library that builds regular expressions from readable, chainable natural-language-ish code.

github.com
11
Tabler Icons

A large free SVG icon set with consistent stroke weight, adjustable directly in the browser.

tablericons.com
12
AudioMass

A full audio editor running entirely in the browser: waveform editing with no upload and no install.

audiomass.co
13
Button state and accessibility

Chris Ferdinandi on communicating toggle state to assistive tech: aria-pressed versus swapping labels.

gomakethings.com

A handful of demos from the original set have gone offline since and are omitted. What remains is the part of a roundup that earns archiving: the references people were still linking to years later.