TL;DR: Probably don’t use disclosure widgets in fieldsets. If you do it anyway, don’t put the trigger in the <legend>. Context With <details> / <summary>, recent support for the popover attribute, and the never-ending belief that a “clean” page means hiding content, there is a resurgence in stuffing useful content…
There are plenty of plug-ins, libraries, and tutorials that will add an “estimated reading time” visual cue to your site. There are also browser extensions for users. Most use JavaScript and CSS to calculate based on word count and viewport position. All require more work on the part of the…
I spoke at the 2024 Web Accessibility in Mind Conference (in partnership with PopeTech). As soon as the video is available I will embed it. This post is a stub to hold the links during my talk and will be updated sometime within a few days after my talk with…
This post is part of RSS Club, rewarding those who still use RSS to read and/or share content. These posts are embargoed from my regular post feed and the socials for an arbitrary period of time. You can see all the RSS-only posts at AdrianRoselli.com/category/RSS. Tell your friends (to get…
I had some issues using the Disability:IN 2024 Conference Agenda so I made a bookmarklet: 🔗 Fix Disability:IN Agenda You may have seen this originally posted as a CodePen, but I opted to move it here since I can embed videos showing a before-and-after experience. Fixes Removes empty trigger link…
TL;DR: You probably don’t need to name that landmark. The Ngong Ping Village tourist trap on Hong Kong’s Lantau Island. All the pricey tourist spots have visible named landmarks on the map, but the ones people generally care about (bathrooms, food, that lovely tea house) are not. The accompanying tactile…
TL;DR: Keep your image alternative text brief, devoid of special characters, empty of URLs, and ideally in one language. Here We Go Sometimes you can have too much alternative text, particularly for an <img>. I don’t mean there is a limit to what is allowed, I mean there is a…
It’s none. Clarification Let me clarify: don’t set a base font size. body { /* font-size: yeah, no */ } Got a linter or code checker or boss-man hassling you that you need to set something? Ok, use something like this: html { font-size: 100%; } Because This approach has…
Yes, that is the bear from Jakob’s clearly spurious alternative text example and yes, that is The Fonz after jumping the shark. If you have been following the saga of Jakob Nielsen, there a few quotes I could use here: Battle not with monsters, lest ye become a monster (Nietzsche).…
Controls that can operate other controls in bulk are not new. One common example is a single checkbox that allows you to check or uncheck a group of checkboxes. Another example is a single button that lets you expand or collapse a set of disclosure widgets. When the user operates…
A rambling collection of thoughts from reading through the WebAIM Screen Reader User Survey #10 Results. Most of this was in a Masto thread, but I opted to post it here so I can laugh at myself later. Disability This opening nugget is important for understanding some of my commentary:…
Just another usability and accessibility pro telling authors not to do the thing they continue to do. It’s Ok to Disable Buttons There are plenty of cases where you want to disable a button until a user takes a conscious action to enable it, such as when launching nuclear missiles.…