Accessibility
5 reasons why WCAG AA compliance does not mean your website is accessible
There's a common misconception, that if you meet the Web Content Accessibility Guidelines (WCAG) 2.2, to level AA, then your website is accessible.
Accessibility Isn't Optional: The Basics That Actually Matter
A practical guide to web accessibility that focuses on the fundamentals that actually help users, without overwhelming you with perfection.
From Reactive to Proactive: Building a Sustainable Accessibility Program - Equal Entry
This article is based on Lina Trifon‘s talk at A11yNYC on how to build a sustainable accessibility program using dual-track strategies and the W3C maturity model.
How to Avoid Boiling the Accessibility Ocean
Accessibility programs become manageable when responsibility shifts to the people who create the work in the first place. The accessibility team guides. Outside of audits, guidance, governance, and training, the action falls to others outside of the accessibility team. That creates a path where accessibility stops feeling unattainable and becomes continuous forward progress.
Responsibility belongs where decisions happen.
CSS
The Google Antigravity website, rebuilt with Modern CSS
As an experiment to see if Modern CSS is up to the task, I recreated the Google Antigravity website with Modern CSS.
"Hard CSS gradients" can be shortened to not include redundant values
The CSS images specification includes fixup rules which can be helpful to remove redundant values from CSS gradient definitions.
Mastering margin collapsing
The top and bottom margins of blocks are sometimes combined (collapsed) into a single margin whose size is the largest of the individual margins (or just one of them, if they are equal), a behavior known as margin collapsing. Note that the margins of floating and absolutely positioned elements never collapse.
Margin collapsing occurs in three basic cases.
Connecting Circles With Anchor Positioning
Let's suppose you have two circles randomly placed on the page, and you want to create a connection between them. Sounds like a JavaScript job, but CSS can also do it.
A good overview of what can be possible using modern features such as Anchor Positioning, attr(), container queries, shape(), trigonometric functions, and more.
Different Page Transitions For Different Circumstances
I feel like common usage for multi-page view transitions is to set up a general system for them that applies generally to all pages and elements, then let it ride.
But I just recently saw the DOM events in JavaScript and how they can be used to set a “type”. You can do anything you might want in there, but an especially interesting thing to me is that you can set the view transition type, and do so conditionally.
Interactive Fluid Typography
How to build responsive typography with fluid units and typed arithmetic in CSS.
HTML
Discover Dialog
The dialog element has been available across browsers since March 2022, and allows you to pop a little overlay on your page - a common variant is known as a modal - and it has a whole bunch of abilities built in, with further useful facets still being added.
The <time> element should actually do something
<time> is a neat idea in theory, but in practice it feels like an unfulfilled promise of semantic HTML.
JavaScript
Angular Tips
Angular Tips is a documentation intended to guide developers in building complex industry web applications, with a large scope and codebase, designed to last over time and be developed and maintained by many people.
It might not be suitable for simple web apps which can be simplified thanks to their smaller scope.
At the time of this writing, the documentation assumes that you are using the latest minor version of Angular v21.
picknplace.js, an alternative to drag and drop
A proof of concept of a viable drag and drop alternative.
UX might feel a little weird at first on desktop with scrolling to position the "pick", but it's an interesting POC. I didn't try the mobile UX.
Building a Reusable Form Component Library with TanStack Form
For years, react-hook-form was my go-to for form state management. It worked well enough, but I'd regularly hit friction points -- unexpected re-renders, confusing ref forwarding, and type gymnastics that left me wanting something better. When TanStack Form came along, offering fine-grained control over form state, validation, and submission, I decided to give it a shot.
I set out to build a form system that would integrate with our existing form component and validation libraries, while offering type safety, handling repetitive boilerplate, and staying flexible enough for complex cases. Here's where I landed.
tinypdf - Minimal PDF creation library. <400 LOC, zero dependencies, makes real PDFs
~70x smaller. We removed TTF fonts, PNG/SVG, HTML-to-PDF, forms, encryption, and compression. What's left is the 95% use case: put text and images on a page.
Not included: Custom fonts, PNG/GIF/SVG, vector graphics, forms, encryption, compression, HTML-to-PDF. Need those? Use jsPDF or pdf-lib.
Web Bluetooth API Usage – A Practical Guide
The Web Bluetooth API allows websites to directly communicate with nearby Bluetooth Low Energy (BLE) devices. This means a web application can connect to hardware devices like fitness trackers, IoT sensors, smart lights, and custom electronics — without installing native apps.
In this article, I’ll explain what the Web Bluetooth API is, how it works, and how to use it practically, with real examples and important limitations you should know before using it in production.
Healing-Frequencies
Simple web page to play the frequencies of various sets of healing tuning forks: Solfeggio, Organs, Mineral nutrients, Ohm, Chakras, Cosmic Octave, Otto, Nikola Tesla 3-6-9, DNA nucleotides, Angels... or custom.
The web pages in this project are just plain HTML, CSS, and Javascript to call the Web Audio API (without external dependencies).
Workbox: JavaScript libraries for Progressive Web Apps
Workbox is a powerful library originally developed by members of Chrome's developer relations team to facilitate the creation of Progressive Web Apps and to improve the offline experience of web applications. It offers a suite of tools and strategies for efficiently caching and serving web assets, managing service workers, and handling offline scenarios. Workbox simplifies the implementation of common caching patterns and provides developers with a comprehensive toolkit to build robust, resilient web applications.
Miscellaneous
WebUtils - Free Privacy-Focused Online Tools
Free online tools for developers. Compare text, compress images, and more — all in your browser, no uploads required.