Eye tracking and your website

Status
Not open for further replies.

emp

New member
Jun 29, 2006
7,465
211
0
Well, this article at useit has made the rounds around the internet lately.

What I want to do here is go into some advanced discussion about the backgrounds and uses of it for your website and the ads that make money on it.

Almost everyone knows this picture from the google AdSense help pages:
placement.gif


And although it is nice to know (and the heatmap is right) where ads click the best, you might want to look more into depth on ad positioning, especially in the area that is called "primary content" by google.

Enter the "F shaped reading pattern" from the useit article.

f_reading_pattern_eyetracking.jpg


Althought there is some correlation between the google help and the useit heatmap, we'll go into more detail.

Why does this pattern look like it does?

Reading from left to right
A big factor in this image is the typical western left-to-right, top-to-bottom reading pattern.

Learned page navigation
People are used to left-hand navigation. Scanning the menu for more information comes naturally. That's where that heatspot comes from.
Where does the F come from?
When scanning a site, people look for clues as to the main points of the content to find out if it has the content THEY are looking for. This is a matter of seconds, in which the reader determines if this page is right for him or not.
These are the main sources of quick information:
  • Headings - of course, looking at article headers and subheaders
  • Images - This comes to play especially at product pages, although it might be of utter importance in the media and adult sector
  • Bulleted lists and bold text
These clues explain a lot of the results as we can see in this altered image:
Feyetracking.jpg


So... what do I do now?

Actually, the course of action is pretty clear.
Following the google heatmap, and the article's advice about writing content.

But now you can do more:
  • Use headings and subheadings on your site.
  • Use bulleted lists.
  • Place the ads in close vicinity to paragraph headers and bulleted lists.
  • Small, rectangular text - link - blocks seem to beg to be placed right under or above a heading.
  • A vertical ad format might be nicely used next to a bullet list.
Hope you liked this article.

::emp::
 
Last edited by a moderator:
  • Like
Reactions: Jan, Mike and Jon


Status
Not open for further replies.