Skip to content.
Adrian Roselli
Series A Blockchain Overlay BYOB

All Posts Tagged:

Irrational Headings

For years developers have been confused about, fought over, ignored advice on, and generally mis-treated headings. It has bordered on irrational. But let’s look at some actual irrational headings. <hφ> <hφ> corresponds to a heading at roughly level 1.618033988749…. This represents the Golden Ratio and is handy for identifying a…


Tags: html

Brief Note on Dismissing Selects and Listboxen

Native controls can be different from their roled-up ARIA equivalents in a variety of ways. For example, an expanded native HTML <select> on mobile behaves differently when the dismiss gesture is used than when the same gesture is used with an expanded ARIA listbox. Using Android with TalkBack, a down-then-left…


Tags: ARIA, html, mobile, touch, usability, UX

What Does X% of Issues Mean?

I ran a highly scientific and well-scoped Twitter poll (yes, sarcasm) to ask a question that has been in the back of my head for some time: When you see a claim that an automated accessibility testing tool finds X% of issues, what do you believe the word ‘issues’ means…


Tags: accessibility, rant, standards

It’s Mid-2022 and Browsers (Mostly Safari) Still Break Accessibility via Display Properties

It was late 2020 when I last tested how browsers use CSS display properties to break the semantics of elements. I had been waiting for Safari to fix how it handles display: contents for four years now, and was excited when the announcement came in June. Then I started testing…


Tags: accessibility, browser, Chrome, css, Firefox, html, Safari, tables

Use Legend and Fieldset

It’s 2022 and people are still afraid to use <fieldset> and <legend>. I understand the layout challenges can be frustrating, but swapping to an ARIA group role will result in a more inaccessible experience. A Solution Try this: <fieldset> <legend>Choose</legend> <div aria-hidden=”true”>Choose</div> […] </fieldset> legend:not(:focus):not(:active) { position: absolute; overflow: hidden;…


Tags: accessibility, ARIA, html, standards