WebAIM - Web Accessibility In Mind

E-mail List Archives

Amazon Re: Accessible 5-star rating widget

for

From: Randi
Date: Apr 7, 2010 10:12AM

That's really strange. I use the main site. I think the "accessible"
site is an insult and told them so, because it's actually the mobile
site, and leaves things out, unless they've worked on it since I last
checked. On the main site, I was able to select stars no problem. They
were all with radio buttons. This was an item I purchased, so I wonder
if that makes a difference. Hmmm.

~Randi and Guide Dog Jayden

http://raynaadi.blogspot.com/

On Apr 7, 2010, at 8:00 AM, Terrill Thompson wrote:

> Thanks for the tip Randi. However, I'm not finding an accessible
> star-rating on Amazon.com. I wonder if they're pushing a Randi-only
> version to you since you contacted them! Browsing the Amazon site, I
> see that when they're reporting the average rating for products
> that's accessible. It's just an image with alt="2.8 out of 5 stars"
> or whatever the actual rating is. Interestingly, this is only
> accessible on the main site. On the screen reader -friendly site (http://amazon.com/access
> ) these same images have no alt! On the "accessible" site I couldn't
> find any way to rate products.
>
> On the main site, most items have a 5-star rating widget under the
> level 2 heading "Rate This Item to Improve Your Recommendations". I
> checked several products in several categories, and from my
> experience they're all the same: The rating widget is just a set of
> six <span> elements.
>
> The first of these includes the text "I own it" and looks like a
> checkbox, but that's an illusion created with a background image. If
> I click on it the background image is swapped for a checked
> checkbox. (I guess this is where aria-role="checkbox" and associated
> ARIA markup would be useful (or they could just use an HTML
> checkbox), but in this case they've done neither so screen readers
> offer no clue that this is a checkbox.
>
> The remaining span elements are the stars. They all have
> tabindex="0" so they're keyboard accessible. But again the stars are
> just an illusion created with background images. There is no
> information offered to screen readers as to what these elements are.
>
> Still looking for an accessible example...
>
> Terrill
>
>
> -----Original Message-----
> From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED>
> ] On Behalf Of Randi
> Sent: Tuesday, April 06, 2010 8:08 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] Accessible 5-star rating widget
>
> I just had an issue with Amazon and their stars thing. It used to work
> and then it didn't. I contacted them and their accessibility team
> fixed it. It's now just radio buttons, so I don't know if that's a
> widget, but it works, if you want to see what they use. It's the one
> for rating items.
>
>
> *Randi and Guide Dog Jayden
>
> Doggy Diaries and other ramblings at:
> http://raynaadi.blogspot.com/
>
> On Apr 6, 2010, at 7:44 AM, Terrill Thompson wrote:
>
>> Does anyone have a recommendation for a 5-star rating widget that's
>> accessible by keyboard, accessible to screen reader users, and
>> accessible to people with color blindness? I prefer jQuery but I'm
>> not attached to it.
>>
>> Thanks!
>>
>> Terrill Thompson
>> Technology Accessibility Specialist
>> DO-IT, Accessible Technology
>> UW Technology Services
>> University of Washington
>> <EMAIL REMOVED>
>>
>>
>>
>>