Skip to content.
Adrian Roselli
Pre-trained Distrbuted Ledger Framework RTFM

All Posts Tagged: accessibility

Øredev 2023: WCAGmire

Download a 5.3MB tagged PDF of my slides or try the embedded view if your browser displays PDF inline. I was invited Malmö, Sweden to present two talks at Øredev. Well, they asked me to do one but then suggested that hey, since I’m already there and stuff, how about…

Posted:

Tags: accessibility, slides, standards, W3C, WCAG

Don’t Turn a Table into an ARIA Grid Just for a Clickable Row

Again, title says it all. However, there is an equally bad opposite approach you might be tempted to use, so let me clarify: Don’t use ARIA grid roles simply to make rows clickable in a table, and Don’t put click handlers on table rows (<tr>s) to make them clickable. Step…

Posted:

Tags: accessibility, ARIA, html, tables, usability

Splitting within Selects

The native HTML <select> is renowned for its styling limitations. Even with control over the closed state and trigger appearance, the options themselves are still defined primarily by the browser and the OS. While I think this is generally fine (preferred, even), the <selectlist> (nee <selectmenu>) hopes to change that.…

Posted:

Tags: accessibility, browser, Chrome, Firefox, html, Safari, standards, usability, whatwg

2.4.11: Adversarial Conformance

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 number of weeks. You can see all the RSS-only posts at AdrianRoselli.com/category/RSS. Tell your friends (to get…

Posted:

Tags: accessibility, rant, standards, WCAG

Obligatory WCAG 2.2 Launch Post

It seems everybody who dabbles in digital accessibility is blogging about WCAG 2.2 now that it finally went live. This is my obligatory post, but I am not promoting it because there is already so much noise and much of the content is regurgitated. If you are not aware, WCAG…

Posted:

Tags: accessibility, standards, W3C, WAI, WCAG

Paris Web 2023: WCAGmire

Download a 5.3MB tagged PDF of my slides or try the embedded view if your browser displays PDF inline. I was invited to the 2023 edition of Paris Web as one of two presenters speaking solely English. I did my best to script my talk to hopefully make it easier…

Posted:

Tags: accessibility, slides, standards, W3C, WCAG

The Children Are Driving the Bus

The Vercel CEO over on the hell-site tweets: v0.dev produces the kind of production-grade code that we'd want to ship in our own @vercel products. That was the bar we set for ourselves. At the moment it can output HTML with @tailwindcss and React w/ @shadcn UI. pic.twitter.com/hWLzpmyaG2 Guillermo Rauch…

Posted:

Tags: accessibility, JavaScript, rant, social media

Browser Video Players Review

The Test Page The Code Testing Results Keyboard Screen Readers Voice Control, Forced Colors, Speed Media Queries: 20 December 2023 Audio Description: 20 December 2023 Wrap-up Browsers each provide built-in video players for the <video> element. Nearly four years ago Scott Vinkle wrote How accessible is the HTML video player?,…

Posted:

Tags: accessibility, browser, Chrome, Firefox, html, mobile, Safari, standards, W3C, whatwg

Where to Put Focus When Deleting a Thing

TL;DR: When deleting something you should generally move focus to the prior equivalent control or its grouping container. Why This Is a Thing Plenty of user interfaces let users delete things that are on the screen. It may be an extra address, a calendar item, a message (the same as…

Posted:

Tags: accessibility, JavaScript, pattern, usability, UX

An alt Decision Tree Using Only :has()

I use the CSS :has() pseudo-class to provide an interactive alt text decision tree (from the W3C WAI Tutorial) that uses no script. It is progressively enhanced, so browsers without support for :has() still get all the content. See my post Under-Engineered Dependency Questions if you want my argument why…

Posted:

Tags: accessibility, css, html, WAI

Progressively Enhanced HTML Accordion

Does what it says on the tin. Uses <details> and <summary> with a bit of ARIA to create an accordion that works without JavaScript while working better with JavaScript. Mostly. See the Pen Progressively Enhanced HTML Accordion by Adrian Roselli (@aardrian) on CodePen. Visit the standalone version for testing or…

Posted:

Tags: accessibility, ARIA, css, html, JavaScript, pattern, print, usability, UX

Blockquotes in Screen Readers

TL;DR: This post does not assert the correct way to code blockquotes, it will only demonstrate how screen readers announce some existing patterns. Test Details The first four examples are lifted from WHATWG HTML’s <blockquote> entry. The next three are from W3C HTML’s 2019 <blockquote> guidance (the W3C HTML spec…

Posted:

Tags: accessibility, html, standards, usability, W3C, whatwg