Level-Setting Heading Levels

TL;DR: Avoid setting heading levels greater than six (6). This applies whether using aria-level or the proposed headingstart HTML attribute. Use HTML elements whenever possible. ARIA The aria-level attribute, when applied to headings (or nodes with the heading role) lets authors … | Continue reading


@adrianroselli.com | 10 days ago

A Brief Note on Highlighted Text

TL;DR: If you plan to style text highlighted by the browser, you must give it sufficient contrast — 3:1 for the highlight block against its background and (probably) 4.5:1 for the text within that highlighted block against that background. CSS Context CSS provides methods to styl … | Continue reading


@adrianroselli.com | 12 days ago

What You Can Do as a Web Builder on Earth Day

One easy thing you can do for the earth is not use “AI” tools. Consider this as a programmer, web developer, web designer, copywriter, webmaster, etc. The tools include anything branded as generative AI, LLMs, computer vision tools, ChatGPT, Bard, Grok, Dall-e, Midjourney, and so … | Continue reading


@adrianroselli.com | 26 days ago

Long Alt

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 . I don’t mean there is a limit to what is allowed, I mean there is a… | Continue reading


@adrianroselli.com | 28 days ago

CSUNATC: WCAGmire

Download a 4.4MB tagged PDF of my slides or try the embedded view if your browser displays PDF inline. The text in the slides is set in Atkinson Hyperlegible. The outdoor images are generated from Midjourney. The PDF is exported from PowerPoint, after confirming reading order and … | Continue reading


@adrianroselli.com | 1 month ago

The Ultimate Ideal Bestest Base Font Size That Everyone Is Keeping a Secret, Especially Chet

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 this: body { font-size: 100%; } Because This approach has the advantage… | Continue reading


@adrianroselli.com | 2 months ago

Web Turns 35, Seems Popular

The world wide web has officially lasted 35 consecutive years, which means it’s catching up to its parent, the Internet, which itself is bearing down on 55. That’s an important distinction. The Internet is not the web; it is the foundation on which the web was born. Prior Years F … | Continue reading


@adrianroselli.com | 2 months ago

Jakob Has Jumped the Shark

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 … | Continue reading


@adrianroselli.com | 2 months ago

Check-All / Expand-All Controls

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 … | Continue reading


@adrianroselli.com | 2 months ago

Techniques to Break Words

Photo by studio tdes. Used under CC BY 2.0 Deed. Image cropped and contrast enhanced. A few days ago Benjy Stanton asked about breaking long words in tables. I offered a suggestion, which may or may not have worked. I never asked. My failure to follow up aside, it reminded… | Continue reading


@adrianroselli.com | 2 months ago

My WebAIM 10th SR User Survey Takeaways

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 commen … | Continue reading


@adrianroselli.com | 2 months ago

ARIA `note`

Trying Markdown code indicators in my post title, not because I want it to convert, but because I am curious if people will ping me to tell me it broke their RSS readers. Oh, and so it converts to code when pasted into your GitHub issues. ARIA note Role A… | Continue reading


@adrianroselli.com | 3 months ago

Don’t Disable Form Controls

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 missile … | Continue reading


@adrianroselli.com | 3 months ago

Under-supported and Underpaid

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 fri … | Continue reading


@adrianroselli.com | 4 months ago

Using abbr Element with title Attribute

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 fri … | Continue reading


@adrianroselli.com | 4 months ago

Embed Slides, YouTube Videos, and More

There are plenty of use cases for embedding third-party content on a site, as well as local content that may not be in HTML. Perhaps you gave a talk and want to share your slides. Sometimes you want to reference a video that exists only on YouTube. Maybe you have… | Continue reading


@adrianroselli.com | 4 months ago

#AudioEye Has Dropped Its Suit Against Me

AudioEye has dropped its lawsuit against me as part of a settlement agreement. The specific legal details are at the end of this post. Index for this post: Joint Statement Impact, Abridged SLAPP Everybody Lost Legal Details Wrap-up Related Joint Statement The Parties are AudioEye … | Continue reading


@adrianroselli.com | 4 months ago

2.5.8: 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 fri … | Continue reading


@adrianroselli.com | 4 months ago

AD Support in HTML Video

This post supplements Browser Video Players Review. There I wade into the de facto accessibility of the element based on the default video players provided by browsers. The results of my testing here update the tables in that post. One of the primary challenges of using the brow … | Continue reading


@adrianroselli.com | 5 months ago

Baseline Does Not Really Cover Baseline Support

Yeah, that’s not exactly a helpful title. The relatively new Web Platform Baseline offering does not track browser support for accessibility features built into the web platform. If you need to understand whether browsers support accessibility features as your own base level set … | Continue reading


@adrianroselli.com | 5 months ago

Media Queries in HTML Video

Before you get too far into this post, maybe read Browser Video Players Review. There I wade into the accessibility of the element based on the video players browsers provide. Then maybe read Scott Jehl’s How to Use Responsive HTML Video (…and Audio!). I am leaning on support in … | Continue reading


@adrianroselli.com | 5 months ago

Web Development Advent Calendars for 2023

Generated by Midjourney using the prompt “a Pagan advent calendar for Christmas, made of natural wood.” It seemed more appropriate for the season than the neon synthwave version (which I want to hire someone to make). Web developers around the world have for years given a nod to … | Continue reading


@adrianroselli.com | 5 months ago

Øredev 2023: Under-Engineered Patterns

Download a 2.6MB 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… | Continue reading


@adrianroselli.com | 6 months ago

Ø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… | Continue reading


@adrianroselli.com | 6 months ago

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

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 fri … | Continue reading


@adrianroselli.com | 6 months ago

Splitting within Selects

The native HTML 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 (nee ) hopes to cha … | Continue reading


@adrianroselli.com | 6 months ago

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 fri … | Continue reading


@adrianroselli.com | 7 months ago

Obligatory WCAG 2.2 Launch Post

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 fri … | Continue reading


@adrianroselli.com | 7 months ago

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… | Continue reading


@adrianroselli.com | 7 months ago

The Children Are Driving the Bus

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 fri … | Continue reading


@adrianroselli.com | 7 months ago

Browser Video Players Review

Browsers each provide built-in video players for the element. Nearly four years ago Scott Vinkle wrote How accessible is the HTML video player?, where he compared these to one video player product. I decided it was time to test for myself. I structured my test and reporting a bi … | Continue reading


@adrianroselli.com | 8 months ago

Where to Put Focus When Deleting a Thing

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 fri … | Continue reading


@adrianroselli.com | 8 months ago

Styling Links and Buttons

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 fri … | Continue reading


@adrianroselli.com | 9 months ago

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 … | Continue reading


@adrianroselli.com | 9 months ago

Progressively Enhanced HTML Accordion

Does what it says on the tin. Uses and 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 … | Continue reading


@adrianroselli.com | 9 months ago

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 entry. The next three are from W3C HTML’s 2019 guidance (the W3C … | Continue reading


@adrianroselli.com | 9 months ago

Under-Engineered Comboboxen?

When I wrote Under-Engineered Text Boxen in 2019 I mentioned (WHATWG, MDN) but did not dwell on it. Partly because support was poor at the time. Once Can I Use’s entry listed Firefox on Android supporting it in version 110, I got excited and started testing to write… | Continue reading


@adrianroselli.com | 10 months ago

No, ‘AI’ Will Not Fix Accessibility

In recent years, a series of new technologies have provided better experiences and outcomes for disabled users. Collectively branded “Artificial Intelligence”, the two biggest breakthroughs have been in computer vision and large language models (LLM). The former, computer vision, … | Continue reading


@adrianroselli.com | 11 months ago

Brief Note on Popovers with Dialogs

This is not a comparison between popovers and dialogs, nor is it a discussion of support. This is me trying to get ahead of a potential issue for users when developers mix and match the patterns. I will let this 32 second video explain: Sorry, your browser doesn’t support embedde … | Continue reading


@adrianroselli.com | 11 months ago

Be Careful Using ‘Menu’

TL;DR: Be careful when using the word menu. Be certain you have chosen the term that accurately describes the control you want. If this post looks familiar to you, that is because it is essentially a redress of my 2020 post Stop Using ‘Drop-down’. It is not as divergent as… | Continue reading


@adrianroselli.com | 12 months ago

#AudioEye Is Suing Me

On Wednesday March 8, 2023, a man who turned out to be a process server came to my house and delivered a stack of papers — a 30 page lawsuit from Akin Gump Strauss Hauer & Feld LLP along with Buffalo-area firm Phillips Lytle LLP, both representing AudioEye, Inc. The… | Continue reading


@adrianroselli.com | 1 year ago

Under-Engineered Patterns for #WCBUF

The slides for my talk are available as a | Continue reading


@adrianroselli.com | 1 year ago

WWW Project Turns 30

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 fri … | Continue reading


@adrianroselli.com | 1 year ago

No, APG’s Support Charts Are Not ‘Can I Use’ for ARIA

TL;DR: Despite claims, APG’s support charts are not ARIA support charts and they are not analogous to Can I Use. While brand new and likely to grow, their scope is still strictly APG patterns. Why I Say This I have opinions on the ARIA Authoring Practices Guide (APG). I am… | Continue reading


@adrianroselli.com | 1 year ago

Don’t Override Screen Reader Pronunciation

When many devs, testers, and authors first start listening to content through a screen reader, they are surprised to hear dates, pricing, names, abbreviations, acronyms, etc. announced differently than they expect. With the best of intentions (or branding panic) they may seek to … | Continue reading


@adrianroselli.com | 1 year ago

Exposing Field Errors

This post is about exposing field errors programmatically. I have already shared some opinions (such as a caution about displaying messages below fields or avoiding default browser field validation), but this post dives into using ARIA to convey them to screen reader users. With … | Continue reading


@adrianroselli.com | 1 year ago

CSS-only Widgets Are Inaccessible

Usually. I originally titled this InacCSS-onlyible. I even made this typographically, er, distinct image. Then I realized it was silly and will instead use the neologism in a talk so I can hear the groans IRL. Interactive widgets powered with only CSS are relatively common as peo … | Continue reading


@adrianroselli.com | 1 year ago

#AudioEye Will Get You Sued

This post was written in early 2022 and sat in a corner of my site, hidden from the world, after AudioEye sent me a legal threat over a handful of tweets in April 2022. I opted not to poke this well-funded bully as a self-employed consultant. As such, the videos… | Continue reading


@adrianroselli.com | 1 year ago