PROCEEDINGS of the HUMAN FACTORS AND ERGONOMICS SOCIETY 51st ANNUAL MEETING—2007

1200

“F” Pattern Scanning of Text and Images in Web Pages Sav Shrestha [email protected]

Kelsi Lenz [email protected]

Justin Owens [email protected]

Barbara Chaparro [email protected]

This article discusses users' visual scan paths of web pages containing text and/or images while conducting browsing and searching tasks on an e-commerce website. Participants were exposed to two web pages, one image-based and one text-based, and asked to perform either a search or browse task on each. They were also asked to perform a search task for a non-existent category on the image-based page. Results show that users follow a fairly uniform scan path with greater fixations on images above the fold when browsing through image-based pages. Fixation counts dramatically dropped on images close to the fold and below the fold. The users performing the searching task on the image-based page seemed very efficient. They seemed to employ unique and random scan paths to successfully accomplish the search. Nielsen’s ‘F’ pattern (2006) was confirmed in both the text-browse and text-search tasks. Neilson (2006) suggests that website users scan text on a webpage in a pattern resembling the English alphabet letter “F”. In his study, an eye-tracking device was used to record the number of fixations and fixation duration on a webpage. Visual inspection of a heatmap plot of the page revealed a long horizontal bar on top, a long vertical bar on the left, and a slightly shorter bar beneath the initial horizontal bar. This study sought to investigate whether or not this F-shape viewing pattern is dependent on the page content (text-based vs. image-based) and/or on the user motivation in viewing the page (searching vs. browsing). With the advent of new technology, eye-tracking tools have become increasingly easier to implement, and with that, eye-tracking research has grown both in popularity and number. Fundamental studies have established parameters for studying eye movements that are widely accepted in behavioral studies. Saccades, as defined by Rayner (1998), are rapid eye movements in which additional visual information is not acquired, though some peripheral information may be available. Fixations are defined

as a static gaze fixated on one specific area lasting 200-300 milliseconds between saccades (Rayner, 1998). Areas-Of-Interest (AOI) are defined as subjectively defined areas of a page in which eye movement data can be individually quantified (Goldberg, Stimson, Lewenstein, Scott, & Wichansky, 2002). There have been many studies in which eye movement data has been examined as users visit websites. For example, Granka, Joachims, and Gay (2004) investigated how users searched through the results generated by the Google search engine. They were especially interested in examining the number of results that were evaluated before the user revised the search or clicked on a result. Twenty-six participants were asked to use the search engine to answer ten questions. Results showed a significant decrease in the average fixation duration after the first two results. They also noted that the number of search results observed below a clicked link was relatively small, suggesting visitors scan from the top of the page downward.

PROCEEDINGS of the HUMAN FACTORS AND ERGONOMICS SOCIETY 51st ANNUAL MEETING—2007

One common question when conducting eye tracking research on websites is what this data actually tells you about the site. Russell (2005) conducted a study to examine the relationship between eye-tracking measures and the more traditional measures of website usability. He also sought to determine if eye-tracking measures were sensitive to differences in task difficulty and site usability. He asked 36 participants to perform a series of eight tasks on three similar e-commerce websites. Traditional website usability data was collected (i.e., task success; time to complete task; number of pages visited; perceived task difficulty; overall satisfaction), as well as eye-tracking measures (i.e., number of fixations; dwell time; average fixation duration; time to first fixation per AOI). Results showed significant differences between tasks in terms of total dwell time and number of fixations, despite overall task success. There were also significant differences in two of the three sites between tasks in terms of average fixation duration. With the exception of average fixation duration, eye-tracking measures were highly correlated with the measures of site usability. In the current study, participants were exposed to two web pages, one image-based and one textbased, and asked to perform either a search or browse task on each. Number of fixations and average fixation duration were gathered by AOI in each condition. Heatmap analysis was used to determine if the fixations conformed to the stated “F” pattern in each condition. It was expected that this “F” pattern would remain consistent between browsing versus searching in the different page conditions. Method Participants Twenty undergraduate psychology students participated in the study. The participant mean age was 27.3 years (3 males and 17 females). All participants reported having Internet experience. Materials Participants were given a short background questionnaire inquiring about their Internet usage

1201

habits. A Pentium IV-based PC with 96 dpi 17” monitor running at a resolution of 1024 by 768 pixels was used. The monitor was integrated with the Tobii 1750 eye-tracking system running at 50Hz and ClearView™ 2.7.0 software, which was used to detect and collect participant eye-gaze data. Two web pages were chosen from an outdoor equipment e-commerce website, each representing text-based or image-based page content. The textbased page contained information about backpacks, and the image-based page had small images with rendered text of each product category arranged in a grid of five complete rows of images and one partial row. Procedure Participants were seated approximately 60 cm away from a computer monitor. After calibration, the participants were randomly placed in one of the two groups. The first group browsed a text-based page, and searched for a particular category on the imagebased page. The target category for the search was located in the fourth row of images. The second group browsed an image-based page, and searched a text-based page for information about the proper type of backpack for narrow, uneven trails. The second and third paragraphs had the target information. For the last task, both groups of participants searched for a non-existent category on the image-based page. Participants were given 20 seconds to complete each task. Fixations recorded by ClearView™ were defined as a motionless gaze focused on one element lasting 100 milliseconds or longer. For the purposes of this study, average fixation duration is defined as the mean length of time a participant fixates on an AOI and average fixation as the average number of fixations on an AOI. AOIs were defined in ClearView™ around each row of images in the image condition and around each paragraph in the text condition. Results A split-plot ANOVA was conducted on the fixation counts in 6 AOIs designated by image rows of the image-based web page in the search and browse

PROCEEDINGS of the HUMAN FACTORS AND ERGONOMICS SOCIETY 51st ANNUAL MEETING—2007

1202

condition. Five participants were excluded from the original sample because they did not have complete AOI data. Results revealed a significant interaction between the task and the AOI, F(3.072, 39.934) = 8.487, p = .001, η2 = .395. The interaction is shown in Figure 1.

the fixations were more for the first few lines than for subsequent lines. These patterns can be seen in Figure 3. The pattern of fixations in the paragraphs was comparable to the pattern of fixation counts in the search engine study reported by Granka, Joachims, and Gay (2004).

A split-plot ANOVA was performed on the fixation counts in 12 AOIs designated by each paragraph of the text-based web page in the search and browse condition. Results did not reveal a significant interaction between the task and AOI (p > .05).

To confirm this we looked at the individual gaze plots of the participants for both the browse and search tasks. While there were individual differences, gaze plots from the browsing task were more dispersed than the gaze plot from the searching tasks, where it was more concentrated to the upper portion of the webpage. This was due to the fact that the participants searching for the specific information tended to read the text more closely than the participants that were browsing. In some instances, we saw searching having a more dispersed gaze plot than browsing. That could be reflective of the unique strategy the individual used to accomplish the task.

Heatmap analysis confirmed the “F” pattern in both the text-browse and text-search conditions. Even though they both conformed to the pattern stated by Nielsen (2006), there were differences in the patterns of the two task conditions. The text-search condition had more fixation counts in the initial paragraphs than the text-browse condition, but in the subsequent paragraphs the fixations for textbrowse condition was slightly greater. Heatmap analysis also confirmed the absence of the “F” pattern in both the image-search and imagebrowse conditions. It was also absent in the imagesearch condition where the participant was searching for a non-existent category. Heatmaps for all users for the browsing task and the search task are shown in Figures 3 and 4. White searching for the non-existent category, users employed unique and random paths. Interestingly, several participants did not fixate on all of the categories but still concluded that they did not find the target category. Discussion From this study we have replicated what Nielsen (2006) called the "F" pattern of viewing for a textbased webpage. With a few exceptions, we also found the browsing task elicited this same "F" pattern, though it was more dispersed than the search task. Users had more fixations at the beginning of a line than the end of a line, and also

The "F" pattern style of viewing does not seem to hold true while browsing or searching an imagebased webpage. The AOIs revealed a significant difference between the task conditions in the image-based page condition. Participants that were given the image-search condition exhibited significantly lower fixation counts than their imagebrowse counterparts. The increase in the fixation count in the fourth row of images of the search is most likely due to the target category being located in the same row. Figure 1 and Figure 2 show the interaction effect of the task condition and AOI for each page type. Most of the participants’ gaze was on the categories of images that were above the fold as shown in Figure 4. Participants were very efficient at searching for a particular category among the 31 categories of pictures; however, the pattern of search for each participant was unique. The participants fixated on only 8-15 items before the target was identified. The style of viewing while searching for a non-existent category was more uniformly distributed above and below the fold,

PROCEEDINGS of the HUMAN FACTORS AND ERGONOMICS SOCIETY 51st ANNUAL MEETING—2007

unlike in the browse task where categories below the fold did not receive many fixations. These results reinforce the importance of conciseness in the delivery of text on web pages. Since the right hand side of the page and the content below the fold was mostly ignored, pages should be structured so that the important content falls in the "F" pattern and above the fold. Further investigation is needed to see how the viewing pattern changes when the text is divided into columns. For web pages with many images, positioning the important or featured products above the fold is most effective. Further investigation is needed to determine what kind of images draw more fixations and how viewing patterns change for web pages containing both pictures and images. It would also be interesting to investigate how level of Web experience and cultural background influences gaze patterns. References Granka, L., Joachims, T., & Gay, G. (2004). Eyetracking analysis of user behavior in WWW search. In Proceedings of the 27th annual international ACM SIGIR conference on Research and development in information retrieval (pp. 478-479). Sheffield, United Kingdom: ACM Press. Nielsen, J. (2006). F-Shaped Pattern for Reading Web Content. Retrieved January 18, 2007, from http://www.useit.com/alertbox/reading_patt ern.html Rayner, K. (1998). Eye movements in reading and information processing: 20 years of research. Psychological Bulletin, 124, 372422.

1203

PROCEEDINGS of the HUMAN FACTORS AND ERGONOMICS SOCIETY 51st ANNUAL MEETING—2007

1204