Editor's Pick
Accessibility Report 2025 - Accessibility in HTML emails remains critically under-addressed in 2025
Across the ecosystem, accessibility failures are systemic, widespread, and largely preventable. After analyzing 443,585 emails collected over the past year, we found that 99.89% contain accessibility issues rated “Serious” or “Critical.” Only 21 emails passed all automated accessibility checks, and they came from just two brands.
This year’s report expands beyond just the code sent in HTML messages by senders. This time, we also evaluate the state of accessibility inside email clients, based on our Email Client Feature Support Rankings. Shockingly, only one email client supports all HTML and CSS accessibility features.
Accessibility
How to Convince People to Care and Invest in Accessibility
Learn how to advocate for accessibility, drive change without authority, and connect inclusive design to business impact. Practical tips, strategies, and real-world examples included.
Accessibility Is UX: Building Digital Products That Work for All
Accessibility is often seen as a developer’s job, focused on clean code and technical checklists, but there’s much more to it. True accessibility also depends on thoughtful UX design that ensures everyone can navigate and use digital products with ease. By approaching accessibility through a UX lens, we can ensure that digital experiences are not only compliant, but genuinely usable for everyone, including those who interact with the web in different ways.
The problem(s) with image accessibility
As a web developer, the <img> was probably one of the first HTML tags you learned, and sure, why not? It’s simple, straightforward, and its effects are immediate. This is probably the reason why it’s very often being misused. Consider the following code that should work, but contains flaws that harm the page’s accessibility. Can you find them all?
Accessibility Report 2025 - Accessibility in HTML emails remains critically under-addressed in 2025
Across the ecosystem, accessibility failures are systemic, widespread, and largely preventable. After analyzing 443,585 emails collected over the past year, we found that 99.89% contain accessibility issues rated “Serious” or “Critical.” Only 21 emails passed all automated accessibility checks, and they came from just two brands.
This year’s report expands beyond just the code sent in HTML messages by senders. This time, we also evaluate the state of accessibility inside email clients, based on our Email Client Feature Support Rankings. Shockingly, only one email client supports all HTML and CSS accessibility features.
CSS
A collection of common CSS mistakes, and how to fix them
Collection of common CSS mistakes, and how to fix them.
View Transitions Applied: Smoothly animating a border-radius with a View Transition, revisited
Instead of duplicating an animation on the ::view-transition-group pseudo, you can also rely on CSS transitions on the original element … if you’ve set it up correctly.
In a previous article, I shared how you can nicely animate things like a border-radius with View Transitions. To recap, View Transitions animate snapshots and because of that things like a changing border won’t nicely animate but they will fade from the old to the new snapshot.
CSS Transforms
The transform property is the foundation of most web animations. Sonner (a toast library I built) uses CSS transforms for all its animations. Libraries like Motion rely heavily on it too. It's everywhere, so it's important to understand how it works.
This article explains what the transform property is, and how it can be used to create great animations.
Arc shape with rounded edges
Previously, I used CSS mask to create an arc shape with rounded edges. Now, we can rely on the new shape() function that produces a more compact code and gives better rendering. A single-element implementation optimized with CSS variables.
:out-of-range
Sometimes when we’re asking a user to fill out a form, we only want to accept a limited range to what they can fill in. Using the min and max attributes, we can set limits on a lot of fields, from dates to numbers and more, which can prevent the form from being submitted if their input is out of the defined range.
However, nothing is more annoying than filling out a form and only finding out you did something wrong when you hit submit, and an easy way to solve that is to provide some immediate feedback to users.
We can do that with :out-of-range psuedo-class.
You can style alt text like any other text
A fun little side quest to show you how applying styles to alt text can really elevate your user interface.
Masonry, Item Flow, and… GULP?
Masonry layout is a difficult thing to do with CSS at present. Item Flow could make it easy.
Web animations today and tomorrow
Explore the latest advancements in web animation to help developers create richer, more dynamic, and performant web experiences. We'll cover new and upcoming features, including @starting-style, enhancements to View Transitions, the ability to animate the details element, and improved DevTools support.
HTML
The caption element
The <caption> element has nothing to do with closed captions. Despite the name, it isn’t a generic captioning mechanism either. The <caption> element is specifically for labelling <table>s. It should describe the purpose of the table and its data. You can achieve this with the summary attribute as well, but only non-visually. If you can imagine a kind of closed captioning technology that only works for deaf folks, then you can appreciate how bogus summary is. Use <caption> instead.
HTML5 Elements You Didn't Know You Need
In our rush to embrace sophisticated frameworks and libraries, we've overlooked some of the most elegant solutions built right into HTML5. There's something beautiful about achieving with a single tag what might otherwise take dozens of lines of JavaScript.
JavaScript
snapDOM - captures HTML elements as images with exceptional speed and accuracy
snapDOM is a fast and accurate DOM capture tool to images developed for Zumly, a WIP framework that enables zoom-based view transitions.
It converts any HTML element into a scalable SVG image, preserving styles, fonts, backgrounds, shadow DOM content, pseudo-elements, and more.
- Full DOM capture
- Embedded styles, pseudo-elements, and fonts
- Export to SVG, PNG, JPG, WebP, or canvas
- Ultra fast, no dependencies
- 100% based on standard Web APIs
Demos here.
How JavaScript’s at() method makes array indexing easier
The at() method is a relatively new addition to JavaScript (introduced in ECMAScript 2022), and it’s designed to make accessing array elements more readable — particularly from the end of an array.
It's also not just for arrays: at() also works with strings and all typed arrays.
JavaScript Algorithms (Sorted by Popularity) - a list of popular JavaScript algorithms that you'll encounter in the real world
This list showcases some of the most popular JavaScript algorithms, from simple string manipulations to classic recursive solutions and efficient searching techniques. Each snippet demonstrates a fundamental concept often encountered in coding interviews and real-world development.
Popularity is based on common interview topics, educational resources, and usage in developer communities.
The modern way to write JavaScript servers
tl;dr: The Request/Response-API is not just faster, but also makes writing tests easier.
Angular: httpResource In The Wild
How to use Angular's httpResource with real-world requirements. Sending POST requests, parsing the response, and caching.
If this is the first time hearing about httpResource, I recommend checking out the official Angular article. They will introduce you to the new API and showcase the configuration.
The goal of this post is to showcase the real-world scenario where APIs are not perfect and unexpected requirements come out of the blue.
Cold vs. Hot Observables in Angular with RxJS
The terminology of hot and cold observables isn’t very intuitive on its own. However, it’s useful to understand the underlying principles so you can leverage them while avoiding common pitfalls.
- Cold: starts anew on each
subscribe()(→ video on demand) - Hot: emits continuously and shares its stream (→ live radio)
In this article, you will learn to:
- Identify cold vs hot
- Turn a cold stream into a hot one with
share() - Use
Subject,BehaviorSubject, andReplaySubject - Avoid costly re-subscriptions
- Handle errors and stream reloads
Authenticating JavaScript WebSockets
When a WebSocket fails to connect, you receive no information about why. This makes renewable authentication an absolute nightmare, unless you do in-band authentication.
SQLite-JS - Create custom SQLite functions in JavaScript. Extend your database with scalars, aggregates, window functions, and collations directly in JavaScript
SQLite-JS is a powerful extension that brings JavaScript capabilities to SQLite. With this extension, you can create custom SQLite functions, aggregates, window functions, and collation sequences using JavaScript code, allowing for flexible and powerful data manipulation directly within your SQLite database.
Miscellaneous
The Abysmal State of Contract Software Development
The whole point of working a contract gig, instead of the traditional salaried job, was that you made a choice to trade stability for flexibility and short-term financial gain. The flexibility meant that, on paper, you could work multiple contracts, if you wanted. Unfortunately, this isn’t really true anymore, as companies hire large groups of contractors who aren’t paid benefits and can be let go with a lot less hassle, while also giving them less money than full-time employees.
Aside from the stuff I already mentioned, there’s some other key problems with staffing companies that are making it so contractors really get the short end of the stick in every way possible.
Best Practices for Creating a Modern npm Package with Security in Mind
Technology is always changing and your processes and practices need to keep up with those changes. So while npm is 15 years old (as of 2025), your practices around npm package creation should hopefully be a lot more modern. If you have a feeling they may be a little out of date, though, keep reading.
In this tutorial, we’re going to walk step by step through creating an npm package using modern best practices (as of 2025). You will first learn how to create an npm package, so you can get familiar with building and publishing a package to the npm registry. Then you’ll learn what’s involved with making a more robust and production-ready npm package by setting up a test framework, a continuous integration and deployment pipeline, security checks and automated semantic version management for release.
Not Communicating Your Impact is Killing Your Career
It may be the reason you get overlooked for the promotion or worse, be part of the next layoffs. This is what to do to avoid it.