Blog Where UX, CRO and design meet machine learning & neuroscience.

Does the famous F-shape pattern in eye tracking really exist? [Data]

Posted by Kurtis Morrison on Sep 06, 2017

In 2006, Nielsen Norman published some fascinating research on how people scan and read websites. They announced that their study showed users tend to view web pages in a kind of "F-Pattern", and shared 3 examples of heat maps containing a distinct F-shape:

Screen Shot 2017-09-04 at 16.46.17.png

The study's conclusion has been shared by several influential blogs over the years, and a huge number of designers and marketers have incorporated this insight into the way they work.

However, here at EyeQuant, we've done an extensive amount of quantitative analysis of eye tracking data, and we've yet to find any evidence that this bias towards an F-Shape exists at all.

For example, we analyzed one of our past eye tracking studies that included 99 websites spanning several different categories. Each one was viewed by 46 participants who were given realistic tasks for each website. On an eCommerce site they might be asked to research a particular kind of product, while on a hotel website they might be asked to book a room, etc.

We specifically tracked how users scanned the page when they first arrived on each website, and recorded 157,498 "scan-phase" fixationsWhat did we find?

Here's a heat map representation of the location bias we observed:

Screen Shot 2017-08-29 at 14.13.05

As you can see, users do exhibit a bias towards certain parts of the screen, but that bias does not necessarily look like an F (or any other letter). It's simply a blob. The bias we observed was mostly towards the middle of the screen, and slightly to the left. Empirically, this appears to be the best place for you to put priority content (i.e. your 3 Ws).

In fact, out of those 99 websites, we didn't find any individual heat maps that closely resembled an F. Here are some examples of the heat maps we did see: 

Screen Shot 2017-09-05 at 17.19.46.pngA sample of fixation-volume heat maps for different pages in the study (46 participants).

Of course, that doesn't mean that such examples don't exist, and we don't have any proof that it wouldn't emerge over a longer viewing time, as we only studied where people looked in the first 15 sec (+/- 6 sec) on average.

But this data does suggest that you probably shouldn't rely on the F-Shape as a golden rule when designing websites. In fact, looking at the heat maps above, it's clear that there is no "golden rule" for layouts that you can confidently apply to any design. There are simply too many other factors that influence eye movementsHere at EyeQuant, we use machine learning to figure out what those factors really are. If you're interested, you can learn more about our research here.

--
Do you want to improve the visual hierarchy of your website? Check out our eBook on content prioritization with the 3 Ws, a simple framework for effective visual hierarchy:

New Call-to-action

Comments