Eye Tracking Study of Image-Rich Web Pages

Eye Tracking Study of Image-Rich Web Pages


The latest issue of Usability News from the Software Usability and Research Lab (SURL), has a very interesting study – “Eye Gaze Patterns while Searching vs. Browsing a Website” – on web users’ eye gaze patterns while browsing and searching web sites. Findings from the study show that the ‘F’ pattern as described by Jakob Nielson does not hold true for some kinds of web sites.

Results show that users follow a fairly uniform scan path when browsing through pictures, and a more random path while specifically searching through them.

In fact, not only does the study suggest that users’ viewing patterns depend on the nature of the web page (text-rich versus image-rich) but also by the users’ tasks (browsing versus searching).

Summary of Study and Findings

The study involved twenty participants that were asked to perform three tasks – searching for a product category, browsing product categories, and searching for a non-existent item – on the two pages on the Coleman web site.

Test Pages from Coleman Web Site

The pages used for this study.

Gaze Patterns while Browsing an Image-Rich Page

Unlike the ‘F’ pattern, the findings from this research suggests that users tended to spread their visual attentions uniformly over the image-rich test page. Test subjects tended to be drawn to the product images equally across the visible page. One thing that did seem to hold true was that users focused significantly less on content that was below the fold and required scrolling.

Browsing Heat Map

A sample heat map from the study showing browing patterns of the image-rich test page.

Gaze Patterns while Searching on an Image-Rich Page

A more surprising outcome centered around users’ viewing patterns when searching for an image corresponding to a target product category. Users seemed to instantaneously identify the correct category image. Consequently, the gaze heat-map showed a very defined hotspot on the category image.

Heat Map of Searching

A sample heat map from the study showing browing patterns of the image-rich test page.

When test participants were asked to find a non-existent category image, their viewing patterns tended toward those associated with browsing. In fact, the gaze pattern heat map suggests that their visual attention was even more broadly and uniformly spread out over the page.

Heat Map of Searching for Non-Existent Image

A sample heat map from the study showing viewing patterns while searching for non-existent image.

Designers Beware

Eye tracking has been all the rage over the past couple of years and while this practice can help us gain some insight, the latest study from SURL highlights the dangerous pitfalls from taking as natural law the findings from these limited and sometimes poorly designed studies. Eye tracking studies such as performed by Nielson and by the Poynter Institute produce results that are ONLY true for the test subjects and test conditions of those studies. Their findings DO NOT unequivocally translate to any web page beyond those specific ones in the studies.

The conclusions drawn from these studies by their authors or readers are often too absolute and sweeping. While they can help usability engineers and interaction designers gain some insight into users interactions, they hold little or no predictive power across any other web pages that were not included in the study. For example, it would be foolish to think that the ‘F’ viewing pattern holds for the Google home page.

Nielson himself stresses that the ‘F’ pattern is a rough viewing pattern that does not apply to all kinds of web pages and tasks. The fact that the study included 232 users only makes it statistically significant for the particular tasks and web pages in the study and for nothing else. To draw an analogy, if we conducted an eye tracking study with 500 users of the Google home page and found that users view it in a ‘G’ pattern, we could not apply those results to Amazon or Netflix and expect that users of those web sites will follow similar viewing patterns.

How users view a web page depends on a number of factors that are unique for every web page, and how users will browse or search entities on those pages is also unique. If we do not have the luxury of conducting an eye-tracking study on our own pages, we can also turn to more accessible solutions like analytics software such as Google Analytics, click pattern software such as Clickdensity, and mousing pattern software such as ClickTale. Beyond those, there are numerous other ways that we can gain insight into users’ interaction patterns with the web pages that we create, and if all else fails there is always our hard-earned intuition and common sense.


About the Author

Leave a Reply