Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I did not want to get to the endless war of dark-on-light vs light-on-dark, but recently I discovered something interesting: while light-on-dark text is still less tiring for my eyes (and I also personally prefer it more), dark-on-light seemed to do better on holding my attention on the content of the text; in other words it helps focusing more on what you read. This is much more noticeable with longer text that take a few minutes to read.

I'm looking for any papers, researches, measurements, Google Analytics, anything, that was done to see if a text was more understandable, stuck more with the reader, made it easier to recall from memory and not for the ones concentrating on readability.

Has anyone done research indicating one way or the other?

share|improve this question
1  
This maybe down to the fact light-on-dark is easier to see due to only the text and content is emitted at you via light. So less information helps vision focus. –  Zacharia Samuel Grierson Jun 20 at 10:44
    
Interesting theory. The white (light) probably requires more out of your eyes, thus narrowing your iris increasing focus, where as the black (dark) requires less from your eyes, and your iris eases up (reducing muscle tension). –  kcdwayne Jun 20 at 20:06
    
@kcdwayne yes, that is true, but I'd still be interested in the long(er) term results as in is there any connection between the theme and the ability to recall the read text. –  petermolnar Jun 20 at 22:36
    
@ZachariaSamuelGrierson black text on white background seemed better, not the light text on dark background. –  petermolnar Jun 20 at 22:38
    
@petermolnar Do you mind if I submit this as an answer? –  Zacharia Samuel Grierson Jun 26 at 10:14

4 Answers 4

The most fundamental fundamental of good typography for long text is that the type should be "invisible" to the reader, so there is nothing to interfere with the communication of information. From that, we get the principles that serif faces and lightweight sans are better long text than regular sans, and dark on light tends to be preferable to light on dark. There is a short summary of this generally accepted typographic wisdom here. You really can't divorce readability from comprehension, and therefore retention.

That said, I know several reasons for lack of retention that have nothing to do with typography, and I've also seen some downright idiotic research in this area (like the guy who cut text columns down the middle and separated them by 1/4 inch because it "forced the reader to concentrate more in order to follow the text"). So your experience in this case may be related to the type, and it may not.

Sticking with typography, though, the bottom line is that what is comfortable to read is more likely to be absorbed than what is not.

There's a raft of research in the optometric field, particularly vision therapy, pointing to a connection between poor eye coordination ("convergence insufficiency" in the jargon) and inattentiveness, lack of retention, even a dislike of reading generally. (Often misdiagnosed as dyslexia or ADHD.) The effect of the various forms of convergence insufficiency is a kind of eyestrain that makes reading uncomfortable. The same is true of people who need corrective lenses to read but don't wear them.

It's not much of a stretch to conclude that anything about the typography of a long text passage which is less-than-ideal is likely to have a negative effect on attention and retention.

In general, the biggest source of discomfort when reading long text passages is excessive contrast. The ni plus ultra of this is taking a book that's printed on bright white paper and trying to read it in direct sunlight.

When looking at a generally dark field (light-on-dark text, for example), the pupil of the eye widens. Without getting into the technical details, wider pupil == less sharp focus, a slight fuzzing out at the edges of the type. That's just how optics work. This is also why it's so painful to read in dim light. The pupils are at maximum dilation, which means that focus is at its worst.

Looking at a light page, the pupil narrows. Narrow pupil == sharper focus (which incidentally increases the edge contrast of objects in the visual field). From this, you might conclude that sans type, being of chunkier build than its serifed cousins, reads better reversed out of a dark background than a serif face, and you would be right.

Helvetica and similar sans faces create strong contrast with their background, and are uncomfortable to read when rendered black on white or white on black, unless you use the lightest weight. When I'm setting text in a sans, I'll use the lightest weight available and/or something like a grey

Traditional serif text faces such as Caslon, Jenson and Garamond have less visual contrast printed on a light substrate, so are more comfortable to read. Slab serifs like Egyptian Slate are readable only in lighter weights. A Didone or Bodoni, with its strongly contrasting thick and thin strokes, tends to be too contrasty for comfortable reading.

Focus problems can be subtle. It doesn't have to be a question of light-on-dark. The eye focuses red and green light differently, and if you really want to give yourself a headache, convert a few pages of text to red on green and try to read them. It hurts!

share|improve this answer
    
This is a very nice and long answer, and you're quoting a few researches; I'd be glad to accept it, including the bounty if you could please link the quotes' sources. –  petermolnar Jun 26 at 13:50
    
Unfortunately, I don't have the free time to dig up 40-odd years of references. What I've given here is what I've also found to be true in practice and is easily tested for oneself. The one part that you might find difficult to track down, I suspect, is the vision information. I've linked to a page with a number of excellent articles. –  Alan Gilbertson Jun 27 at 21:03

A lot of people have researched this in a variety of ways and capacities. Some can be found using Google Scholar. Here are a few excerpts I found that pertain to the question, and their source:

2.2.2. Color and visual attention

Among a variety of graphic components on screen, color is one of the powerful components of design. Interface designers must be able to understand how to apply colors in design. As Tufte (1989) asserts, ‘‘skillful visual design of computer screens—with care given to color, typography, layout, icons, graphics and coherency—substantially contributes to quality and usability.’’ Several studies show the effects of color in human information processing. Hoadley (1989), for example, states that color, one of the attributes of a visual stimulus, can attract human attention. Moreover, Marcus (1992) expresses that color is the most complicated visual component. Furthermore, extensive studies on color in visual attention, particularly in visual search, show that color is an object component that effectively distinguishes a stimulus from the surroundings (e.g., D’Zmura, 1991).

The effects of color on human performance have been evaluated in several task settings. These task settings are detecting colored targets among non-colored distractions, detecting colored targets among colored distractions whereby the color of targets is different from the color of distractions, and detecting targets containing the conjunctions of features (e.g., color and orientation). Treisman and Gelade (1980), for instance, report that the need of attention to join object features together causes a participant takes more time in detecting a green letter T on a screen that contains an equal number of brown T’s and green X’s. Another study shows that in searching for target words from a list of colored target words and colored non-target words, text-color differences significantly influence search time, particularly when the target color is known (Nes et al., 1987).

Clearly, evidence shows that color has an impact on visual attention in various contexts (e.g., visual searching and reading). The above studies manipulate the color of targets and non-targets, and non-targets are defined as distractions. This present study, on the other hand, does not explore colors of target words and non-target words. Rather, colors of animated banner graphics (distractions) are investigated.

Zhang (1999) has investigated a similar problem. In that study, bright color is the vital attribute of animated banners, which can greatly distract user attention. The brightness attribute is explored in two levels, bright color and dull color. No hue color is reported, which leaves a difficulty for further investigations. However, the result shows that an animated graphic with a bright color distracts a user’s attention more than an animated graphic with a dull color.

In terms of color usage in graphics, general guidelines are well discussed. Marcus (1992) recommends using appropriate colors for central and peripheral areas. Blue is appropriate for large areas such as screen backgrounds. Red and green are recommended for an area in the center of the visual field, whereas black, white, yellow and blue are better used in the periphery of the visual field.

Moreover, every combination of colors can probably create different effects. For instance, studies show that ineffective combinations of colors on graphic designs can reduce user performance and satisfaction (e.g., Latomia and Happ, 1987). Effective combinations of text and background colors of animated banner graphics are one of the influencing factors that could facilitate information processing and increase click-through rate, readability of banner message, brand awareness, appreciation of Web appearance, and usability of a Web page.

Source: Cultural differences on attention and perceived usability: Investigating color combinations of animated graphics

There are two concepts to explore further in relation to this question. Zhang's research on brightness as a distraction, and Marcus' recommendation of different colors for different areas of focus. The following research seems to address both, in a single paragraph!

Findings on attention showed that on any background, colors of maximum saturation and brightness attract the most attention (67%). Yellowgreen, green, cyan range (45%) attracts attention, followed by red, magenta range (30%). Findings on preference showed that colors having maximum saturation and brightness are most preferred (25%). Blue is the most preferred hue regardless of the background (25%). Foreground-background color relationships in terms of attention and preference are also included in the findings of the study.

Source: Effects of Hue, Saturation, and Brightness on Attention and Preference


My own conclusion:

Based on the new reading I did which was more than just those excerpts, as well as other papers I've read, it would seem to me that contrast of brightness is important. Perhaps this is why great designers often avoid pure white and pure black. This very site only has off-white and dark greys. So what I find the answer wanting to be is that Light On Dark vs Dark On Light for attention is less important then the Range of brightness. However, as you mentioned and I could link many studies which indicate, light on dark is easier to read. One might as others in this question offer the contradiction that by using light on a dark background it allows the eyes an easier time focusing on those things. Which seems to me an accurate statement, but again within a reasonable range. A pure black background is no good.

This also agrees with Alan's wonderful answer regarding contrast and the more mechanical side of how we view these colors:

In general, the biggest source of discomfort when reading long text passages is excessive contrast. The ni plus ultra of this is taking a book that's printed on bright white paper and trying to read it in direct sunlight.

When looking at a generally dark field (light-on-dark text, for example), the pupil of the eye widens. Without getting into the technical details, wider pupil == less sharp focus, a slight fuzzing out at the edges of the type. That's just how optics work. This is also why it's so painful to read in dim light. The pupils are at maximum dilation, which means that focus is at its worst.

Of course I'm no scientist, psychologist, or color-theory expert so read the entire reports on your own and draw your own conclusions.

share|improve this answer

While this is a subjective answer, I feel that the answer is: it's subjective and completely based on past experience and your own subconscious expectation.

I have strongly noticed when changing from one to the other, regardless of whether I have switched to dark-on-light or vice-versa, that if it is not the same as what I am conditioned to for the particular context, that it will be very hard to concentrate.

Even with two very closely related environments, code windows and command windows, I find I need them different. I cannot comfortably use a light-on-black code window or a black-on-white command window, for example.

share|improve this answer

As per our OP comments discussion.

This maybe down to the fact light-on-dark is easier to see due to only the text and content is emitted at you via light. So less information helps vision focus.

We expanded more on this in the OP but this would be my submitted answer.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.