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…
TL;DR: Be careful when using the word grid on its own. Be certain you have chosen the term that accurately describes the pattern you want. If this post looks familiar to you, that is because it is essentially a redress of my 2023 post Be Careful Using ‘Menu’. It is…
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: Avoid setting heading levels greater than six (6). This applies whether using aria-level or the proposed headingstart HTML attribute. Use HTML <h#> elements whenever possible. ARIA The aria-level attribute, when applied to headings (or nodes with the heading role) lets authors set an integer value for a heading level.…
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…
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…
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…
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…
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 fields that produce error messages on…
Using ARIA instead of HTML is generally fine for content, layout, structure, and other static bits of a page. A <div role=”heading” aria-level=”1″> is the same as <h1> as far users and accessibility APIs are concerned. It is unlikely a user will ever notice the difference unless you use both…
There is a non-zero chance that WCAG Success Criterion 4.1.1 Parsing will go away in WCAG 2.2. This isn’t a problem for users, regardless of the problems it may pose for the WCAG process, ACT rules, automated testing tools, or ossified testing processes. The joke here is using an antique…
TL;DR: Support for aria-readonly is nearly non-existent for the roles I tested. Should you need it, you cannot rely on it. You will be better off revising the pattern where you think you need it. For some background, the aria-readonly property: Indicates that the element is not editable, but is…