Principles of Good Interface and Screen Design 179

Step 3: Principles of Good Interface and Screen Design 179

telescope: the window moves around the screen data much as a telescope scans the stars in the night sky. In the microscope approach, the screen data appears to move under a fixed viewing window, the way an object placed under a microscope is manu- ally moved around to see it in its entirety. The research found that the telescope approach is more natural and causes fewer errors, and it was implemented. This is why, when scrolling today, clicking the up arrow on the scroll bar causes the data dis- played on a screen to move downward. The data is not actually moving; the telescope through which the data is being viewed is moving upward.

Web technological requirements have tilted the scale toward scrolling as the favored method of page viewing. Early in its popular life, scrolling seemed to cause some dif- ficulties for Web users, Nielsen (1996) reporting that only 10 percent of users went beyond what was visible on the screen by using scrolling. Apparently, in 1996 paging was a well-ingrained habit. As user familiarity with the Web increased, so did scrolling familiarity, and in 1999 Nielsen (1999b) reported that most users were now used to scrolling, having gained the understanding that things were often hidden from view. In spite of its seeming acceptance, excessive page scrolling can be cumbersome and slow. It also can disrupt the user’s perception of spatial location within a page, espe- cially while the text is scrolling. To minimize these problems, in Web page design do the following.

Avoid scrolling to determine page contents.

A page’s subject should be immedi-

ately recognizable. Elements crucial to identifying a page’s contents must be viewable without requiring page scrolling. If not visible when the page is first displayed, these elements may never be seen. Place these content-identifying ele- ments “above the fold,” or in the top 4 inches of the page.

Minimize vertical scrolling. Some scrolling may be necessary to view the entire

contents of a page. Minimize the requirement for vertical scrolling when defin- ing, organizing, and laying out a page’s components. For example, avoid large graphics and excessive amounts of white space. Place closest to the page’s top the information most likely to be needed.

Provide contextual scrolling cues. Lower parts of a page may be overlooked, espe-

cially if the visible portion appears to satisfy the user’s needs and the user erro- neously concludes that no more can be done. For pages exceeding one screen in length, provide contextual cues to the user that part of the page is hidden and that viewing the entire page will necessitate scrolling. Organize the information, for example, so that it is obvious there is more to follow. An incomplete alphabet- ical arrangement of information would be one such clue. Also, be cautious in placing screen-wide horizontal lines between groupings of content. This could convey to a casual user that the page’s bottom has been reached. Other possible “scroll stoppers” (Koyani et al., 2004) include horizontal lines, inappropriate placement of screen controls, and cessation of background color.

Provide short pages. Short pages should be provided when people are looking for

specific items of information because scrolling can consume much time. Koyani et al. (2004) report that studies have found that older users scroll much more slowly than younger users, and that Internet users spend about thirteen percent of their time scrolling.

180 Part 2: The User Interface Design Process

Facilitate fast scrolling by highlighting major page items. Dragging a scroll bar (as opposed to clicking the up and down arrows) can cause a page to move too fast for easy reading of prose text. Major headings can be scanned, however, if they are highlighted and well positioned (Bailey et al., 2000).

Provide a unique end-of-page structure. To identify the page bottom, provide a visually unique and consistent ending on all pages. A row of navigation links and other elements such as copyrights, e-mail address, and other contact information can signify “The End.” Do not place these ending elements in other locations within the page or other pages. They will convey falsely to the user that the end has been reached.

Avoid horizontal scrolling. While vertical scrolling is now acceptable in Web page design, horizontal scrolling must be avoided. A page too wide to be completely displayed within the confines of a screen will require continuous scrolling as reading is performed. This is extremely cumbersome and inefficient. Confining scrolling to simple up-and-down movements greatly simplifies the scrolling process.

Use longer scrolling pages when people are reading for comprehension. Koyani et al. (2004) recommend that longer pages requiring scrolling should be used when paging through links introduces a time delay that can interrupt users’ thought processes. The context of a message will be maintained better with minimal page delays. They report that if pages have fast loading times, there is no reliable study differences between paging and scrolling in reading comprehension. When rea- sonable response times exist, then, use paging rather than scrolling.

Encourage use of paging. Full-screen paging on the Web can be done by using the page-up and page-down keys or clicking on the scroll bar page-up or page-down icons. Text is then moved by the number of lines equaling screen size. This is almost always faster than scrolling a line at a time. Some recent studies have addressed the issue of Web page scrolling and paging. Piolat et al. (1998) found, as in past studies, no significant differences between paging and scrolling in text reading. Paging users, however, were better at building mental representations of the text, finding relevant information, and remembering the main ideas. Blinn and Biers (1999) found that, when searching Web sites with shorter pages, infor- mation was found faster using paging as opposed to scrolling. Mead et al. (1997) addressed the effects of an inexperienced user’s age on paging and scrolling. Older users (64 to 81) were more likely to use a page at a time while reading; younger users (19 to 36) tended to scroll a line at a time. Older users also per- formed best when using short full pages of information rather than continuous long pages. Paging navigation, it seems, does have advantages for users. Encourage its use.

Paging version. Ensure the availability of full pages for reading and searching on the Web and, by creating a second version of a Web site, one consisting of indi- vidual screens that are viewed through “paging.”