Tag

#accessibility

Tagged “accessibility

16 articles
Accessibility & semantics

The custom checkbox stays hand-rolled until `::checkmark` actually ships

Andy Bell's new Piccalilli piece previews the ::checkmark pseudo-element and appearance: base, then quietly concedes no browser is working on it. Until that changes, the accessible checkbox is still a label wrapping a real input — not a div.

Sep 17, 2026 · Marcus Osei
Browser releases

Safari Technology Preview 252 adds @supports named-feature(), unprefixed user-select and two accessible-name fixes

WebKit's 11 September preview adds a named-feature() function to @supports, exposes CSSConditionRule.supports and CSSMediaRule.matches on the CSSOM, ships the unprefixed user-select property, allows percentage values in text-decoration-inset, and cleans up two accessible-name bugs around display: contents and list markers.

Sep 12, 2026 · Yuki Tanaka
Accessibility & semantics

The `headers` attribute has quietly stopped earning its place

Adrian Roselli retested the HTML `headers` attribute against the current crop of screen readers and browsers, and the answer is short: plain, honest table structure carries the meaning by itself, and the attribute is largely useless.

Sep 10, 2026 · Marcus Osei
Web platform

A theme toggle should not overwrite the user's OS choice

Bramus Van Damme argues the third button, System, belongs in a dark-mode toggle. His case is that a two-state control silently maps one of its values back to the OS schedule and overwrites the user's explicit pick.

Aug 18, 2026 · Marcus Osei
Accessibility & semantics

Whether a dialog closes on outside click is a task question, not a style question

Adrian Roselli sorts modal close behaviour into three buckets — action required, no action required, and weird patterns — and argues you should pick a light-dismiss policy based on what the user came to do, not on how the dialog looks.

Aug 13, 2026 · Marcus Osei
Accessibility & semantics

The 'blocked aria-hidden' warning is telling you the truth

A new CSS-Tricks piece by Durgesh Rajubhai Pawar argues the browser is right to complain when you hide a focused region — and every popular workaround for the warning just moves the bug somewhere quieter. The fix is a reordering, not a new attribute.

Aug 12, 2026 · Marcus Osei
Browser releases

Safari Technology Preview 248 gives progress() a no-clamp option and forwards missing components across analogous color spaces

WebKit's Safari Technology Preview 248 lands two CSS additions worth reading — a no-clamp option on the CSS progress() function and forwarding of missing color components when interpolating between analogous color spaces — plus a pair of accessibility repairs and a small stack of quieter CSS fixes.

Jul 23, 2026 · Iris Calderón
Accessibility & semantics

aria-expanded has four honest jobs left. The rest belong to the platform.

Steve Frenzel's Piccalilli piece walks every widget that used to demand aria-expanded and shows how many are now better served by <details>, <dialog>, or the popover API. Keep the attribute for menus, navigation, tree views and combo boxes, and drop it everywhere else.

Jul 16, 2026 · Marcus Osei
Accessibility & semantics

A primary-nav flyout built on `popover`, not `aria-expanded`

Adrian Roselli has rebuilt his 2019 disclosure-widget primary nav on the native HTML `popover` attribute. The rebuild is a clean map of what the platform now carries for you, and where you still need ARIA.

Jul 9, 2026 · Marcus Osei
Accessibility & semantics

Chrome 150 hands composite-widget arrow keys to the browser

Chrome 150 ships the `focusgroup` HTML attribute, a way to get roving arrow-key focus inside composite widgets like listbox, tablist and toolbar without a line of JavaScript. Adrian Roselli has published script-free demos, and the spec story is still an Open-UI explainer.

Jul 6, 2026 · Marcus Osei
Browser releases

Safari Technology Preview 247 lands calc-mix() and clears a scatter of small fixes

WebKit's July 1 preview build adds CSS calc-mix() under its New Features list, plus HTML spec-alignment repairs for align="center" and rel=preload as="json", two VoiceOver-facing accessibility fixes, and a MathML change for underover layout.

Jul 2, 2026 · Yuki Tanaka
Accessibility & semantics

Your `<nav>` label already says 'navigation'

Writing 'Primary navigation' on a `<nav>` makes a screen reader announce the word twice. The fix is to trust the landmark and let the label do its actual job.

Jun 26, 2026 · Marcus Osei
Web platform

Your site does not need to function the same on every platform

Bramus argues authors have swapped one cross-browser obsession for a new one — that sites must behave identically across mouse, touch, keyboard and Vision Pro. The piece reframes input-specific affordances as progressive enhancement on the input axis.

Jun 25, 2026 · Dex Halloran
Accessibility & semantics

`headingoffset` is not the outline algorithm coming back

Firefox has shipped `headingoffset` behind a flag. It quietly fixes a real pain point for reusable components, but it is not, and cannot be, the long-abandoned Document Outline Algorithm in disguise.

Jun 22, 2026 · Marcus Osei
Accessibility & semantics

ariaNotify() is developer catnip. Treat it like alert().

The new WAI-ARIA 1.3 ariaNotify() method makes screen-reader announcements trivial to fire from JavaScript — which is exactly the problem. The case CSS-Tricks lays out is straightforward: reach for it only where a live region genuinely cannot do the job.

Jun 21, 2026 · Dex Halloran
Accessibility & semantics

Customizable `<select>` is still a `<select>`: keep the text

WebKit's golden rule for the new customizable `<select>` is the rule we should have been following all along: every option needs real text, even when icons or swatches do the visual work.

Jun 20, 2026 · Marcus Osei