Aria-pressed vs role="switch"

I have been reading about these a lot and I can determine the difference between these two. mdn says aria-pressed is supposed to be used for toggle "x" context, while switch is for specifically on and off semantic but these feel the same to me.
<button aria-pressed='true'>pause</button>

Vs

<button aria-checked='true' role='switch'>pause</button>
<button aria-pressed='true'>pause</button>

Vs

<button aria-checked='true' role='switch'>pause</button>
I'm not sure what the difference is here. I know aria pressed allows an intermediate state but if we only need on/off toggle do these both do the same thing?
7 Replies
Ganesh
GaneshOP3mo ago
Another question is that for aria pressed. You are not supposed to change the content of button.
<button aria-pressed='false'>pause</button>
//button is pressed
<button aria-pressed='true'>play</button>
//above is not allowed
<button aria-pressed='false'>pause</button>
//button is pressed
<button aria-pressed='true'>play</button>
//above is not allowed
how can you do the pause and play transition for sighted users then (This is assuming I can't use the psuedo elements)? same with the role switch
Mia
Mia3mo ago
can you hack this together with a checkbox?
Ganesh
GaneshOP3mo ago
hack what together? I think role=switch can be used on checkbox without manually assigning aria-checked but mdn tells you to use button with a label
Ganesh
GaneshOP3mo ago
here's something i did in two minutes. nvda is telling me "Dark theme switch on/off" for checkbox with role switch, while aria pressed is saying "dark theme toggle button pressed/ not pressed". These two descriptions seem the same to me
Kevin Powell
Kevin Powell3mo ago
They're definitely very similar. For a checkbox, the on/off makes more sense to me... like "dark theme on" or "dark theme off". "dark theme pressed" is kind of strange. Say you have a play button... that makes more sense to have a pressed/no pressed... bacause "play button on" or "play button off" doesn't really make sense, while "play button pressed" and "play button not pressed" does. It's definitely a fine line semantically speaking, though.
Ganesh
GaneshOP3mo ago
Yeah that's what I thought. So it's probably better to use whichever sounds better in the context then. Thanks Kevin.

Did you find this page helpful?