Currently there's no keyboard focus that can be placed on the two "buttons", no roles on them, and no live regions to let screen readers know what changes are going on in real-time.
Adding a button element, rather than the a would give screen readers a more accurate role. But, just adding an href will ensure that a link role will be given to a screen reader as well as providing keyboard focus on the items. aria-pressed would be helpful also to convey the state (pressed or not) to screen reader users.
Also, the color contrast on some items is fairly low (the grey on white).
Currently there's no keyboard focus that can be placed on the two "buttons", no roles on them, and no live regions to let screen readers know what changes are going on in real-time.
Adding a
button
element, rather than thea
would give screen readers a more accurate role. But, just adding anhref
will ensure that a link role will be given to a screen reader as well as providing keyboard focus on the items.aria-pressed
would be helpful also to convey the state (pressed or not) to screen reader users.Also, the color contrast on some items is fairly low (the grey on white).