Link: Welcome to Eyetools.
Found this company in a MarketingSherpa case study. They bring people into their lab and ask them to look at
web pages while an eye tracking camera maps how they look at various
web pages.
While it is hard to generalize what they have found, there are some general rules of thumb for designers:
- While it’s generally true that people read from the top left,
how they read from there varies depending on the page’s graphic
elements. They used the analogy of a feather in the wind, if the
feather were to always start at the top left. The feather moves
depending on the wind and the eye follows; on a web page the "wind" is
the graphic layout. - White space is good for the eyes, and makes it easy to
organize what they are seeing, but if you have a white "line" across
the entire screen (in other words you can read from the left edge all
the way to the right and not be interrupted) then you have what they
call a "scroll inhibitor." Basically the eye thinks the page is "over"
and you won’t scroll down below it. - If you have a list of things to display more of the list
will be seen if you put it in a single column. If you break it into
two or three columns users will generally "see" less. - Images like small graphics or icons will draw the eye to the
information next to it. This is a great way to make sure someone reads
what you want them to. Pictures of peoples’ faces also work well, but
they tend to hog the attention so the information next to them might
not be seen.
Pretty useful stuff.
Found this company in a MarketingSherpa case study. They bring people into their lab and ask them to look at web pages while an eye tracking camera maps how they look at various web pages.
While it is hard to generalize what they have found, there are some general rules of thumb for designers:
- While it’s generally true that people read from the top left, how they read from there varies depending on the page’s graphic elements. They used the analogy of a feather in the wind, if the feather were to always start at the top left. The feather moves depending on the wind and the eye follows; on a web page the "wind" is the graphic layout.
- White space is good for the eyes, and makes it easy to organize what they are seeing, but if you have a white "line" across the entire screen (in other words you can read from the left edge all the way to the right and not be interrupted) then you have what they call a "scroll inhibitor." Basically the eye thinks the page is "over" and you won’t scroll down below it.
- If you have a list of things to display more of the list will be seen if you put it in a single column. If you break it into two or three columns users will generally "see" less.
- Images like small graphics or icons will draw the eye to the information next to it. This is a great way to make sure someone reads what you want them to. Pictures of peoples’ faces also work well, but they tend to hog the attention so the information next to them might not be seen.
Pretty useful stuff.
Discover more from Befuddled
Subscribe to get the latest posts sent to your email.