Skip to content
This repository was archived by the owner on Sep 22, 2025. It is now read-only.
This repository was archived by the owner on Sep 22, 2025. It is now read-only.

Named state example #21

@scottaohara

Description

@scottaohara

This example doesn't communicate the currently chosen color option. And using aria-pressed on the button here wouldn't necessarily be the right choice, as that alone would indicate that the choice can be toggled on or off. However, here the choice can only be turned on, and by doing so it turns off the previously chosen choice.

A pattern like this might be better exposed as either a series of radios, possibly a menubar > menuitemradio, or continue to use buttons but ensure that it's clear that a second activation won't undo the toggle. aria-current=true might be a better choice for this as it represents the current choice without suggesting that the button should behave as a toggle. Otherwise, people have also used aria-pressed but also implemented aria-disabled to indicate that the button cannot be 'unpressed'.

These sorts of subtleties don't seem like they are possible via the current draft/explainer? Maybe I'm missing something.

Metadata

Metadata

Assignees

No one assigned

    Labels

    a11yaccessibility issues

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions