Investigating Sighted Users’ Browsing Behaviour to Assist Web Accessibility Eleni Michailidou, Simon Harper and Sean Bechhofer Information Management Group School of Computer Science, The University of Manchester Kilburn Building, Oxford Road, Manchester, M13 9PL, UK
[email protected] simon.harper |
[email protected] ABSTRACT
Web pages that are inaccessible to visually impaired users. The information on most of these Web pages is visually fragmented and organized into groups [2]. As we explain later, when sighted users reach a Web page, they can scan the page and obtain a comprehension of it in an average of 5 seconds. By that time they have decided if the page is relevant to their task and have moved towards the part of the page that interests them. On the other hand, visually impaired users are hindered by the presentation of the content. This happens because they use assistive technologies, such as screen readers, that create an audio rendering of the page. Visually impaired users have to listen to the entire page being read from the top-left corner of the screen to the bottom-right in order to decide if it is useful for their task. These assistive technologies can relate a structural overview when the user accesses a page for the first time. This information includes, for example, the number of headings in the page based on the heading tags in the source code. However, if the Web page is not appropriately designed and does not comply with accessibility guidelines, this information can be misleading [28]. In addition, these technologies cannot provide instant access to any part of the page unless their users are familiar with them. In [25], the authors demonstrated that screen readers can take from 10 seconds to 3 minutes to reach the main content of a Web page. This is because some sites provide accessibility features, such as skip-links and heading tags, but others do not consider accessibility at all [25]. Eye movements are driven by properties of the visual world and processes in a person’s mind [22]. Since eye movements can now be tracked, are now used as a powerful input device for many practical applications in human-computer interaction. Investigating sighted users’ Web behaviour using eye movement tracking methods gives a better understanding of users’ page presentation perception and cognition. Users’ glancing habits provide important information on where users look first when they reach a Web page, where they pay more attention and for how long they concentrate on specific parts of the page. Most eye tracking studies, such as [9, 14, 15, 20], try to evaluate a Website with respect to its usability and accessibility level. Our investigation extends previous studies by using eye movement analysis to understand users’ behaviour with respect to page design, structure and perception. From this, we were able to draw conclusions about users’ browsing behaviour in correlation with the visual presentation and structure of the page. We assert that this kind of information can
The rapid advancement of World Wide Web (Web) technology and constant need for attractive Websites produce pages that hinder visually impaired users. We assert that understanding how sighted users browse Web pages can provide important information that will enhance Web Accessibility, especially for visually impaired users. We present an eye tracking study where sighted users’ browsing behaviour on nine Web pages was investigated to determine how the page’s visual clutter is related to sighted users’ browsing patterns. The results show that salient elements attract users’ attention first, users spend more time on the main content of the page and users tend to fixate on the first three or four items on the menu lists. Common gaze patterns begin at the salient elements of the page, move to the main content, header, right column and left column of the page and finish at the footer area. We argue that the results should be used as the initial step for proposing guidelines that assist in designing and transforming Web pages for an easier and faster access for visually impaired users.
Categories and Subject Descriptors H.5.2 [User Interfaces]: Evaluation/methodology; K.4.2 [Social Issues]: Assistive technologies for persons with disabilities; H.5.4 [Hypertext/Hypermedia]: User issues
General Terms Design, Experimentation, Human Factors
Keywords Web Accessibility, Visual Perception, Eye Tracking, Visual Impairments
1.
INTRODUCTION
The rapid advancement of technology and constant need for attractive Websites leads to inappropriately designed
Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. To copy otherwise, to republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. ASSETS’08, October 13–15, 2008, Halifax, Nova Scotia, Canada. Copyright 2008 ACM 978-1-59593-976-0/08/10 ...$5.00.
121
2.3
be used for giving feedback on the visual clutter and act as a guide for transcoding tools. This will result in simpler and more accessible versions of Web pages.
2.
RELATED WORK
Web page designers focus on good visual presentation to implicitly help users navigate, understand, and interact with the content. With the rapid and constant advancement of technology, new ways are constantly being introduced to present information that leads to visually complex Web pages. Studies such as [7] show that distinct layout, smart captions and interesting pictures can transform a wall of dry text into a presentation which users will approach enthusiastically. What happens, though, when visually impaired people try to interact with such resources? Problems arise because the implicit visual cues presented on a Web page cannot be accessed and used by people with disabilities, especially those who are visually impaired [21]. The increased complexity of a Web page is described through Website accessibility and usability frameworks. However, we attempt to relate the visual complexity of a Web page with the sighted users’ browsing patterns in order to aid visually impaired users.
2.1
2.4
Visual Complexity
Complexity can be defined as “the degree of difficulty in providing a verbal description of an image” [10, 19]. Textures with repetitive and uniformly oriented patterns are less complex than disorganized ones. A visual pattern is also described as complex if its parts are difficult to identify and separate from each other [19]. Complexity perception of an image depends on the amount of grouping a user unconsciously performs, familiarity with the scene and existing knowledge of objects inside the scene. Visual complexity is mainly represented by the perceptual dimensions of quantity of objects, clutter, openness, symmetry, organization, and variety of colours [22, 19]. Website visual perception is affected by cognition, content and form [8]. Human cognition affects how a user retrieves and uses information in a Website. Content on the Website and the amount of information that is available affects complexity since it can cause information overload on a page. The form of the Website with respect to user interface, navigation, and structure is a further factor that affects page complexity. The above studies are the closest in identifying the visual complexity of a Web page. An empirical study [16] using the above characteristics and results focused on Web page design and the structure that determines visually simple and complex designs. Developing a framework with the help of the Web page’s elements such as paragraphs, tables, lists, and menus, helped to identify the main structural factors that cause visual complexity. The author suggested that visual complexity of Web pages depends on the presentation of the page’s elements and by the density and diversity of the elements that are presented. In the study, diversity is defined as the variety of factors and density as the number of each element.
Web Browsing
Cove and Walsh [5] divide browsing into three broad categories: search, general purpose and serendipitous browsing. Search browsing is a closely directed and structured activity, where the desired goal is known; General purpose browsing is the process of regularly consulting sources that are expected to contain items of interest; and Serendipitous browsing is a purely random, unstructured, and undirected activity [5]. Sellen et al examined a set of Web activities and showed that within other types of Web interaction, 27% of the participants performed a serendipity type of browsing, 35% of them a generally purposed browsing (information gathering) and 24% of them used the Web to find something specific [24].
2.2
Accessibility Guidelines and Transcoding
Different components of Web development and interaction have to work together in order to achieve more accessible Websites. Guidelines [27], regulations and laws [23] have been introduced to force designers to create accessible Websites. However, these guidelines and regulations are not always followed leading to the need for new approaches of creating accessible Websites. Transcoding is such an approach, where the content of the Web page is reformatted so that it is better suited to assistive technologies [2, 3]. Transcoding is usually achieved through heuristics or semantics. Heuristic transcoding is accomplished when tools analyse a page and adapt it based on a set of predefined rules [4]. Semantic transcoding is the adaptation of a Web page by using the semantics of the structure or content to make better adaptation decisions. This is usually achieved with annotations which are comments or remarks that describe areas of a page [2]. We believe that understanding how both sighted and visually impaired users interact with the Web provides implicit information that should be used by such approaches for more accessible Websites.
Visual Aesthetics and Design
With the use of visually aesthetic elements viewer’s perceptions are manipulated. In Web page design, these elements can include colours, text style and size, pictures and animations. They induce the user to unconsciously and unsuspectingly choose to become involved in the Website by using elements of visual aesthetics in concert to support the intended message. Visual clarity refers to clean, clear, and symmetric designs. Also, visual richness refers to creativity and originality of the Website’s aspects. Visual clarity and richness are two of the most important aesthetic dimensions that strongly influence the ‘clients’ of a Website [11]. Design elements and techniques constantly change in order to create more attractive sites. Studies such as [13] try to identify the design characteristics of the most effective sites and how these characteristics change over time. Links, graphics, text formatting, tables, colours, and style sheets create Websites increasingly graphical in nature, and reliant on browser scripts. The use of graphics for organizational and ornamental graphics such as bullets, form buttons and icons has doubled within three years [13]. This need of attracting users with visual elements can result in visually complex pages that impede users in completing their tasks, especially visually impaired users.
2.5
Eye-tracking
In addition to following regulations and guidelines for more usable and accessible Web pages, designers and developers have to understand how visually impaired people interact with the Web. This will help them determine the elements of the page that are more usable and less accessible [30]. Tak-
122
Table 1: Web Pages used for the Experiment, Visual Complexity Level and Score [18] and Average Gaze Time Web Page Name
URL
John Rylands Library Catalogue MINT Group Vodafone UK Google Search Results Peve Group IMG Group Gene Ontology Computer Science Manchester BBC UK
http://rylibweb.man.ac.uk/catalogue/ http://mint.cs.man.ac.uk/index.html http://www.vodafone.co.uk http://www.google.com/(Visual+Complexity) http://www.cs.man.ac.uk/peve http://img.cs.man.ac.uk/ http://www.geneontology.org/ http://www.cs.manchester.ac.uk/ http://www.bbc.co.uk/
agi et al, during their studies, showed that blind participants adhered to their familiar scanning navigation methods when they faced accessibility problems [26]. This navigation involved gambling or exhaustive scanning by using landmarks in order to find the boundaries of the content area of a Web page and therefore build mental models of the page. We suggest that the increased visual landmarks on a page can impede visually impaired user navigation by increasing the time and effort to reach the information they seek. As explained before, the increased number of visual landmarks lead to a visually complex page. We believe that it is important to interpret how sighted users perceive the visual presentation of a Web page, how they rate a Web page with respect to its visual complexity and how they interact with it. Feedback can be extracted and used as guidelines for better designs or can provide supportive information to visually impaired users about the visual complexity of the page which will enhance their experience by providing an initial perception of the page. As the authors in [26] explain, visually impaired users, and specifically blind users, perform hypertext navigation in a similar fashion to sighted users and also scanning navigation which corresponds to sighted users’ eye-movements. Eye tracking technologies are now increasingly used in studies such as [9, 15, 20, 14, 29] that analyse the user behaviour in Web search or to reveal possible usability and accessibility problems. Studies such as [9, 20] try to understand how sighted users interact with Web page designs and how they decide on how to proceed. They notice that when users interacted with a list of ranked results of Web search engines they focused on the first two links (and respective abstracts) of the results [9]. In addition, when participants in [20] looked under headlines on news homepages, they often only looked at the first two to three words, and only continued to read if they were engaged by the words. The position of important navigational elements can also affect a site’s usability due to users’ expectations. For example, McCarthy et al. [15] tried to test the best position for the navigation menu on a Web page by performing an eyetracking study. They tested whether placing the menu in an unexpected position has a negative impact on search performance. Their study shows that Web users quickly adapt to an unexpected screen layout even though they expect the menu to be on the left hand side of the screen. Jay et al. [14] wanted to examine how the presentation of Web pages on standard displays makes the pages easier for sighted people to use. They investigated how sighted readers
Visual Complexity Level Simple Simple Simple Simple Simple Complex Complex Complex Complex
Visual Complexity Score 3.75 3.75 4.92 6.17 8.17 12.67 14.67 14.75 16.25
Av. Gaze Time (seconds) 6 9.1 11.3 9.3 9 11.4 12.5 10.1 10.3
used the presentation of the BBC News Web page to search for a link by comparing the standard presentation with the BBC’s text-only version. They concluded that presentation of information assisted task completion and users spent more time to complete a task in a text-only version of a Web page. In addition, Yesilada et al. [29] presented an eye tracking study that showed a strong relationship between Web page areas that receive visual attention and travel objects previously identified to hinder visually impaired users accomplish same tasks as sighted users [30].
Figure 1: The five Web page areas used for the analysis of the eye movement data
3.
EYE TRACKING STUDY
Eye tracking technologies can record and show specific page areas that users gaze on and the number of fixations an area receives. Gaze plots indicate where a user’s attention falls and fixation counts the amount of attention [22]. During this study, participants’ eye movements were tracked while looking at nine Web pages. Fixation count, gaze time and gaze plots for each Web page were analysed to investigate the relationship between browsing behaviour and page visual presentation. Data, stimuli screenshots, images and videos collected during the experiment can be found in [17].
3.1
Study Design
Each participant was asked to browse the home page of nine Websites by just looking at them and state whether they liked each page or not. We believe that by asking them to perform serendipitous browsing [5] their behaviour and
123
(a) A Participant’s Gaze Plot showing a Common Scanpath
(b) Participants’ Hotspot showing the areas with most fixations
Figure 2: BBC UK (Visually Complex): (a) Gaze Plot and (b) Hotspot
attention to any parts of the page would be affected mainly by each user’s cognition and the scanpaths would not be biased by any specific task (i.e. pointing to a link, reading aloud the news headline). The Web pages used are listed in Table 1. This study was a within-subjects design (all subjects followed the same procedure and looked at the same pages) with five variables: Header (H), Main Content (C), Right Column (R), Left Column (L), and Footer (F). These five areas (see Figure 1) can be found in most Web site layouts and analysing eye movement data based on these areas help investigate the participants’ browsing behaviour throughout the page.
3.2
analyse eye-movement and event data. The pages participants viewed were selected to be representative of sectors such as public information, business, academic, entertainment, leisure, Web services including search engines, and personal home pages [1]. Pages were a subset of the twenty pages used during an empirical study [16] previously conducted.
3.4
Procedure and Participants
Each participant was sat 60 cm from the monitor and the observer explained the experiment instructions and the measures that were going to be taken. The process started with the subject looking at an index page with a list of links that they had to follow in order to view all nine pages. The participants were asked to browse the Web page without following any link on that page and state whether they like the page. Thirty three undergraduate students, graduate students and staff within the School of Computer Science at the University of Manchester volunteered to participate in this study. The procedure was explained to each participant at the time of the study. All participants were daily internet users with normal or corrected vision.
3.3
Results
Gaze plots and hotspot visualisations over the Web page were used to identify users’ common behaviour. Gaze plots display fixations, gaze positions, and scan-paths superimposed over the Web page and show how an individual’s visual attention was allocated during a task. Hotspot visualizations summarize the gaze positions from multiple participants and create a coloured map over a Web page which indicates the areas that received the most fixations. In addition, fixation counts, times to first fixation and gaze times on each of the five areas shown in Figure 1 were used for our data analysis in order to examine where people look, which areas they focus more and which order their gaze pattern follows. First Fixation – For each area of the page we calculated the proportion of times a given participant looked at it for the first time. A significant difference was determined between these five areas1 , with F(2.974, 68.409) = 103.53, p
