Content in this resource is still under active development and should be considered beta. It may change, move, antecede, or be deleted with or without notice.
Design Guide: Paper Reading Experience
Anchor adaptation state to reduce visual fatigue.
Introduction
ON THIS TAB
Summary
Visual readability of text requires good visual contrast. Visual contrast is a product of the text characteristics, such as font weight (thickness) and font size, the lightness/darkness difference of the colors used for the text and the background, and other factors.
Using objective guidelines and tools, evaluate font stroke width (weight), font size, background color, font color, and nearby colors and adjust the properties of those elements to achieve good visual contrast and readability.
How It Solves User Needs
Some users experience eye fatigue or have difficulty reading on self illuminated displays that are too bright. The Paper Reading Experience approach provides a way to emulate reading more comfortably.
Objective
This design guide supports the objective:
Detailed Description
The visual contrast needed for easy reading of text is substantially higher than the contrast needed to simply "make out" words. At least ten times more contrast is needed for good readability than the bare minimum contrast needed for legibility.
However the overall brightness of the background behind text can significantly impact glare and cause eye fatigue. In particular, if we stare directly at the illumination source that is defining the eyes current adaptation state, we can quickly become fatigued. But when we read words printed on paper, we stare at a diffuse reflection which is normally less than 85% to 90% of the adaptation state.
The difficulty with applying this to a self-illuminated computer display, is that the adaptation state is directly affected by the brightest patches of color on a given page. If the brightest background is behind the text, for instance, then we may end up staring at the peak adaptation brightness while attempting to read.
To accommodate our need to view content that is at least 10 to 15% darker than the peak adaptation brightness, we missed adjust the background behind text to the equivalent luminance of the diffuse reflectivity of paper. However simply setting that as the overall background, or I will then adapt to that as the peak. In other words, if we set the background to #e8e8e8
instead of #fff
, then after a minute or two #e8e8e8
will become the peak adaptation luminance, and again we will develop fatigue.
To "anchor" our adaptation state at a peak that is brighter than the background under text, we use a white solid outline that is spaced away from the text, so that it influences our adaptation state through our peripheral vision.
Dependencies
- An APCA-W3 compliant perceptual contrast calculator
- Self illuminated displays or devices.
- The sRGB color space, the default color space for web content
Testing Criterion
ON THIS TAB
Informative
The Paper Reading Experience is an informative set of design guidelines, but it is not normative for the purposes of conformance to the APCA Readability Criterion.
Conformance
ON THIS TAB
Informative
The Paper Reading Experience is an informative set of design guidelines, but it is not normative for the purposes of conformance to the APCA Readability Criterion.
Tests
ON THIS TAB
Informative
The Paper Reading Experience is an informative set of design guidelines, but it is not normative for the purposes of conformance to the APCA Readability Criterion.
Test Methods
ON THIS TAB
Informative
The Paper Reading Experience is an informative set of design guidelines, but it is not normative for the purposes of conformance to the APCA Readability Criterion.
Resources
ON THIS TAB
Informative
The Paper Reading Experience is an informative set of design guidelines, but it is not normative for the purposes of conformance to the APCA Readability Criterion.