homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

New Research: text, not photos, grab readers attention first
New eyetrack research
Purple Martin

 12:14 am on Dec 3, 2004 (gmt 0)

New eyetrack research shows that text, not photos, grab readers attention first online; that people do people do typically look beyond the first screen; and horizontal navigation is more effective than vertical navigation. The Eyetrack III research was released by The Poynter Institute, the Estlow Center for Journalism & New Media, and Eyetools today.




 3:12 am on Dec 3, 2004 (gmt 0)

That is quite a thorough study - thanks.

Headlines and type size
Smaller type encourages reading the words more closely, while larger type promotes lighter scanning. Testing found that people spent more time focused on small type than large type.
On sites that use headlines and blurbs (as 22 out of 25 tested news sites do), people tended to view the headlines and skip the blurbs when the headline is larger than the blurb and on a separate line.
Underlined headlines discouraged testers from viewing blurbs underneath.

That first result surprised me. Then I clicked through and read the fuller details of the study: [poynterextra.org...]

It began to make sense to me at that point. Two of the "Tips" for this portion of the study summed it up nicely:

Is the intent with your website's homepage to encourage scanning or to encourage concentrated viewing? If you want your readers to fix their eyes on the homepage for longer, you might want to use smaller type in headlines and blurb copy. If you want to encourage scanning behavior, larger headlines may help.
If your desire is to have website readers examine all or most of the type on your homepage, you may want to keep headline size and blurb size comparable.

I note also that the study was focused on the Home Page - however, I think the results would probably extend well to any landing page.


 11:36 pm on Dec 4, 2004 (gmt 0)

As I take the time to read the various facets of this study, I find I am impressed more and more. One thing jumped out at me. I've know for a while that short paragraphs/text blocks are easer to read than longer. It's nearly an axiom of how to set type on a web page.

What I didn't realize was how MUCH of a difference it makes. I will be less and less tenpted to use hearty sized paragraphs now that I realize how important this is.

By examining the number and duration of eye fixations on these paragraphs, we were able to discern how much of the stories containing each of these paragraph lengths was read. The bottom line is that stories with shorter paragraphs got more than twice as many overall eye fixations than those with longer paragraphs.

Full Reference on PoynterExtra.com [poynterextra.org]


 11:53 pm on Dec 4, 2004 (gmt 0)

Fascinating study. Everyone developing web sites should read it.

It shows what makes people stick around and read a web page, but in the flip side, it also shows why and where people leave the page (very important for a certain type of sites).


 9:00 pm on Dec 6, 2004 (gmt 0)

On sites that use headlines and blurbs (as 22 out of 25 tested news sites do), people tended to view the headlines and skip the blurbs when the headline is larger than the blurb and on a separate line.

That one stymies me a bit. I thought the purpose of a headline was to help people decide whether they care about the topic or not. And yet, I usually use the same type size, but bold and perhaps a different color, for heads and subheads.

Makes me wonder whether I should try upping the size also, as a help to the visitor. I have no interest in getting people to read what they don't care about. What would that be, typographic spam?


 9:44 pm on Dec 6, 2004 (gmt 0)

I'm surprised this study finds its way to WebmasterWorld now - it's long overdue (not that it's not still current or anything, but it has been published for a few weeks at least)

>> larger headlines

Tedster, underline that headline if you want people to skip the blurb. Or - if that's what you want - why even have the blurb there?

We had Steve Outing give us a presentation of the findings at the place i spend most of my time at the moment. He recommended that around 15 words or so for a blurb would be a nice size - ie. it facilitates some reading, and also scanning. 15 words is really not much though - it takes some talent ;)

The thing is - even with blurbs, people scan. Look at the heatmaps - notice how the hottest parts are at the far left: People scan the first few words, they don't really read like you would think they do.

In fact, he showed a fascinating video recording of real eyetracking. You could see the movement of the eyes of the test person on the screen as blue animated lines. Those eyes kept jumping all round the screen so fast that you had a real hard time even following the trace.

I've heard Jacob Nielsen say that people scan, and i've seen user tests and conducted a lot of research myself, so of course i knew all about that, but to see the speed of it was amazing - people scan much much faster that you would ever imagine, and the eyes are all over the screen all the time.

Unless they see something that attract their attention, they've been literally all over the page in one-two seconds flat (!) Except for whatever "looks like ads" (ie. graphical banners) - the eyes don't even get close to that stuff.

>> Text, not photos

Close read, please. Photos featuring eyes, celebrities, bodies (with head) - closely cropped, crisp-clear images - will get attention. But no clicks.

Banner like pictures are plainly ignored, even when they're as big as the one with the two guys here: [poynterextra.org...]

(the faces and eyes get some attention though, but the image text is never read:

Found the vids: [poynterextra.org...]


 12:17 am on Dec 7, 2004 (gmt 0)


This is really great stuff and thanks for posting the information and links.


 12:35 am on Dec 7, 2004 (gmt 0)

People scan the first few words, they don't really read like you would think they do.

I usually assume that I have only the first few words - the first "eye grab" if you will - to capture attention or communicate a topic. And some people take in more words at once than others, who may even read one word or even one syllable at a time. I essentially guessed this principle, mostly through observing my own habits and by playing around with PPC ads.

It's amazing what difference a first word makes. Back in 2000, I posted this, and it has held up for me as time goes by:

These are my ace in the hole. You know what most descriptions, heck most COPY, reads like. It's corporate speak, dry as dust, no spark at all. When you want eyeballs, you can't imitate the crowd. You got to have FLAVAH! Some flash, some style.

I've found that using one unique word at the beginning of your description pulls in the clicks. The word should be commonly known, short, but not bled dry by overuse.

Good "flavah words" will vary with the topic of the site, but most of all they should be just a little unexpected. Some examples I've had success in descriptions this year are: "Elegant" "Savvy" "Spunky"

Words that have the less frequently used letters in them (V-K-J-X-Q-Z) are also good at jumping off the monitor.


If the overall shape of the letters resembles an off-color word, that helps too. For instance, depending what font the word "flick" is displayed in, it can be very adult! Words ending in "...uck" all seem to be eye-magnets.

original thread [webmasterworld.com]

[edited by: tedster at 3:47 am (utc) on Dec. 7, 2004]


 3:22 am on Dec 7, 2004 (gmt 0)

How fast people's eyeballs move over a page onscreen is not totally useless knowledge but nearly so.
At least for gleaning good methods of communication, I mean.
First, there's a big difference between what a test subject is going to do when told he or she has to read a page and what a real user is going to do.
The idea that a user is going to take more time reading text set in small type than in larger type is one of the funniest "findings" I've heard of in a long time. Of course, you take longer to read it - it's harder to read smaller type and I'm being paid to sit there and read it!
I need a study to tell me this?

Also, did they test for reader comprehension? Do we have any idea what these test user's remembered about what they read?

Hey, I can go on and on about this but Tedster is onto something with his "flavah" words.
I'm an old codger in Internet years (just turned 51) and take it from me, boys (and webmaster gals), everything you want to know about effective type, layout, and you-name-it has already been figured out many years ago by those who founded our modern advertising industry.
Do yourself a flavah and get thee to a good a bookstore and browse through "Ogilvy On Advertising" and forget this thing.
Yes, some adjustments need to be made for the difference between print and screen but not as much as you might think.

The principles of effective communication have been well-established for many years.

As I once explained it to a manager of mine: Do you think it's an accident that all major newspapers and newsmagazines publish in columns with a serif typeface at about 11 or 12 points with 35 - 40 characters per line? Do you think they just like the way it looks or do you think maybe they've spent millions testing to confirm that it's the best way, seeing as how it's their business to know?

(Upon reflection, this last paragraph kind of explains why I now work for myself. But the advice still stands.)


 11:49 am on Dec 7, 2004 (gmt 0)

>> Flavah
That was really well put. It sums up the whole idea of writing efficient [edit: should have been effective, as you can do all this and it's still not efficient, ie. converting] short copy, i'd say. And it has to be short too, or at least broken down in small paragraphs.

It should be easy reading as well. Regarding the Nielsen Norman Group study "Web Usability 2004", Jakob Nielsen said at the seminar that "On the front page, write for the reading level of the forth grade. At inner pages write for a sixth grade reading level." (from notes, not verbatim)

>> Words ending in "...uck"

There are two good examples in the eyetrack study - first is the clothing brand FCUK, second is the word sex used in a headline somewhere.

>> Of course, you take longer to read it - it's harder to read smaller type

Exactly. That's the right interpretation. It takes longer time to get the same amount of information out of text when it's in smaller type. Some people will see this as a benefit, others will see it as the opposite.

>> Also, did they test for reader comprehension?

Yes they did - they asked the test persons questions on a range of subjects mentioned on the pages. It's all published on the web, the study takes several hours to read in full.

>> The principles of effective communication have been well-established for many years.

Let's just say that they've been developing for some centuries [edit: millenia, even], and will continue to do so. This study is not about how well you get your message across, although it also has some good findings on that. It's mostly about users, and their use of pages with different layouts.

It does not regard what goes on inside the test persons brain, it merely records what actions the user takes, through observations of eye movements and use of interface (eg. mouse).

It's true that if you have a solid background in Advertising you will recognize most of these observations. Also if you have a solid background in the Arts (writing, movies, painting, drawing, etc.) To me, that validates this study as it confirms things some of us have known for a while.

Still, there's new knowledge as well. For some, a lot will be new, for others... well, the devil is in the details they say ;)


 9:02 pm on Dec 7, 2004 (gmt 0)

It does not regard what goes on inside the test persons brain, it merely records what actions the user takes

That's one reason why I value this study so much. Subjective reports are notoriously inaccurate - people don't really report exactly what they do, for a number of reasons.

I've seen usability studies that ask for subjective impressions - whether the test subject thought a page in a certain font was easy to read, or fast to read, etc - and often the test results show that their actual reading times and comprehension levels did not line up with their perceptions as they related them.

But here we have the "heat map" that shows us what happened. The data can be extended through future studies.

We probably all remember the famous 3-click rule for website structure. It was not a test result - just a widely accepted rule-of-thumb that turned out not to be true in recent testing.

Hats off to the folks who do serious user research like this. It would bore me greatly to be in that business day-to-day, but I love the results.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved