Eye tracking study reveals 12 website tactics
Eye tracking studies have revealed valuable information about how people read and interact with websites. One study, Eyetrack III, published a summary of their eye tracking results for news sites.
While this is just one eye tracking study focused on a particular type of site, I think there are instructive nuggets here for any informational website.
In no particular order, here are 12 results I found particularly interesting.
1.Headlines draw eyes before pictures. This might be surprising for some people since the trend has been to add photos and graphics specifically to draw the eye. Even I have been adding more photos to my blog to spice it up a bit.
But the participants in this study looked at headlines, especially in the upper left of the page, before they looked at photos when they landed on a page. So you can’t rely on eye candy to make up for poor headlines.
2. People scan the first couple words of a headline. Yes, long headlines can work. But this study suggests that people scan the first few words before deciding whether to continue reading.
This means you should front-load your headlines with the most interesting and provocative words. It’s also an argument for getting your keywords up front in headlines.
3. People scan the left side of a list of headlines. This is related to the previous point. When presented with a list of headlines or links, people will scan down the left side, looking at the first couple words, to find something they’re interested in. They don’t necessarily read each line beginning to end.
The implication is the same as before. Get your most mind catching words up front.
4. Your headline must grab attention in less than 1 second. Online readers are grazers. They move fast and nibble. If you want to hook them into spending time reading about something, you have to catch their attention very, very fast.
No nonsense. No meandering copy. No “throat clearing” to fill space. You have to get to the point instantly.
5. Smaller type promotes closer reading. This makes sense because smaller type is harder to read. So, to read it, you have to really focus. Larger type promotes scanning rather than reading.
Be careful with this one. No one is suggesting you shrink your web type to make it barely legible. I think the takeaway is to avoid making your type too big if you want close reading and avoid making it too small if you want to communicate rapidly.
6. Navigation at the top of the page works best. I find this interesting from a design point of view since many sites now use side navigation. I take this one with grain of salt, since the study also shows that side navigation can work fine.
The point may be that anything at the top of a page will be seen immediately. And since top navigation must be simple because of space limits, top navigation is probably much simpler to use.
7. Short paragraphs encourage reading. No surprise here. Even in print this is true. Big blocks of type look imposing and difficult, like reading a Faulkner novel where a paragraph goes on seemingly forever.
In online writing as in most ad writing, you have to forget normal paragraph development. Breaks should be logical, but they’re organized into a flow of ideas rather than distinct paragraphs.
8. Introductory paragraphs enjoy high readership. Just to be clear, an intro paragraph is a content summary that appears after the headline and before the main text. It’s common in some news writing. I’ve also used it in print ads which are designed in the form of an article, often called an “advertorial.”
The downside is that while intros get read, this study says they don’t affect readership of the main text. Maybe they help improve comprehension. The study doesn’t say.
9. Ad placement in the top and left positions works best. For anyone familiar with “heat maps,” this make sense. The eye tends to start in the upper left of a page. So an ad, or anything else, in that area will be noticed.
This is another one you have to be wary of. Ad blindness tends to happen when people get used to seeing ads in a particular place. So even the prime upper left area won’t work so well if you always put ads there.
10. People notice ads placed close to popular content. Obviously. This mimics the well-known idea in the offline world where ads are placed anywhere eyeballs point.
This is why ads right over a urinal work. Men look straight ahead, usually at a blank wall 12 inches from their face when standing at a urinal, so any reading material there will get read.
11. People read text ads more than graphic ads. Not everyone will agree with this one. But it makes sense if you consider that information is usually in the form of text. So people looking for information are looking for text, not pictures.
However, graphics can be useful for conveying information that is difficult to communicate in pure text, such as how something looks, mathematical information, before and after comparisons, etc. Which leads us to the last tactic.
12. Multimedia works better than text for unfamiliar or conceptual information. Reading relies on people having some understanding of the subject. The more familiar they are with the subject, the faster and easier reading is.
If you’re trying to describe a process, for example, a video or illustration conveys this information better than text.
Comments
110 Responses to “Eye tracking study reveals 12 website tactics”
Leave a Reply
| FREE Newsletter |
| Get my monthly newsletter and a FREE 16-page Report: 99 Easy Ways to Boost Your Direct Mail Response! |
|
Past issues and more info. Your privacy is guaranteed. |
RSS
Email
Twitter
LinkedInFREE Facebook Marketing Guide
Discover the secrets of promoting a product, service, or brand with this free 26-page guide.
-
Recently Written
- 7 Powerful Tactics to Increase Your Sales Letter Response
- 12 fast direct mail tests for cheapskates
- The Importance of Being Trivial
- Getting to “yes”: 4 keys for instant credibility
- Getting to “yes”: the magic rule of authority
- Mastering the almighty advertorial space ad
- 3 little hints for effective limited-time offers
- 9 editing tactics to supercharge your selling copy
- 10+ tips for making the most of your customer testimonials
- The Cedar Plank Salmon Secret of Selling
-
Categories
Great ideas and summaries. What priority will my comment have in readers’ eyes?!
This is brilliant information! Really great tips for improving your sites conversion immediately. I am especially interested in the navigation accross the top part. I am keen to run some heat map tests with this split tested.
really great tips – keep ‘em comming
could be interesting combined with the A/B-testing from GoogleWebsiteOptimizer
Fantastic.
I think this proves to a large degree that the Books “Scientific Advertising” and Caples “Tested Advertising Methods” is still highly relevant even though they were written in a different age.
I’d be interested to know what happens in Countries where the reading is primarily right to left rather than left to right.
keep up the good work. Great Article
Mark:
That’s an interesting question. In the West, we read left to right so anything upper left on a computer screen is usually seen first.
I’ve seen Arabic sites where the type runs right to left, so I’d guess items that are upper right are probably seen first.
PR people read up! I was reading press releases today and noticed myself many of the points you so clearly articulated before I read your article!
When pitching a journalist via email be aware that they are only reading subject lines. The first few words better be good!
Thanks for the article!
This is a very refreshing informative post, thank you! I have to admit I like #7 the best because everyone gives me such a hard time for my typically short posts.
[...] Since I wrote the above, I came across a little something on the topic that is too good not to include! Thank you Vicki Berry! Share and [...]
[...] minutes out of your day and read over the latest findings from Eyetrack III (via ProBlogger and the Direct Creative Blog). Their research could give your team a better idea of where to start and what to fix when it comes [...]
[...] If you’ve got a spare 10 minutes today check out Eyetrack III who have published some great findings in their latest eye tracking studies of news and multimedia content sites (found via Direct Creative Blog). [...]
[...] If you’ve got a spare 10 minutes today check out Eyetrack III who have published some great findings in their latest eye tracking studies of news and multimedia content sites (found via Direct Creative Blog). [...]
[...] Via Direct Creative Blog. [...]
[...] http://www.directcreative.com/blog/eye-tracking-websites [...]
I’m planning on changing the layout of my blog and this post really helped make up my mind as to what template to choose.
Keep up the good work!
@Mark & Dean:
I cannot give you reference to paper which covers it. But I remember from my work for IBiB PAN, that kids learned Hebrew as a first language had better reading skills in Hebrew and their eyes preferred reading from right to left.
Eye takes picture of text and brain need to guess what was read. The way we learn to read determines how efficient brain will be in way of reading.
Chinese with his top-down reading direction was the best solution. Three eyes muscles works best top-down, reading is counter-evolution
.
There is massive amount of literature about it, few names:
.
- Allusi
- Fitts
- Bahrick
- Briggs
- and my tutor Ober
Can you forward this to my boss?
Patryk:
Your information confirms that in reading it’s largely about what you’re used to. There’s nothing magic about left to right. I suppose if you started out reading in any direction, it would work.
And about the eye taking a picture, that’s correct. Once you know how to read, you don’t look at each letter or word individually, you take in whole phrases. The brain perceives words by their shape.
Here’s some basic info on that:
http://www.directcreative.com/a-primer-on-reading-legibility-and-effective-advertising-design.html
wow….. very interesting article.
thanks a lot
I find this sort of thing very interesting. I think the points here should always be taken into consideration but shouldn’t dominate a website if it effects the overall design or plan.
[...] Check out the original article here. [...]
[...] y mejor a la hora de diseñar un sitio, hoy en deliciuos apareció en portada un articulo de Direct creative que digiere la información que se obtuvo en un estudio de eyetrack y nos la brinda en 12 puntos [...]
Very useful summary for those who does not have a chance to read the full paper. Thank you.
Matt:
I’d have to disagree. All of these points are about making your site work. Design is irrelevant if your site doesn’t work. Form follows function.
None of this is new, though it is kind of nice to have it all hashed into one article.
That said, the “F Rule” should be in here, and seems to be causing a lot of confusion.
For more in-depth looks at all of the points made in the article, Jakob Nielsen probably has the best site available on the topic: http://www.useit.com/
That’s where I learned all this stuff anyway. His newsletter is invaluable. Thanks for putting this article together!
[...] If you’ve got a spare 10 minutes today check out Eyetrack III who have published some great findings in their latest eye tracking studies of news and multimedia content sites (found via Direct Creative Blog). [...]
[...] Eye tracking study reveals 12 website tactics Cool eye tracking study results (tags: design analysis webdesign copy web reference marketing) [...]
[...] Eye tracking study reveals 12 website tactics (tags: usability webdesign) [...]
[...] In this phase you will take your keyword phrase and then write some content to address the needs, questions, or concerns that searchers might have when they are searching for this particular phrase. The search engines are not your primary concern at this point. You don’t even need a website to complete phase one and two. You goal is to take the keyword phrase that you’ve found and then address the concerns of your web visitor with content on your website. If you write for poeple first and not the search engines you will likely avoid getting into trouble with the search engines. Here is an article that gives you a few tips on laying out your content for people [...]
[...] Eye tracking study reveals 12 website tactics — 4:13am via [...]
Thanks for your great post.
A very generic study i left. If you are going after audience who matters, I think it is best to analyse your own audience.
Such studies are only good to a certain extent. Eventually, I think you should work closely with your own reader to improve the site.
Sean:
Analyzing your own audience is a smart thing to do. But this study and the conclusions would still apply to any website regardless of your audience.
One interesting thing to note about the headline scanning – our eye tracking study definitely supports this (http://www.enquiroresearch.com/newsforce-index-page.aspx scroll to the bottom link to download the full ppt) – BUT! what we found is that once someone has already read the headline on the index and clicks it, they almost never read it again on the article page itself. Isn’t that weird?
Dana Todd, CMO
Newsforce Network
I just discovered this article through Delicious bookmarking. Bookmarking is new for our seo service we offer and I see its value.
To find a copywriting eyetracking article with this detail was a gift. It confirms a number of consulting tips we offer our business clients when they build their web pages….build from the left out with emphasis on keyword copywriting being on the first few words a user will read.
Excellent.
Gabriel D.
CEO
[...] a visual map of home page priority zones… and a very good summary of the [...]
I looked this eye tracking study on other pages too.
These are really good thoughts. This something which we keep debating day-in day-out. But I think this pattern would change between different user groups. Help if there is any analysis available over the net.
I agree, headlines draws attention in the first impression. If you have an uninteresting headlines, visitors will just leave your site without even spending a few more seconds to explore you site.
[...] Eye tracking study reveals 12 website tactics (tags: usability) [...]
I agree with all above mentioned facts but also have to say that most of this stuff is common sense in my opinion. Still, great post….
[...] Eye tracking study reveals 12 website tactics [...]
That is very interesting. I always spend a lot of time on my headings. It is nice to know it is not a total waste with these findings.
.-= James’s last blog … Your Source for Vinyl Safety Skirts =-.
James,
I too spend a lot of time on my headers. You have to remember that this is one of the first things your visitor see’s not to mention the SEO benefits of having it properly setup.
.-= Ryan Crusher’s last blog … Light Bulb Crusher Machine =-.
Did anyone else notice that this data was from 2004?
[...] http://www.directcreative.com/blog/eye-tracking-websites - eye tracking and how to apply it [...]
This post was very helpful for me. I’ll impliment these advises in my marketing blog. Thanks
Ivan Golemdzhiyski aka “Web Traffic Guy”
.-= Ivan Golemdzhiyski’s last blog … Free Cloak and Dagger Affiliate Secrets Report – Cloak your links – how and why =-.
great post, This is a great evolution from the ‘f shaped reading pattern’ conversational often brought about in web design.
.-= chicago web design’s last blog … The Future of Mobile Apps: Flash CS5 =-.
[...] all the results if you can afford the time. Otherwise here’s an excellent article – Eye tracking study reveals 12 website tactics by Direct Creative Blog which summarizes everything into 12 points which you can take immediate [...]
Great read. Smaller text encouraging closer reading is an especially good call, never thought of that.
[...] 11 Striking Findings From an Eye Tracking Study February 28, 2010 Leave a comment Go to comments If you’ve got a spare 10 minutes today check out Eyetrack III who have published some great findings in their latest eye tracking studies of news and multimedia content sites (found via Direct Creative Blog). [...]
[...] on select groups of people using eye-tracking have given broad generalizations (read the before-mentioned link for more details): 1.Headlines [...]
[...] on select groups of people using eye-tracking have given broad generalizations (read the before-mentioned link for more details): 1.Headlines [...]
[...] Eye tracking study reveals 12 website tactics – Eye tracking study and 12 tips. [...]
I definitely agree that this is an interesting study that does provide some fascinating insights.
However, I too wondered about the sample that was pulled for this research as I think inviting individuals of other nationalities to participate might make a difference in the location of “hot spots” and areas of preference for critical content.
As the western world reads from left to right, it’s no surprise that our attention begins at the top left. If one were to invite someone from a country the reads right to left, I wonder how different the results would be…
Thanks for sharing such great information!
.-= Aliera’s last blog … Driving Change or Adding to the Noise? =-.
@Trontastic Well, yea, that’s true! So, Dean, will you have the same results today? Have the users changed their behaviour today?
One more question about #10. I didn’t quite get what you meant with your urinal example and how it applies or illustrates how people notice ads placed close to popular content. What is popular content? The most popular posts on the sidebar (like this one you pulled up from may 2009)?
Thanks for your input.
Philippe,
What I meant was that advertisers put ads where they know people will see it, such as over a urinal where eyes will be directed for half a minute or so. On a site there are places the eye naturally goes, such as top left or to a post headline.
[...] the complete article: Eye tracking study reveals 12 website tactics var addthis_language = 'en'; Tags: usability Category: Blog This entry was posted Thursday, [...]
[...] Eye tracking study reveals 12 website tactics [...]
Wow, It all makes sense. I am gonna have to try and work that into my next design. I am also gonna try to pay more attention to where i look on website. Thanks
[...] Eye tracking study reveals 12 website tactics. var addthis_language = 'en'; VN:F [1.8.6_1065]please wait…Rating: 0.0/10 (0 votes cast)VN:F [1.8.6_1065]Rating: 0 (from 0 votes) [...]
[...] et tout webmaster. Sur son blog, Dean Rieck a en détaillé 12 points dans un article intitulé Eye tracking study reveals 12 websites tactics dont je propose ici une traduction [...]
Great read.
Well these tactics are the facts for sure for catching attention of the visitor to your website. I will be trying them for sure.
Thanks
[...] Eye tracking study reveals 12 website tactics April 11, 2010 Leave a comment Go to comments Eye tracking study reveals 12 website tactics [...]
[...] First I clicked a link to this blog The Future of Digital Life that blog then credited this blog Direct Creative Blog and that blog credited this website. Tags: Info, stats, Web, Web [...]
[...] second article, which can be found here, explores much more than horizontal alignment of information, it reports on studies that have [...]
[...] Newsletters: Surviving Inbox Congestion Newsletter Usability Report from the Nielsen Norman Group Eye Tracking Study Reveals 12 Website Tactics Tips From Eye Tracking Studies on Website Design Categories: Email Newsletter Usability [...]
just discovered this article through Delicious bookmarking. Bookmarking is new for our seo service we offer and I see its value.
To find a copywriting eyetracking article with this detail was a gift. It confirms a number of consulting tips we offer our business clients when they build their web pages….build from the left out with emphasis on keyword copywriting being on the first few words a user will read.
Excellent.
[...] First I clicked a link to this blog The Future of Digital Life that blog then credited this blog Direct Creative Blog and that blog credited this website. Tags: Info, stats, Web, Web [...]
[...] Eye Tracking Study Reveals 12 Website Tactics [...]
[...] Eye tracking study reveals 12 website tactics [...]
[...] Eye tracking study reveals 12 website tactics – http://www.directcreative.com/blog/eye-trackin... [...]
[...] Eye tracking study reveals 12 website tactics – http://www.directcreative.com/blog/eye-trackin... [...]
I would love to know of any web design companies utilizing these theories and ideas please!
Really good information here…. thanks
This is an awesome list! Thanks for putting together!
[...] Efter att studera hur ögat beter sig kan man förbättra annonser, hemsidor etc. Vet man att mindre text ger noggrannare läsning, eller att rubriken drar till sig ögat för bilden, så kan detta vara avgörande i val av layout. Här hittade jag en modern studie Eye tracking study reveals 12 website tactics. [...]
[...] Footnote: Dean Rieck on Copywriting & Direct Marketing, Direct Creative Blog, http://www.directcreative.com/blog/eye-tracking-websites). [...]
[...] Eye tracking study reveals 12 website tactics by admin on Nov.08, 2010, under Uncategorized Click here to See Original Article [...]
[...] je ongebruikelijke informatie wilt delen, dan is gebruik van multimedia aangeraden.Bron: directcreative.comZelf meten?Over het algemeen is het bijzonder duur om een onderzoek als dit zelf te uitvoeren. Maar [...]
“Short paragraphs encourage reading”… Hmmm I think I am going to be using that a lot in the future!
The way I design is going to change. Thanks.
[...] http://www.directcreative.com/blog/eye-tracking-websites [...]
It will be great when everyone can afford to do their own eye tracking research and test out their designs before launching their product or site.
Greg: Google provides tools for click tracking and lets you see an overlay of the click stats right on your page. Not exactly eye tracking, but quite helpful.
[...] to sign up to your newsletter, then put a big SIGN UP HERE feature box on your homepage. This eye tracking study shows what the important factors are when it comes to conversion rate optimisation and promoting [...]
You mention that video works better than text for difficult concepts but what about placement of the video?
Heatmap-wise, where’s the best place to put a video?
I have been in this business for many years, if you make the text too small people will not read it and the best placement for ads on the printed page is on the right side not the left. check the font size used in this article, it’s actually slightly larger than average, wonder why the author doesn’t practice what they preach?
great tactics though eye tracking………..
Just wanted to say that I enjoy reading your site quite often and I’m always impressed at some of the stuff other mates post here. But keep up the good work, it’s always interesting.
nice guide, will be useful as i plan my website. thanks.
[...] your patience either. I’ve provided some links below (and tips to the left) if you’re curious. Eye tracking study reveals 12 website tactics Tips From Eye Tracking Studies on Website Design Eye tracking studies from the biggest blogs A [...]
[...] Eye Tracking Study Reveals 12 Website Tactics – Nuggets of wisdom gleaned from a website eye tracking study. [...]
[...] News | directcreative | GoogleBlog Share this:TwitterFacebookLike this:LikeBe the first to like this [...]
[...] BBC News | directcreative | GoogleBlog [...]
[...] BBC News | directcreative | GoogleBlog [...]
[...] BBC News | directcreative | GoogleBlog [...]
[...] Wielkość fontu ma znaczenie. Badania eyetrackingowe dowiodły, że duży rozmiar fontu sprzyja raczej skanowaniu wzrokiem, [...]
[...] to be above the fold so viewers don’t have to scroll down in order to spot it. According to an Eyetrack III study, the best placement of online ads is in the top and left position. This tactic, too, is dictated by [...]
[...] to be above the fold so viewers don’t have to scroll down in order to spot it. According to an Eyetrack III study, the best placement of online ads is in the top and left position. This tactic, too, is dictated by [...]
[...] looking for information are looking for text, not pictures,” writes copywriter Dean Rieck, analyzing the results of an Eyetrack III study. Visitors focus on the words in text ads more than [...]
[...] looking for information are looking for text, not pictures,” writes copywriter Dean Rieck, analyzing the results of an Eyetrack III study. Visitors focus on the words in text ads more than [...]
[...] information are looking for text, not pictures,” writes copywriter Dean Rieck, analyzing the results of an [...]
[...] [1] http://www.directcreative.com/blog/eye-tracking-websites [...]
[...] Position headlines in the upper left of a page to draw the eyes. Perhaps surprisingly, people look at headlines before pictures. [...]
I almost never comment, but i did a few searching and wound up here Eye tracking study reveals 12 website tactics. And I do have a few questions for you if it’s allright. Is it just me or does it look like some of the comments come across like they are left by brain dead folks?
And, if you are posting at other online social sites, I’d like to keep up with anything fresh you have to post. Would you list of every one of your communal pages like your Facebook page, twitter feed, or linkedin profile?
[...] get them to actually open it? Apparently, you have less than one second to convince the reader to open the email. First impressions [...]
[...] looking for information are looking for text, not pictures,” writes copywriter Dean Rieck, analyzing the results of an Eyetrack III study. Visitors focus on the words in text ads more than [...]
[...] sending your email to the right people… now how do you get them to actually open it? Apparently, you have less than one second to convince the reader to open the email. First impressions [...]
Great article! I must say that it contradicts some things, specially about the images vs headlines. I will take a careful look at that from now on.
Regards