Elsevier

Displays

Volume 28, Issue 2, April 2007, Pages 60-67
Displays

The influence of line spacing and text alignment on visual search of web pages

https://doi.org/10.1016/j.displa.2007.04.003Get rights and content

Abstract

This research investigated the effects of text presentation on online behaviour and preferences in order to generate design guidelines for the production of web pages. Previous research has indicated that method of text presentation has a significant impact on usability. The present research found that varying text presentation had a significant effect on task performance, with wider line spacing leading to better accuracy and to faster reaction times. Left-aligned text led to better performance, although participants preferred justified text. Implications of these results for the design of web pages are discussed and recommendations given.

Introduction

With the advent of the World Wide Web, information presented on screen is now widespread. However, even a brief scan of the Internet will reveal that there is a wide variety in the way in which this information is presented. Some web sites may present data in a sparse and uncluttered style, others may present similar information in a cramped or cluttered fashion with little spacing between lines, making reading difficult. In some instances the latter approach may be appropriate, for example when there is a large amount of data presented in tabular form. However, the former approach is more likely to help with both visual search of pages and reading. Although extensive research has been conducted into the effect of a range of typographical variables on the reading of printed material [30], [34], far less has examined the relationship between typography and information presented on screens, and this lack is particularly noteworthy for web pages. Furthermore, the field of typography has investigated a wide range of variables and guidelines have been developed to indicate the best way of presenting text on the printed page (see e.g., [12]), although this advice does not map directly on to text presented on screen [4]. So it is to more recent research that we must turn for this advice. Dyson [6] presents a comprehensive summary of this work. Her paper examines the evidence that has evaluated the many alternatives for presenting onscreen text such as characters per line, use of columns and structure of the text. The current research examines the effects of two variables, line spacing and text alignment, on the visual search of web pages.

Despite the fact that there has been recognition of the importance of how text on web pages is presented (see e.g., [24], research suggests that designers need to make their web sites more usable [36]), particularly because many users may have a degree of visual impairment or dyslexia, or be lower-literacy users [25], [31]. The influence of human factors on interaction with screen elements should therefore be an integral part of the design process, because poorly designed layouts can quickly lead to fatigue, with a resultant lowering of speed and accuracy of task performance [32]. In addition, aesthetic considerations are also important for usability [20], [38] as these may be closely linked to individuals’ motivation and satisfaction [22].

Given the wide range of options for the presentation of text, it is perhaps surprising that there has not been more empirical investigation of the influence of different presentational formats on user interaction and satisfaction with web sites. However, there is general agreement that there are three basic elements that must be considered when developing a highly readable web page: typesize, spacing (whether down or across the page)[21], and colour [14]. This paper focuses on the second of these attributes, which to our knowledge has not been previously investigated empirically in web pages.

In the work that has examined the influence of design parameters, including font type [3] and line length [7], [19], the focus has tended to be on information retrieval. Information retrieval is a key activity in using the Web. As this activity involves visual search, research on the processes involved in visual search is essential. Visual conspicuity is one factor that influences the search process. This conspicuity can be defined as a combination of an object’s properties, relative to its background, which attracts attention and is therefore attended to. Conspicuity can be based on colour, shape, size, orientation and other properties of the display. Research indicates that if a target object is made visually conspicuous, search time can be up to 83% faster [26].

One way in which speed and accuracy of onscreen visual search – and hence usability – can be studied is through the manipulation of text presentation through altering parameters such as line length and text spacing. However, investigations of the effect of line length in both printed and on-screen formats have had differing results. For example, in a comprehension task, Duchnicky and Kolers [5] found that blocks of text of 75–100 characters per line (cpl) were read more quickly than when the text was presented in shorter lines. This finding contrasts with the more complex comprehension task used by Dyson and Haselgrove [7] who found that varying the amount of text presented between 55 and 100 cpl had no effect on reading speed. However, both of these tasks were based on reading blocks of text presented on-screen and not in the context of a realistic web browser window. In a more recent study, Ling and van Schaik [19] examined the effect of line length on objective and subjective measures using a realistic web environment. They found that line length influenced both types of measure. Their results had practical implications for individuals involved with web design. They suggested, first, that longer line lengths should be used when information is presented that needs to be scanned quickly, and second, shorter line lengths should be used when text is to be read more thoroughly, rather than skimmed. Given a choice between using long (85–100) and short lines (55–70), designers should opt for shorter lines, as though scanning web pages is a major activity when finding information on web sites [15], the majority of text-based web content is presented to be read rather than skimmed.

Line length can also be considered in terms of alignment, the way in which text is spread across the page. In terms of horizontal alignment, text can be presented as left- or right-aligned, which leads to uneven margins on the right or left side of text, respectively, or as justified, where the spaces between words are increased so that the text fits across the page with even margins on each side. No research has examined the effect of varying text alignment on the usability of web pages; however there is reason to believe that there may be differences in usage of web pages related to variation in typographic style given research that has used objective and subjective measures to inform the design of printed material (see e.g., [12], [13]). With printed material, there appears to be an advantage of greater interlinear spacing over lesser [10], though this has also not been verified with web pages.

Several factors impact on the usability of web pages, which can be determined using measures such as the time taken to perform tasks or in the accuracy of task performance (see e.g., [37]). Objective measures are commonly used to measure the usability of web sites. However, researchers have also recently begun to investigate the implications of aesthetics for the development of visual displays [23], [35] and web pages [28]. Users’ perceptions of a web site may be closely linked to the length of time they will spend on a site, as well as the probability of them returning to a site. Indeed, researchers have found a strong link between judgements of the aesthetic appeal of interfaces and their apparent usability [17]. Attention has focused on subjective measures as a means of exploring user satisfaction [1]. Subjective or preference data help the development of web sites that are visually appealing. At the same time, these data can be used along with objective data to produce better web sites, through an improvement in user satisfaction, higher levels of task performance or a combination of these. In addition, subjective measures can be more sensitive to differences in display quality than performance measures [27]. Tractinsky et al. [35] developed and validated an aesthetics evaluation scale which they used to test the relationship between the visual appeal of ATM and its usability. They found strong correlations between the system’s perceived aesthetics and its usability with a strong link between interface aesthetics and ‘a priori perceptions of ease of use’ ([35]: 140). This scale has since been used for the evaluation of web pages (e.g., [38]).

This research therefore had three aims. First, to examine the extent to which line spacing and text alignment have an impact on speed and accuracy of visual search performance. Second, to evaluate the impact of these design choices on users’ aesthetic evaluations of web sites. And finally, aim to explore further whether a relationship exists between aesthetic considerations, preference and usability (performance) measures in use of the internet.

Section snippets

Experimental design

The experiment used a two-factor mixed measures design. The within-subjects factor was line spacing, with three levels: single spacing (1), space-and-a-half (1.5) and double spacing (2). The between-subjects factor was text alignment with two levels: left-aligned and justified. The dependent variables were accuracy and speed of visual search as well as subjective measures relating to aesthetic appeal.

Participants

There were 65 undergraduate participants, 47 of whom were female. Of these, 26 took part in the

Results

The effects of line spacing and text alignment on accuracy and speed of task performance as well as aesthetic value and preference were analysed. A series of 2× (3) analyses of variance (ANOVA) assessed the effects of alignment (left-aligned or justified) and line spacing (1, 1.5 or 2 lines) on outcome measures; where appropriate, post hoc analyses were conducted to test for specific differences between line spacings.

Discussion

The present research examined the influence of two variables, line spacing and text alignment, on objective and subjective measures in the visual search of web pages. Overall, the findings were consistent. Where a difference existed between the types of presentation for the accuracy and speed measures, the order of performance was the same for both spacing and alignment: participants performed better with double line spacing than with 1.5 spacing, and better with 1.5 than single spacing.

References (39)

  • P. van Schaik et al.

    The effect of link colour on information retrieval in educational intranet use

    Computers in Human Behavior

    (2003)
  • A. Davidov, Computer screens are not like paper: typography on the web, in: R. Sassoon (Ed.), Computers and Typography...
  • A. Dillon

    Reading from paper versus screens: a critical view of the empirical literature

    Ergonomics

    (1992)
  • R.L. Duchnicky et al.

    Readability of text scrolled on visual display terminals as a function of window size

    Human Factors

    (1983)
  • M.C. Dyson

    How physical text layout affects reading from screen

    Behaviour & Information Technology

    (2004)
  • M.C. Dyson et al.

    The effects of line length and method of movement on patterns of reading from screen

    Visible Language

    (1998)
  • R. Fabrizio et al.

    Readability as a function of the straightness of right-hand margins

    Journal of Typographic Research

    (1967)
  • R.S. Grabinger

    Computer screen designs: viewer judgments

    Educational Technology Research and Development

    (1993)
  • W.D. Gray et al.

    Milliseconds matter: an introduction to microstrategies and to their use in describing and predicting interactive behaviour

    Journal of Experimental Psychology-Applied

    (2000)
  • Cited by (42)

    • Does BeeLine Reader's gradient-coloured font improve the readability of digital texts for beginning readers?

      2022, Computers in Human Behavior Reports
      Citation Excerpt :

      A brief overview of several important principles and empirical findings that are related to these design features is provided below. Line spacing is known to affect the readability of a text (Bernard et al., 2007; Blackmore-Wright et al., 2013; Calabrèse et al., 2010; Chung, 2004; Chung et al., 2008; Katzir et al., 2013; Ling & van Schaik, 2007; Madhavan et al., 2016; Rello et al., 2016). More specifically, reading pace increases as a function of enhanced line spacing, presumably by decreasing the adverse effect of visual crowding2 between adjacent lines (Bernard et al., 2007; Chung, 2004).

    • Effects of text space of Chinese-English bilingual traffic sign on driver reading performance

      2021, Displays
      Citation Excerpt :

      Luna [23] and Highsmith [24] recommend adding 20 percent to the type size to give the line spacing for the standard practice on text setting. When doing a visual search on a web page, Ling and van Schaik [25] found that deeper line spacing achieved faster search time. However, for Chinese reading, Chan and Steve [26] found that the increased line spacing resulted in longer reading time in proofreading performance.

    • UIPA: User authentication method based on user interface preferences for account recovery process

      2020, Journal of Information Security and Applications
      Citation Excerpt :

      Moreover, according to [6], the correlation exists between an individual's characteristics and his/her choice of font type. Personality factors affect UI design preferences [44,46,53]. Therefore, the users’ characteristics will affect their interface preferences, and each individual has his/her own characteristics for different interface designs.

    View all citing articles on Scopus
    View full text