I found really fascinating this eyetracking heatmap form one of the latest Jakob Nielsen's Alertbox articles.
![]()
The areas where users looked the most are colored red; the yellow areas indicate fewer views, followed by the least-viewed blue areas. Gray areas didn't attract any fixations.
As argued by Nielsen, the dominant reading behavior follows an F shape: a first horizontal movement, a second horizontal movement a bit below, and a vertical scan on the left, and it is quite consistent over several different types of web pages and tasks.
It's incredibly fascinating to see how visualization can help in tracking and then displaying human behaviors in a way that makes emergent patterns readily visible. There is a growing interest and focus on collecting bits of human information and given them a visual counterpart ready for analysis. Other examples have been posted in this blog before.
The key factor of this kind of visualizations is the fact that visualization permits to see the evolution of things summed up in aggregate visual information. Frequency is often the key parameter that is used to visualize behavior: frequency of road paths, visual glimpses, airplane trajectories, etc. Alternatively, the visualization can be used to replay things at a different rate and thus to expose dynamic behaviors that couldn't be detected at a human pace.
It's a notable fact that replaying things at a different rate permits to see some patterns that would not be apparent otherwise. The image that comes into my mind is the typical video of a flower's entire life replayed in a few minutes (see this wonderful Amaryllis). Or a sequence of pictures taken always from the same position over an extended period of time. A more elaborated idea is Alan's Slow Time: if we could replay our life and use band-pass filters to select things that routinely happen at very low frequencies (e.g., every day, month, year) we could notice interesting recurring patterns of ourselves. Notably, finding your keys!:
Take the home. Band pass in the millihertz range. Start off by removing the things faster than millihertz - to and from movements of people disappear and we are left with the things that change only slowly - rather like a series of long exposure night-time frames, the hurrying people become ghostly mist against the background. Now remove the things that do not change in the millihertz range, things that are the same for hours and days. Watch the resulting images, just the moments of millihertz change - the things put down and picked up, or perhaps put down and never picked up - "that's where I left my keys!"
It would be great to see one day this idea realized in a real prototype.
Comments (4)
I have actually written an analysis of the F-Pattern. Sure, it is more geared towards the interests of internet marketers, but you might want to take a look.
http://www.wickedfire.com/affiliate-marketing/1651-eye-tracking-your-website.html
Seeing visualizations like this sometimes leads to mis-conclusions, or the jumping at "there is an F reading pattern" where there is none.
As I see it, the proposed F pattern really is an effect of the left - to right reading pattern in western cultures and visual cues on the site itself (headlines, pictures, etc..)
Regards
Posted by emp | August 28, 2007 11:09 PM
Posted on August 28, 2007 23:09
Hi, thank you very much for pointing me to this.
I read your analysis of the F-shaped pattern and I agree with all the things you say.
I also share with you, at least in principle, the idea that some visualizations can lead to mis-conclusions. However, from you article I don't understand where the mis-conclusion is.
One possibility I see is that we are confusing the effect with the cause. That is: is the F-shaped pattern a consequence of our way of designing web pages or it would exist in any case? Maybe this was your point?
By the way, on a more general level, the problem of mis-conception in visualization is never recognized and stressed enough. It's very easy to lie or fool somebody with visualization. And what is even worse is that people sometimes do it without purpose!
Posted by Enrico Bertini | August 30, 2007 2:58 PM
Posted on August 30, 2007 14:58
I did not mean to imply a malignant intent behind the article.
I was actually disappointed at the jump to the proposal of an F-shaped reading pattern, when half of their own examples did not even remotely look like an F.
The cause-effect , as I see it, would be with left to right reading and left to right alignment of the text, interspersed with headlines.
To propose an experiment:
- How does the reading patterns look with right-aligned text?
- How does the reading pattern look without boldening of the healines?
- How does the reading pattern look with centered text?
etc..
The mis-conclusion was not really IN the visualisation, rather in the interpretation of it.
regards,
::emp::
Posted by emp | August 30, 2007 3:55 PM
Posted on August 30, 2007 15:55
In response to emp's comment...
I think that using only F-shaped pages in the experiment would actually bias the results. What they're proposing is that the F-shaped pattern exists independently of the individual site's design, and that a successful site will adhere to that pattern. I don't think they were proposing that sites should try to 'cause' readers to follow it, since they're treating the pattern itself as an existing phenomemon.
Posted by MC | January 29, 2009 4:00 AM
Posted on January 29, 2009 04:00