Reader Mode: The Button to Beat
As a young nerd, I loved to immerse myself in digital worlds, learning the ins and outs of the rules someone else had created for me (intentionally or not). But the older and crankier I get, the more I find …
The possibilities of the color-adjust property
The color-adjust property has been renamed to print-color-adjust.
The Open Web continues to show up in places we would have never originally expected to find it: our phones, televisions, watches, books, video game consoles, fast food menus, gas pumps, …
Focusing on Focus Styles
Not everyone uses a mouse to browse the internet. If you’re reading this post on a smartphone, this is obvious! What’s also worth pointing out is that there are other forms of input that people use to get things done. …
Building a Good Download… Button?
The semantics inherent in HTML elements tell us what we’re supposed to use them for. Need a heading? You’ll want a heading element. Want a paragraph? Our trusty friend <p></p> is here, loyal as ever. Want a download? Well, you’re …
ARIA is Spackle, Not Rebar
Much like their physical counterparts, the materials we use to build websites have purpose. To use them without understanding their strengths and limitations is irresponsible. Nobody wants to live in an poorly-built house. So why are poorly-built websites acceptable?
In …
Keeping track of letter-spacing, some guidelines
Considering that written words are the foundation of any interface, it makes sense to give your website’s typography first-class treatment. When setting type, the details really do matter. How big? How small? How much line height? How much letter-spacing? …
Let’s Talk About Speech CSS
Boston, like many large cities, has a subway system. Commuters on it are accustomed to hearing regular public address announcements.
Riders simply tune out some announcements, such as the pre-recorded station stop names repeated over and over. Or public service …
An Introduction to the Reduced Motion Media Query
The open web’s success is built on interoperable technologies. The ability to control animation now exists alongside important features such as zooming content, installing extensions, enabling high contrast display, loading custom stylesheets, or disabling JavaScript.
Sites all too often inundate …
Accessible SVGs in High Contrast Mode
Making your SVG accessible includes adding extra steps to your workflow, but is well-worth it. By embracing clean, semantic markup and taking advantage of some of the less well-known features of CSS, you can create easily maintainable solutions that include …