- From: Lea Verou <lea@w3.org>
- Date: Wed, 5 Sep 2012 00:11:55 +0300
- To: Elizabeth J. Pyatt <ejp10@psu.edu>
- Cc: w3c-wai-ig@w3.org
Hi Elizabeth, I believe you misunderstood the issue I’m referring to. I raised another issue about variable color backgrounds [1] which I believe is exactly what you are referring to, and is, indeed, a concern. In this one, I was referring to cases where we have a semi-transparent background, and we don't know what is going to be under it. For example, captions on a photo gallery, where the photo could be anything. We should still be able to calculate a range of ratios that is narrower than 1-21 (unless one of the colors is completely transparent). The higher the opacity, the smaller the range. [1]: http://lists.w3.org/Archives/Public/w3c-wai-ig/2012JulSep/0329.html Lea Verou W3C developer relations http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou On Sep 5, 2012, at 00:00, Elizabeth J. Pyatt wrote: > This issue came up for a site I was working on, and my recommendation would be to use a sampling tool to determine color values where the contrast would be lowest. Or you could mathematically check the contrast at each edge of the gradient span and ensure that BOTH ends past contrast checks. > > For instance, if a background is going from #333333 to #999999 and the text color is white, I would check where the white text is meeting the palest gray and ensure that contrast is satisfactory. It may be that the padding is sufficient to that the contrast is acceptable where the text actually is. > > Alternatively, you could reject this gradient since we know that #999999 and white will fail a contrast check. A change from #333333 to #6666666 (or something like #222222 to #666666) would be fine. > > On a final note, some would probably argue that most gradients degrade legibility somewhat. But I like gradients myself, so I wouldn't ban it automatically. > > My two cents. > > Elizaveth > > On Sep 4, 2012, at 4:48 PM, Lea Verou <lea@w3.org> wrote: > >> Hi all, >> >> I was studying the color contrast section of WCAG 2.0 [1] and I observed that the algorithm presented assumes opaque colors. In the case of an opaque background, it's easy to calculate the color contrast using the same algorithm, even when the foreground is translucent. However, when the background is semi-transparent (for example, CSS rgba() or hsla() colors) and the colors it’s going to be on are unknown, there is no single contrast ratio, but a range of potential contrast ratios. How would somebody calculate this range? It’s obviously impractical to calculate the ratios for every possible color that might be underneath, these could be in the millions. >> >> I tried calculating the min and max ratios by using white and black, but it did not yield accurate results. Consider the example of gray text on hsla(0,0%,50%,0.5) background (gray with 50% transparency). On white, this is gives us gray on hsl(0,0%,75%) which has a ratio of 2.1:1. On black, it gives us gray on hsl(0,0%,25%) which has a ratio of 2.7:1. However, this doesn’t mean that every potential color will yield a ratio between 2.1 and 2.7: If we have gray underneath, the resulting ratio is 1:1. >> >> My question is: Which (and how many) colors should be sampled to get an accurate minimum and maximum contrast ratio? >> >> [1]: http://www.w3.org/TR/WCAG/#visual-audio-contrast-contrast >> >> Lea Verou >> W3C developer relations >> http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou >> >> >> >> >> >> > > =-=-=-=-=-=-=-=-=-=-=-=-= > Elizabeth J. Pyatt, Ph.D. > Instructional Designer > Education Technology Services, TLT/ITS > Penn State University > ejp10@psu.edu, (814) 865-0805 or (814) 865-2030 (Main Office) > > 210 Rider Building (formerly Rider II) > 227 W. Beaver Avenue > State College, PA 16801-4819 > http://www.personal.psu.edu/ejp10/psu > http://tlt.psu.edu > >
Received on Tuesday, 4 September 2012 21:12:05 UTC