WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Color Contrast

for

From: Jared Smith
Date: Jun 3, 2009 8:55PM

On Wed, Jun 3, 2009 at 5:55 PM, David Ashleydale wrote:

> Sorry to keep harping on this, but could someone help me find a definitive
> answer to the points vs. pixels thing?

The answer is that there is no answer. There is no direct comparison
between print points and screen rendered points. Knowing that there
isn't a way to do this exactly, you can just use the following and
just say it's gospel truth because someone at WebAIM said so.

Default font size: 1em = 100% = 16px = 12pt = 16PSpt

Large font: 1.5em = 150% = 24px = 18pt = 24PSpt

Large/bold font: 1.166em = 116.66% = 18.66px = 14pt = 18.66PSpt

(pt's are points on in HTML and PSpt are points in Photoshop)

And before anybody corrects me, yes I know this is system dependent
and blah blah, but it's close enough for WCAG conformance.

So if the text they've created in Photoshop is >24pt or >18.66pt and
bold, then it's "large-scale text" and needs a contrast ratio of 3:1.
If it's smaller, then it needs the higher 4.5:1 contrast ratio. And
heaven forbid they actually give big text the higher contrast ratio!!
It's totally silly that you and your designers are so hung up on
compliance that it's resorted to something like this.

I can sum up the WCAG contrast requirements as, "Text needs good
contrast. If it's big text, it doesn't require quite as much
contrast."

You can eyeball most of this - and ultimately accessibility comes down
to eyeballs, not ems, points, or contrast ratios. Nobody's going to
bust your chops over the difference in required contrast ratios for
text that is a sized in points versus pixels.

Jared