Make the default position of accordion chevrons on the left side of the title #11087
mbgower
started this conversation in
Accessibility
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
We have data from low vision user studies showing reduced usability due to the distance between the chevron indicator and the label. By their nature, right-side chevrons will normally have a greater distance; on implementations across many columns, the space can be significant.
In our user testing, several sighted users missed the accordion indicator, and did not understand headings were actionable until exploration with a mouse. When a user uses any form of magnification, the result is that the cue for an accordion may be missed since the chevron is not even displaying within the viewport. The lack of any other contrasting visual cue for an accordion increases lack of recognition of the component.
For accessibility, we recommend aligning the chevron on the left. Designers viewing this guidance have asked why the default is on the right if this is our recommendation.
At the least, I recommend you better document the accessibility case for left-aligned in Usage, and the scenarios under which right-aligned chevrons are preferred and why.
Some other points about this:
Beta Was this translation helpful? Give feedback.
All reactions