Skip to content.
Adrian Roselli
Decentralized Modeling Overlay sFTP

All Posts Tagged: Web

A11y Camp: Keynote Slides

Download a 3.6MB 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 PDF is exported from PowerPoint, after confirming reading order and alternative text. The PDF itself has had no editing. Not…

Posted:

Tags: accessibility, slides

Brief Note on Disclosures in Fieldsets

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…

Posted:

Tags: html, standards, usability, UX

Under-Engineered Estimated Reading Time Feature

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…

Posted:

Tags: accessibility, browser, css, design, pattern, usability, UX

Semi-Annual Reminder to Learn and Hire for Web Standards

Alex Russell wrote a four-part series a couple weeks ago arguing that modern JavaScript-first framework-focused front-end development is costing the industry and users. Part of his conclusion for organizations: Never, ever hire for JavaScript framework skills. Instead, interview and hire only for fundamentals like web standards, accessibility, modern CSS, semantic…

Posted:

Tags: ARIA, html, rant, standards, W3C, whatwg

Mountain Chicken!

I am mis-using closed captions for a gag. The following video has an audio track and four sets of captions (for now?). Each set of captions is in English. Only one set of captions represents the spoken dialog, the other two represent dialog not in the video. The tracks are…

Posted:

Tags: ARIA, html, rant

Talkin’ Tables — WebAIM Conference 2024

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…

Posted:

Tags: accessibility, html, slides, tables, usability, UX

Before Filing that Keyboard Bug…

Are you using a Mac or another Apple iDevice and think you found a keyboard bug? Try: Enable Full Keyboard Access (FKA) on macOS from Apple Support. Enable Tab support in desktop Safari from Apple Support. Enable FKA on iOS from Apple Support. Enable FKA on iPadOS from Apple Support.…

Posted:

Tags: accessibility, Apple, Safari

Things to Do Before Asking “Is This Accessible?”

It is not uncommon for someone to message, call, email, or carrier pigeon me to ask if something is accessible. They almost invariably want a “yes” or “no.” However, I need to understand what the heck they mean and what the other-heck prompted them to ask. Yes, I would be…

Posted:

Tags: accessibility, rant

AT Is More Than Screen Readers

A screen reader is a single element of the overall set of assistive technologies. In practice, however, each is often used as a metonym for the other. Well, hello there. It’s nice to see you. If you’re here because I sent you the link, it’s nothing personal. You’re a lovely…

Posted:

Tags: accessibility, lingo

Don’t Use Web•dev for Accessibility Info

Web.dev is a site from Google Chrome developer relations that provides content both to evangelize Chrome and to more broadly support the web platform. Rachel Andrew’s monthly “new to the platform” posts are effectively required reading to try to stay abreast of the browser support landscape. However, the accessibility content…

Posted:

Tags: accessibility, Google

Feedback on a Pagination Pattern

Remy Sharp asked on the Mastodon about pagination as he found it in the W3C Design System: <nav aria-label=”pagination” class=”l-cluster pagination”> <ul class=”pagination__list”> <li><a href=”path/to/page”>Previous <span class=”visuallyhidden”>page</span></a></li> <li><a class=”pagination__list__first” href=”path/to/page”><span class=”visuallyhidden”>page</span> 1<span class=”visuallyhidden”> (first page)</span></a></li> <li><a class=”ellipsis”>…</a></li> <li><a href=”path/to/page”><span class=”visuallyhidden”>page</span> 6</a></li> <li><a href=”path/to/page”><span class=”visuallyhidden”>page</span> 7</a></li> <li><a href=”#” aria-label=”page 8″ aria-current=”page”>8</a></li>…

Posted:

Tags: accessibility, ARIA, html, pattern, standards, usability, UX

Be Careful Using ‘Grid’

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…

Posted:

Tags: ARIA, css, html, lingo, pattern, standards