E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 3 (In chronological order)

From: Joseph Sherman
Date: Fri, Nov 10 2017 10:05AM
Subject: Red on White fail Color Contrast?
No previous message | Next message →

My tools are telling me that plain "Red" (#FF0000) on "White" (#FFFFFF) fails the WCAG color contrast test with a 4:1 ratio. We have a lot of Red on White for error messages, notifications, etc.

Is this accurate? I would have thought standard Red on White would pass testing?


Joseph

From: Jeremy Echols
Date: Fri, Nov 10 2017 10:11AM
Subject: Re: Red on White fail Color Contrast?
← Previous message | Next message →

I'm seeing the same results on the webaim contrast checker: https://webaim.org/resources/contrastchecker/

Looking at the small text, I would agree that it's just a bit painful to read. The larger text is definitely fine, though, so it'll depend on the font used for your messages.

You might consider #AD0000 as it's still a pretty strong red, but it passes at AAA even on smaller fonts. Or you could just go for #EE0000 if you want to preserve the closest possible "feel" while not violating WCAG AA, though IMO it's not as easy to read.

From: Chagnon | PubCom
Date: Fri, Nov 10 2017 11:07AM
Subject: Re: Red on White fail Color Contrast?
← Previous message | No next message

That "standard" shade of red (FF 00 00) creates a vibration effect for most sighted people and should be avoided in all digital media. Just darken it a tad to create a better, more readable red.

Any of the "web-safe" colors that begin with FF should be avoided. 99 00 00 and 99 33 00 would be better choices.

FYI, the theory behind those so-called "standard" or web-safe colors has been debunked since the late 1990s. These colors are the ones with repeated pairs of numbers/letters, like 99 66 33 or 33 00 CC. You often see them in run-of-the-mill color pickers in our digital media software.

They were called web-safe because in the early days of HTML development, the early 1990s, these hexadecimal numbers produced colors on our early RGB monitors without dithering (those patterns that look like they have plaids or window screening overlaid). Remember, back then our monitors were only VGA 640 by 480 resolution at 72 p p I, so they could only show a few thousand colors. In contrast, today's smart phone screens have 400 p p I and higher resolutions, and show millions of colors. Desktop monitors are now 4k and 5k, which is 4,000 pixels.

That particular set of colors was developed by a computer algorithm with no concern about aesthetics or readability by human eyes. Consequently, the set is heavy with butt-ugly colors that no one should use for any purpose whatsoever, including way too many neon blues and greens. See https://html-color-codes.info/web-safe-colors/

Yuck!
Avoid that color palette!

This also means that the standard blue used for hyperlinks should be adjusted, too, because it's one of those "web-safe" neon blues picked by a computer that causes vibration for some sighted humans.

Here's a good website about HTML / hex colors:
www.html-color-codes.info

— — —
Bevi Chagnon | www.PubCom.com
Technologists for Accessible Design and Publishing
| Acrobat PDF | Print | EPUBS | Web | Sec. 508 Accessibility |
— — —