Defensive CSS — A new site full of handy, practical CSS and design tips (covering things like media queries, selectors, fallbacks, etc) to help in building future-proof user interfaces. There’s also an introductory blog post outlining “why it’s important to design and write CSS defensively”.

Ahmad Shadeed

W3C to Become a Public-Interest Non-Profit Organization — The World Wide Web Consortium, founded by Tim Berners-Lee himself, has been the main standards organization for the Web since 1994, and is set to become a US non-profit in 2023.

Coralie Mercier (W3C)

Test Your Web App for Accessibility — Free axe DevTools Chrome browser extension for dev teams. Start testing in just minutes and join 200,000+ active weekly users in squashing accessibility bugs. Build a more accessible and inclusive web app today with axe DevTools.

Deque sponsor

Mobile-First CSS: Is It Time for a Rethink? — Is so called "mobile-first" CSS always the best option in 2022? Patrick explores the pros and cons of the classic methodology, as well as when other solutions might work better.

Patrick Clancey

Getting the Right Space Around Headings in Web Typography — A typographic dive into the spacing around headings, font sizes, etc. Some nice before and after sliders here to visualize the differences, plus a 17 minute video review of a real-world site.

Oliver Schöndorfer

Style Queries Explained — 'Style queries' join 'container queries' in the new contain-level-3 spec. They let you query the style of any parent element within a page and apply styles to its children based on the styles of its parent. Here’s an explainer.

Una Kravets

The Future of Frontend Build Tools — The nature of frontend build tools like WebPack, Snowpack or Vite is shifting. They are moving towards being built in lower level languages like Rust to improve the speed and performance while also adding “unbundled development” using ES modules to improve the local development experience.

Alexander Joseph

GV (Google Ventures) Invests $35M into Notification Infrastructure API — Scalable and reliable no-code UI has parity with a robust API that lets you deliver to your users their preferred experience.

Courier.com sponsor

Voice Control Usability Considerations For Partially Visually Hidden Link Names — Partially visually hidden link names may be good for people who use screen readers, but they can be problematic for those who rely on voice control software.

Eric Bailey

A Modern React, MDX + MJML HTML Email Workflow — We know better than most that creating HTML layouts that work in email clients is hard work, but this is a neat exploration of a modern approach leveraging React, Mailjet’s MJML framework, and MDX - a way to work with Markdown in JSX.

Josh W Comeau

Faster Page Loads Using 'Server Think-Time' with Early Hints — Here's how your server can send hints across to the browser (Chrome 103) about critical sub-resources.

Kenji Baheux (Chrome Developers)

'My Dumbest CSS Mistakes' — When writing code, we all make mistakes. The author shares some of the most common CSS ones they find themselves correcting.

Geoff Graham

Build Internal Tools in Minutes with Retool, Where Visual Programming Meets the Power of Real Code

Retool sponsor

A CLS Punishment for Progressive Enhancement? — Andy stumbled across an issue with Lighthouse in which a bad performance score was returned for a progressive enhanced burger menu pattern. It didn’t take long for folks to offer some suggestions/solutions.

Andy Bell

Bunny Fonts: A Privacy-Friendly Google Fonts Alternative — These are open-source fonts designed to be a drop-in replacement for Google Fonts, they use the same API format and help projects stay fully GDPR-compliant.

BunnyWay

UI Buttons: 100 Modern CSS Buttons in Every Style You Can Imagine — Definitely some unique button styles here, all of which you can try live here.

UI Haven

Blob Animation: Generate An SVG-Based Smooth Blob Animation — Includes lots of options to customize the ‘blob’ including animation speed and ability to add a background image to the shape, after which you can download as SVG or copy the inline code.

Aldison Lluka

LetsMarkdown: An Open Source Collaborative Markdown Editor — Features a VS Code-like live collaborative markdown editor with preview, minimap, dark mode, and no login required.

Wensen Wu