Skip to content.
Adrian Roselli
AI-Powered Monetization Framework CRT

All Posts Tagged: browser

24×24 Pixel Cursor Bookmarklet

The proposed WCAG version 2.2 has gone through a bunch of revisions since I covered the first draft in 2020. One new success criterion that persisted is 2.5.8 Target Size (Minimum) at Level AA (its name changed from “Pointer Target Spacing”). For background, WCAG 2.1 introduced 2.5.5 Target Size, mandating…

Posted:

Tags: accessibility, browser, standards, WCAG

A “Best viewed with…” Gag

I made some pointless things again. The First One See the Pen Best viewed in… by Adrian Roselli (@aardrian) on CodePen. A spinning box for each word is not exactly a compelling interface element, I admit, but I based it off this old tweet that was sitting around in a…

Posted:

Tags: browser, css, html

Brief Note on Buttons, Enter, and Space

Keyboard interaction note for just one control from the entire panoply of HTML controls: A native <button> fires on key down when that key is Enter. If you hold down the Enter key, it continues to fire for as long you hold Enter (or something crashes). A native <button> fires…

Posted:

Tags: browser, html, pattern, UX

Accessible Description Exposure

If you have little experience with ARIA, screen readers, or testing in general, understanding accessible descriptions can be trickier than understanding accessible names (already confusing for many). I have written explanations so many times for clients and in fora that I opted to put this together so I maybe never…

Posted:

Tags: accessibility, ARIA, browser, standards

Column Headers and Browser Support

Data tables need column headers. Monolitten, a granite column of humans (each with a head) at Vigelandsanlegget, a sculpture park in Frognerparken in Oslo, Norway. What they probably do not need is a new set of column headers every few rows, particularly not when they change the meaning of the…

Posted:

Tags: accessibility, browser, html, tables

Reference: SRs and Extended Characters

This post serves no purpose other than to demonstrate the fidelity of screen readers when announcing non-emoji Unicode characters when using default settings. There is no judgment on which is correct. This is simply for reference. I grabbed the following tweet and recorded it across common screen readers (WordPress ate…

Posted:

Tags: accessibility, browser, Chrome, Edge, Firefox, Safari

Blaming Screen Readers 🚩×5

The title of this post is pretty specific. It relates to the meme on Twitter where users identify a trait or preference that they see as problematic, and identify it as a red flag. The emoji represents the red flag. For example: A stylized red flag Blaming Screen Readers 🚩🚩🚩🚩🚩…

Posted:

Tags: accessibility, browser, rant, usability, UX

XPath for In-Browser Testing

Both Chrome and Firefox support XPath searches when in the DOM view of their dev tools. Because the browser cleans whatever HTML it encounters (closing tags, correcting nesting), XPath can operate on the code as XML. Simple checks like finding a unique ID value can result in multiple hits in…

Posted:

Tags: browser, Chrome, Firefox, html

WHCM and System Colors

Outline: Feature Queries Proprietary, or Internet Explorer Only Standards Track, or Edge Only Frankenquery’s Monster System Colors CSS2 System Color Keywords WHCM Proprietary Feature Query Color Mappings CSS4 System Color Keywords Browser Support Internet Explorer Legacy Edge (Ledgacy) Chromium Edge (Chromiedge) Firefox Chrome Examples Backgrounds Inline SVGs SVGs via <img>s…

Posted:

Tags: accessibility, browser, Chrome, css, Edge, Firefox, html, Internet Explorer, WHCM

a11yTO Conf: CSS Display Properties versus HTML Semantics

If you attended my pre-recorded remote CSUN 2020 talk, then this talk will be familiar. I updated with the latest browsers, since February was six Chrome and nine Firefox versions ago. This talk was also only fifteen minutes, so I cut the videos and some other materials. Go check the…

Posted:

Tags: accessibility, browser, css, html, slides

Alternative Text for CSS Generated Content

Relying on images that come from CSS has always been risky from an accessibility perspective. CSS background images, in particular, must either be purely decorative or be described to the user in some way. The risk is no different for images coming from CSS generated content using content: url(foo.gif) (typically…

Posted:

Tags: accessibility, browser, css, standards, usability, UX

Dialog Focus in Screen Readers

Creating an accessible dialog on the web is trickier than it should be. Lack of support for the <dialog> element, the need for fundraisers to get inert into WebKit, inconsistent support for the ARIA dialog role, and other annoyances make them problematic. Scott O’Hara has spent a few years covering…

Posted:

Tags: accessibility, browser, html, usability, UX