Is there a problem with using black text on white backgrounds?

  • Why do a lot of websites use a text color other than #000000 black when the background is white?

    For instance, this text will be displayed using a dark grey:

    .post-text {
       color: #333;
    }
    

    Have some studies been made on that topic?

    @QPaysTaxes Oops, I meant to link http://contrastrebellion.com

  • Sheff

    Sheff Correct answer

    9 years ago

    High contrast such as black on white can cause eye strain. Also there is evidence that it is particularly bad for people with dyslexia. For further info read articles at UX Movement and The Bristol Dyslexia Centre.

    WCAG provide details on what is acceptable colour contrast, but dont state an upper limit. Personally, I like to use a different algorithm that provides an upper contrast warning. For further info, see this article at Spider Trax: "Does W3C Get Its Contrasts Wrong?"

    Slightly off topic, but check out Contrast-A, a good tool made by Das Plankton for picking accessible color schemes.

    Yes, it's a contrast issue. That's also why early computer screens were green or amber on black rather than white.

    I think the choice of light text and black screen in old computer systems was a function of the slow refresh rates, rather than any concern for health or aesthetics. A full screen of "white" takes longer to paint, and a slower phospor response time (decay rate etc) makes each pixel linger.

    I think Sheffs answer is the right answer. A week ago I wrote a post about how somebody avoids black in his UserInterface layouts, because 1. It is unnatural and 2. Black overpowers everything else

    @horatio I meant it was amber or green TEXT instead of white TEXT.

    As did I. reread what I wrote: I said that it was a functional choice rather than an aesthetic one.

    From a designer’s point of view the advantage is also that you can emphasize elements with even darker colors. (The same goes for very bright elements, of course.)

    Side note - graphic designers rarely uses complete black in designs since complete black is seldom found in nature. If a shadow is drawn on an object for a picture, there's always a shade to the blackness.

    I can't find any sources for high contrast causing eye strain.

    @HenrikEkblom curious then that anybody should use complete white, since this _never_ found in nature! (You can have perfect white _objects_, but there's no such thing as “maximum white light” – you can always increase the intensity, well beyond the point where it's unbearable to the eyes.)

    @DA01 It's as likely that green/amber were used so often as they typically only required one type of phosphor, where as white screens typically needed a mix of different phosphors and presumably would be more expensive.

    @TripeHound perhaps. I don't know. Was the mixed sulphur significantly more expensive than the non-mixed? I do remember white CRTs as well back in the day (Asteroids being one that comes to mind).

    No, a full screen of white does not take longer to paint versus a black on white screen. When a program writes a white screen, it writes #FFFFFF. When a program writes a black screen it writes #000000. Everything else is the same.

License under CC-BY-SA with attribution


Content dated before 7/24/2021 11:53 AM