WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Star ratings


From: Mark Magennis
Date: Oct 26, 2021 3:22AM

There are two aspects to this - contrast against background and colour indicating state.

In terms of contrast against background, if the star has an outline of a different colour and either the outline/background has sufficient contrast or the star/outline has sufficient contrast then it meets the WCAG contrast requirements. In practice, a thicker outline may make it easier for some users to perceive the contrast, but that is not taken into account in the requirements.

But since the star colour is used to indicate state (checked or not checked), then a star sldo has to contrast against stars in the other state, so either the star colour should contrast or the outline should contrast (different thicknesses for example).

The understanding article for WCAG SC 1.4.11 has a helpful example. https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html


-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Radhika Soni
Sent: 22 October 2021 16:13
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: [EXTERNAL] [WebAIM] Star ratings

Hi Everyone!

I am looking at most of the sites for star rating they have on PLP and PDp pages. These star ratings fail for color contrast ratio.
And some sites do have strokes around them, but not a thicker stroke.
So do think the stroke would help to pass for color contrast ratio if the actual color of the star is failing for color contrast. Looking for everyone's feedback and viewpoints.

[image: image.png]

Happy Friday!