See also: writing for the web
Design elements for great web pages: readability, browsability, searchability plus assistance
In order to be useful, any information must be readable, browsable, and searchable. With increasing size and complexity of today's information systems, interactive user assistance is becoming a necessary feature as well. This essay outlines these qualities so you, as an information system manager, can incorporate them into your products and services.
How to match type size to readership
Some guidelines for selecting appropriate font sizes based on the age of your target audience.
Typography and the aging eye: typeface legibility for older viewers with vision problems
"We know that for signage to function well that it must display useful information, be placed at an accessible point in the space and at a proper viewing height, and be adequately illuminated. Text must be the proper size for readability from desired distances, and must contrast clearly against the background. The demands of the aging eye, however, require typefaces that function well under low vision conditions. Both type designers and signage designers need to be aware of the issues surrounding common vision problems of the aging population, so that the needs of this group might be better addressed in the future."
(Paul Nini - AIGA Design Forum)
Understanding web typography - an introduction
This article cuts a swathe through the complexities of web typography, explains the possible pitfalls, and provides some guidelines for creating accessible and easy to read web pages.
Why readability testing is not enough
The recent press coverage of the Bath University research paper "Readability Assessment of British Internet Information Resources on Diabetes Mellitus Targeting Laypersons" has raised interesting questions about some of the methodologies used to measure users' experience on the web. On the face of it, the conclusion and the methodology used is fine, but due to the indiscriminate nature of automated testing tools, it doesn’t present the entire picture and, at worst, can give the impression that the users of these websites can’t understand the content at all, which may not be the case.
A comparison of popular online fonts: which is best and when?
A general survey of the Web finds that a majority of sites use 12-point fonts (size= 3) for much, if not all of their written content. With this in mind, we examined the most popular font types at this size for differences in effective reading speed (reading time/accuracy), as well the perception of font legibility.
A comparison of two computer fonts: serif versus ornate sans serif
This study compares reading performance between an ornate sans serif font (Gigi) and Times New Roman. The traditional measures of reading speed, comprehensibility, and subjective preference were employed.
A preliminary report on two pilot readability/usability studies (PDF)
Companies are beginning to conduct readability studies to determine how to provide customers with usable sites. Results have been inconclusive, conflicting, and often contradicting results of printed text studies. To discover how users use web sites, two pilot studies were designed to examine users, their purposes, and their reading processes. Many results parallel those of previous studies. In addition, new results indicate we need to examine several new variables, including amount of usage, site-specific knowledge, conventionalisation, print bias, gender and age.
Examining the legibility of two new ClearType fonts
"This article introduces six new ClearType fonts developed by Microsoft. Legibility of two of the serif fonts, Cambria and Constantia, is compared to the traditional serif font Times New Roman. Results show that the legibility, as measured by the number of correct identifications of briefly presented characters, was highest for the new font Cambria, followed by Constantia, and then Times New Roman. Old style digits, such as 0,1, and 2, used in Constantia resulted in confusion with the letters o, l, and z. Times New Roman symbols were confused with both letters and other symbols. "
(Barbara S Chaparro, A Dawn Shaikh, Alex Chaparro - Usability News)
Research-based guidelines on the use of fonts on the web.
How users read on the web
People rarely read web pages word by word; instead, they scan the page, picking out individual words and sentences. In a study John Morkes and Jakob Nielsen found that 79 percent of test users always scanned any new page they came across; only 16 percent read word-by-word.
Interface design and optimisation of reading of continuous text
1996 paper on the cognitive aspects of reading on a computer screen.
Is multiple-column online text better? It depends!
"This study investigated the effects of multi-column displays and justification on reading performance and satisfaction of an online narrative passage. Participants read a short story displayed in one of six formats (one, two, or three columns, in either a full or left-justified format). Results showed a significant column x justification interaction with reading speed significantly faster for the two-column full-justified text than for one-column full-justified, and significantly faster for one-column left-justified than for one-column full-justified or three-column full-justified text. Post-hoc analyses indicate that the faster readers may have benefited most from the two-column justified format."
(J Ryan Baker)
Optimal line length
What can we conclude when users are reading prose text from monitors? Users tend to read faster if the line lengths are longer (up to 10 inches). If the line lengths are too short (2.5 inches or less) it may impede rapid reading. Finally, users tend to prefer lines that are moderately long (4 to 5 inches)
Perception of fonts: perceived personality traits and uses
"This study sought to determine if certain personalities and uses are associated with various fonts. Using an online survey, participants rated the personality of 20 fonts using 15 adjective pairs. In addition, participants viewed the same 20 fonts and selected which uses were most appropriate. Results suggested that personality traits are indeed attributed to fonts based on their design family (Serif, Sans-Serif, Modern, Monospace, Script/Funny) and are associated with appropriate uses. Implications of these results to the design of online materials and websites are discussed."
(A Dawn Shaikh, Barbara S Chaparro, Doug Fox - Usability News)
Readability of fonts in the Windows environment
The readability of twelve different fonts and sizes in the Microsoft Windows environment was studied. The specific fonts were Arial, MS Sans Serif, MS Serif, and Small Fonts. Their sizes ranged from 6.0 to 9.75 points. These were presented using black text on either a white or gray background and either bold or non-bold style. There were significant differences between the various font/size combinations in terms of reading speed, accuracy, and subjective preferences. There were no consistent differences as a result of background color or boldness. The most preferred fonts were Arial and MS Sans Serif at 9.75. Most of the fonts from 8.25 to 9.75 performed well in terms of reading speed and accuracy, with the exception of MS Serif at 8.25. Arial at 7.5 and both of the Small Fonts (6.0 and 6.75) should generally be avoided.
Reading electronic text
Reading text from electronic displays has now become a routine behavior in the workplace and elsewhere. As the computer replaces paper documents, the problems of reading text from electronic displays becomes increasingly evident. A decline in performance in display reading performance can be as high as 40 percent or more when compared to the same text read from paper. This report provides a review and analysis of recent studies of reading from electronic displays. Factors examined include not only display variables such as flicker, spatial resolution and image quality, but also the effects of autoscrolling, single and multiple word sequential presentation, color, font characteristics, and other factors. Of particular note are the effects of display presentation methods on text legibility and comprehension. Conclusions and recommendations for user interface design are provided. Note: this research must be purchased.
Reading online text: a comparison of four white space layouts
In this study, reading performance with four white space layouts was compared. Margins surrounding the text and leading (space between lines) were manipulated to generate the four white space conditions. Results show that the use of margins affected both reading speed and comprehension in that participants read the bargin text slower, but comprehended more than the no margin text. Participants were also generally more satisfied with the text with margins. Leading was not shown to impact reading performance but did influence overall user preference.
Reading online text with poor layout: is performance worse?
"This study examined the effects of enhanced layout (headers, indentation, and figure placement) on reading performance, comprehension, and satisfaction. Participants read text passages with and without enhanced layout. Results showed that reading speed and comprehension were not affected by layout, however, participants were more satisfied with the enhanced layout and reported it to be less fatiguing to read."
(Barbara S. Chaparro, A. Dawn Shaikh, J. Ryan Baker)
Reading text online
Are we ready to make definite statements about paging vs. scrolling and line length for online text? I don't think so. Although research on line length dates back to previous centuries, research on online reading and paging vs. scrolling is still pretty new. It will take a larger body of research before we can state these guidelines with research certainty. In the meantime, I suggest that so far the results tell us to use a medium line length for adults and a narrower line length for children.
It is very difficult to improve reading performance. Historically, one way to improve performance has been to create newer, clearer fonts. Most fonts being read on computer monitors were designed to be read from paper. This study evaluated two fonts that were specifically designed for use on computer monitors. The new fonts were Georgia and Verdana.
The effect of screen size on readability using three different portable devices
As small portable computing devices become more prevalent in society, the readability of text available on such devices becomes of increasing concern. This paper describes two experiments that compare the readability of text presented on three portable devices, a laptop, a Rocket Book, and a Palm Pilot. The first experiment involved a visual search task on one page of text while the second experiment required scrolling (or paging) of text. We hoped to discover whether reading speed was affected by screen size when text was presented with and without the need for scrolling. We also hoped to determine whether error rates were correlated to screen size. Finally, we wished to investigate issues of user satisfaction as they related to the different devices.
The effects of contrast and density on visual web search
This study evaluated the effects of white space on visual search time. Participants were required to search for a target word on a web page with different levels of white space, measured by level of text density. Screens were formatted with one of four types of graphical manipulation, including: no graphics, contrast, borders and contrast with borders under two levels of overall density and three levels of local density. Results show that search times were longer with increased overall density but significant differences were not found between levels of local density. Only the use of contrast was found to be significant, resulting in an increase in search time.
The effects of line length on reading online news
"This study examined the effects of line length on reading speed, comprehension, and user satisfaction of online news articles. Twenty college-age students read news articles displayed in 35, 55, 75, or 95 characters per line (cpl) from a computer monitor. Results showed that passages formatted with 95 cpl resulted in faster reading speed. No effects of line length were found for comprehension or satisfaction, however, users indicated a strong preference for either the short or long line lengths."
(A Dawn Shaikh)
The efficiency and preference implications of scrolling versus paging when information seeking in long text passages
This study (a PhD dissertation) looked for guidelines related to the preferred use of two protocols (scrolling and paging) for finding information in browser-delivered text passages. Four treatments combined these two protocols with two text lengths, one of two screens and the other of six. The study sought information about the relative accuracy, elapsed time, protocol preference, and gender differences for the two protocols. The study found support for using a paging protocol for longer text passages when "finding" information is the goal. The study did not assess learning styles (e.g., field dependent/independent, deep/surface processing) for correlations with accuracy and quickness outcomes, nor did it question interviewees about the metacognitive approaches they used. Future studies could look at these.
The impact of paging vs. scrolling on reading online text passages
In this study, we examined the use of paging vs. scrolling in reading passages, including participants' reading comprehension in paging and scrolling conditions. The findings show that participants using the paging condition took significantly longer to read the passages than either the full or scrolling conditions. Participants also showed no significant differences in their ability to answer comprehension questions correctly, nor in their perceptions or satisfaction of the reading conditions.
Typography and the user interface
"While processing speed and computational flexibility have grown at incredible rates, our displays, the most human-facing elements of our digital lives, lag behind."
What size and type of font should I use on my website?
This study examined TNR and Arial fonts for readability (accuracy in reading text material), reading time, perceptions of font legibility and sharpness, as well as general font type/size/format preference.
Books and book reviews
Accessible web typography
Companion website for the book Accessible Web Typography: An Introduction For Web Designers by Jim Byrne.
Adult reading skills bibliography
Often the demands made on readers' cognitive resources vary with the medium of the documentation (e.g. printed leaflet vs computer-based interactive multimedia document) and with the task within which the reading is embedded (following instructions, completing a form). This is reflected in the subdivisions within the publications list. However, a single document can involve several representational forms (e.g. prose, diagrams and tables). Consequently some publications are listed under more than one heading.