Skip to content

Back to WatchStarFork

wsf-xxiv

The new CSS. Designing for the Unexpected by Cathy Dutton in A List Apart / gridless.design by Donnie D'Amato / The new responsive, web design in a component-driven world by Una Kravets / Making links easier to see and read on gov.uk with the new text-decoration-* properties, by Chris Ballantine-Thomas / leading-trim: The Future of Digital Typesetting by Ethan Wang / A Guide To Newly Supported, Modern CSS Pseudo-Class Selectors by Stephanie Eckles / Using Absolute Value, Sign, Rounding and Modulo in CSS Today by Ana Tudor

Ye olde CSS. There Is No Such Thing As A CSS Absolute Unit says Elad Shechter / CSS fix for 100vh in mobile WebKit, a good summary by Matt Smith / Things I Learned Reading Webkit’s UA Stylesheet by Jim Nielsen / Aligning a Button Label Vertically by Ahmad Shadeed

UI / Accessibility. Designing The Perfect Slider by Vitaly Friedman / Recents articles by Adrian Roselli: Scroll Snap Challenges, Multi-Function Button, Stop Using ‘Pop-up’ / Accessibility of the section element by Scott O'Hara / Enough with the role-play by Ian Lloyd / What does it mean for a system to be useful?, from 2014: “HCI has always focused on designing useful and usable interactive systems, but usability has dominated the field while research on usefulness has been largely absent.” / Design Affordance Controls by Brian Kardell / MODALZ MODALZ MODALZ, a fun guide to alternatives for the oft-maligned pattern / Command Palette Interfaces by Philip Davis / Call for web dev feedback: anchored positioning use cases + requirements by Melanie Richards / Drag–and–Drop: How to Design for Ease of Use by Page Laubheimer

JavaScript / DOM. Just-In-Time translations and code that writes itself, exploring uses for dynamic imports in JavaScript, by Dan Laush / Encoding data for POST requests, a roundup by Jake Archibald / URLPattern brings routing to the web platform / Building A Dynamic Header With Intersection Observer by Michelle Barker / Modern Web, guides and tools to work with the browser and avoid complex abstractions, akin to Open Web Components / comment-parser, a generic JSDoc-like comment parser / Why it’s okay for web components to use frameworks by Nolan Lawson / Recommended Drag Types in the MDN docs / Patrick H. Lauke's research on touch and pointer events: tests & demos, results, and a presentation

React. react-virtual, hooks for virtualizing scrollable elements in React / Blogged Answers: A (Mostly) Complete Guide to React Rendering Behavior by Mark Erikson / From the React 18 working group: Concurrent React for Library Maintainers, Glossary + ELI5

Performance, Web Vitals edition. Quick recap: LCP = Largest Contentful Paint, FID = First Input Delay, CLS = Cumulative Layout Shift / From the horse's mouth / The Humble <img> Element And Core Web Vitals by Addy Osmani / CLS in Practice by Nic Jansma / CLS: Measure and Avoid Visual Instability by Karolina Szczur / Improving CLS at Telegraph Media Group by Chris Boakes / Barry Pollard has written extensively on the topic: An In-Depth Guide To Measuring Core Web Vitals, How To Fix CLS Issues, A New Way To Reduce Font Loading Impact: CSS Font Descriptors

Performance, otherwise. Halve the size of images by optimising for high density displays by Jake Archibald / Embedded Google Fonts, a tool to embed font subsets in CSS / Conditional Style Loading? Not So Fast by Jim Nielsen, on how <link media='...'> can't prevent a stylesheet from being fetched; on the other hand, the technique lends itself to loading CSS asynchronously / mem, a function memoization library by Sindre Sorhus

Browsers. Towards richer colors on the Web by Felipe Erias / Overview of the RenderingNG architecture by Chris Harrelson / Hobson's Browser by Alex Russell

Engineering. The Missing Semester of Your CS Education, because proficiency with tools is often overlooked / Git from the inside out by Mary Rose Cook / New vocab: PAGNI (Probably Are Gonna Need It) according to Luke Plant, Simon Willison, Jacob Kaplan-Moss / Give me /events, not webhooks by Anthony Accomazzo / The Baked Data architectural pattern, i.e. “bundling a read-only copy of your data alongside the code for your application, as part of the same deployment” by Simon Willison / CRDTs go brrr by Seph Gentle

Tools & Resources. Allmaps, a set of open source tools that make it easier and more fun to search, explore, georeference and work with collections of digitised maps / launchlet, customize the web with JavaScript and CSS / HTML Recipes by Stephanie Eckles / a11y tools by Ian Lloyd / Ready-made CSS counter styles for various cultures around the world, by the W3C / Web Accessible Code Libraries and Design Patterns, a great roundup

Reading / Writing / Publishing. The Memex Method by Cory Doctorow / Write good examples by starting with real code says Julia Evans / Hello, EPUB!, a summary of the format by Titus Wormer

Creative Coding. Libraries by Lingdong Huang: skeleton-tracing, a new algorithm for retrieving topological skeleton as a set of polylines from binary images; squiggy, a vector brushstroke library / Drum Synthesis in JavaScript by Nick Thompson / Subscapes, a series by Matt DesLauriers Part 1: Preamble, Part 2: Traits, Part 3: Code

Static sitegen / CMS. Andy Bell's Learn Eleventy from Scratch (now on a dedicated website) / How to create drafts in Eleventy by Giustino Borzacchiello / Static site generators / A framework for building Open Graph images using Puppeteer by Jason Etcovich / Astro stuff: A Look at Building with Astro by Chris Coyier, Build wicked fast sites with Astro by Cassidy Williams / Configuring Theme Design with theme.json, a neat addition to WordPress 5.8