WebAIM - Web Accessibility In Mind

E-mail List Archives

ARIA question: what's the right role(s) for Thumb Up/Thumb Down metaphor

for

From: Claudia.Case@wellsfargo.com
Date: Apr 29, 2011 10:48AM

I'm struggling with what the right semantic metaphor is for a Thumb Up/Thumb Down feature. One possibility is the toggle button metaphor, which is how YouTube has implemented it. In my mind, toggle buttons are really on-off switches and don't imply mutually exclusivity.

I'm more inclined to think of the Thumb Up/Down metaphor as a set of radio buttons since the choices are mutually exclusive. The way I was thinking of implementing this was with the WAI-ARIA radiobutton widget pattern (http://www.w3.org/WAI/PF/aria-practices/#radiobutton) and defining Thumb Up/Thumb Down as background images to replace off-screen radio button label. That would way users with normal vision would see the familiar Thumb Up/Thumb Down icons and screen reader users would hear the radio button label (e.g., Like/Dislike). To see a very similar working code example, check out Open Ajax Alliance's ARIA Radiogroup: Background Images example (http://www.oaa-accessibility.org/example/29/ ).

I'd like to hear what others have to say about the Thumb Up/Thumb Down metaphor with respect to ARIA roles.

Thanks,
c

Claudia Alden Case
Web User Experience & Accessibility Consultant | Wells Fargo Bank
email: <EMAIL REMOVED> <mailto: <EMAIL REMOVED> > | phone: (415) 371-4760 | mobile: (650) 208-0039