Eyetools, is a company that conducted the Eyetrack III study: "Eyetracking is a monitoring technology that determines where a person is looking. Special cameras called 'eye trackers' can watch a person's eye and capture fixations and eye movements with a remarkable degree of accuracy (typically accurate to 1 cm on a standard computer screen) without requiring any special headgear." Eyetracking is research that tracks where a person's eyes look while reading then analyzes the data to reveal patterns. By combining and reviewing data from multiple individuals during testing, you can discover representative patterns that apply to most of the population. For the Eyetrack III study we examined viewing patterns of prototype news websites, but you can use eyetracking to study how people view printed newspapers and magazines (editorial content and/or advertising), to gauge effectiveness of various forms of advertising, product packaging, and computer applications; it can be used in flight simulators, and even to track what people look at on shelves when grocery shopping. In other words, it's like getting inside of a person's head and watching what they see -- with the advantage that a computer is recording every eye movement and fixation for later compilation and analysis.
First Findings
Way back in the late 1980s, The Poynter Institute first got interested in learning more about news consumers' behavior through eyetracking research. Poynter affiliates Mario Garcia and Pegie Stark Adam, working with researchers and EYE-TRAC Research technology from Gallup Applied Science of Princeton, New Jersey, conducted the first eyetrack studies of print-newspaper readership. Their findings were published in 1991 in a book, "Eyes on the News"
Focusing especially on the use of color, the research produced some findings that startled and surprised the news industry. In his introduction to "Eyes on the News," Poynter's Roy Peter Clark wrote: "As I read (the findings), I sat scratching my head as myth after myth about newspaper reading fell by the wayside.
The research was groundbreaking. This was the first time that a significant independent study had been conducted for the newspaper industry using eye tracking technology.
• Color photos do not automatically draw readers. Content, size, and placement are more important.
• Readers will enter a newspaper page wherever the most powerful element is - and are willing to follow trails that editors lay for them.
• Readers look at facing pages as single units.
• Readers are willing to accept bold, even outrageous color experiments.
• Color does not detract from a reader's acquisition of visual information.
Back then, eye tracking technology wasn't as sophisticated as it is today. Test subjects sat at a desk with a bulky headpiece containing two video cameras and a reflective visor, with wires attaching the unit to a computer. This was as "realistic" a reading environment as could be created given the limits of the technology at the time.
Videotape of each participant's session was analyzed to record where the reader entered a page and the number of elements -- headlines, photos, cutlines, and text -- looked at along the path through the page. By seeing how long the eye remained on any one element, the researchers determined to what degree the material was processed.
It revealed, among other things, that most people enter a newspaper page through the dominant photo, then move to headlines, cutlines and secondary elements before reading the story. That study established design principles still followed in newspapers around the world.
"In general, text was the last point reached in the reader's journey," Adam says. "It was amazing to learn that most readers did not enter through a lead story as many editors assumed."
Original findings also revealed that newspaper readers see facing pages as one unit and that they read from right to left, lending credence to the belief that right-page advertising is read first. In 1990, color was key and eye tracking proved its solidity as a navigational device. "Today, color is everywhere and utilized in intelligent, new ways," Adam says. "It will be interesting to see which of our initial findings hold true."
Understanding how people read
According to psycholinguist Keith Rayner of the University of Massachusetts at Amherst, your eyes do not move smoothly across the text as you read. Instead, the typical reader behavior is to look at a word or several words in a group, then pause your eyes there briefly; this is called a "fixation," and it takes about 0.25 seconds on average. After a fixation, you move your eyes to the next word or group of words; this movement is called a "saccade" and takes only 0.1 seconds. (People often skip over short or predictable words such as "of," "in," "a," etc.) After this pattern is repeated once or twice, you pause to comprehend the phrase you just looked at (which on average takes 0.3 to 0.5 seconds).
According to Rayner, all these fixations and saccades result in 95 percent of college-educated people reading between 200 and 400 words per minute when reading an article; 300 words per minute is the average.
F-Pattern:
User interface guru Jakob Nielsen of the Nielsen Norman Group were on the road, giving seminars based on a recently completed an eye-tracking study that indicates how users consume Web pages–such as where people start browsing on a page, whether they have banner and text link blindness, where users look for navigation, how they react to different text types, relative attention allocated to text vs. pictures and more.
"The real highlight [of the study] is that peoples’ eyes flitter fast across pages. Very little time is allocated to each page element, so you have to be brief and concise in communicating online," Nielsen said. "They don’t look in on, across the lines of a page, and often fixate on something, such as the first few words of a headline, for only a tenth of second. The right-hand side is often never in view of the eyes. People look down the pages in an ‘F’ pattern with a few stripes at top–the first one longer than the second–and then down the long vertical stripe to see if is any else. Sometime the track turns into an ‘E’ pattern but it’s usually an F."
Pictures, images and moving objects tend to be more of an obstacle course for the eye, Nielson said. "It’s a bit of strange finding, but it’s consistent across Web sites. They tend to have a goal of distracting user," he said.
He gave an example of ecommerce sites with images of current promotions in the middle of a page that get tuned out. "If it’s a product associated with what they are interested in, it gets high attention," he noted. Similarly, animation can repel the eye if it’s not relevant to the user or if its overly complicated. "These are not spinning things that move around from all different angles, just a simple, predefined, one spin that plays on its own," Nielsen said.
Basically, users have become savvy surfers of Web pages, and that includes advertising content. "Advertising in general fares very poorly," Nielsen said. "There is almost no fixation on ads, and when there is, usually just in corner of the ad, perhaps attracted by some movement for a moment."
Ad placed on search pages are an exception. Search ads placed on the right side of a page, and especially at the top, get some amount of user attention, he said. The look and feel of text-based search page ads also carries over with a less negative effect on non-search sites. Non-ad page elements with the same shape or color of ads, such as banners, tend be ignored when people scan with their peripheral vision.
Image quality is also a factor in drawing attention. People in pictures facing forward is more inviting and approachable, Nielsen said. Obviously, fuzzy, small images are less inviting as are big glamor shots. Nielsen said the eye-tracking study also surfaced a counter-intuitive finding–people who look like models (perfect human specimens according to popular culture) are less likely to draw attention than ‘normal’ people. "A call center ad with model in it on the phone may be a good picture technically, but it will more likely be ignored," Nielsen said.
Nielsen’s advice: Understand the F principle, write eye-catching, concise headlines and display crisp images.
Using Heatmaps:
A heatmap is an aggregate view of all the individual user session images (like the one in question 4 above) for a single webpage on a single task. Researchers combine all the individual page sessions to create a single view of a page, revealing eye patterns from the group of test subjects.
This heat map was used to study:
SECTION 1:
•Compare viewing across different news design elements (e.g., font size, use of blurbs, number of headlines)
•Compare viewing across different news website styles and layouts that we modeled after current high-traffic news sites on the Web.
•Compare viewing of different article page layouts and writing styles
SECTION 2:
•Compare comprehension of material in multimedia format vs. text format
SECTION 3:
•Gather preliminary information on how people view multimedia/interactive free-form articles
Eye tracking methods for websites and UI’s
Remember those early generation websites? Their pages were like vast landscapes of text sprawling across and down screen after screen. Graphics were crude and too large for the typical home user to view.
Today, the online landscape is more diverse: flashing animation, graphical displays, streaming video, sounds that roar from pages unexpectedly
The Stanford-Poynter Project revealed that text may be a more immediate entry point than images on online news sites. This is surprising, especially in an interactive medium that attempts to heighten the user's experience through the integrated display of text, photos, video, and animated graphics. However, it makes sense that new rules apply to the new medium.
The study, which involved 67 subjects who were experienced and regular users on the web, confirmed the obvious for some and raised doubts for others. Jakob Nielson, said in an article that this study "makes a few of their (researchers') minor conclusions suspect, but the main findings are very robust and credible".
Previous studies of reader behavior with news in print found images to be the key entry points to the printed page. Traditional schools of design understandably teach the same thing. And many in the design community are steadfast that on-screen design follow print. That's understandable, too, since designers are using the same storytelling tools online -- photographs, graphics, and typography -- that they use in print.
The study, however, has indicated that more often than not, briefs or captions got the first eye fixations when the first page came up.
Does this mean that photos or graphics do not have a place on the homepage? Hardly.
With 64 percent of all available photos having fixations, photos clearly are essential. In fact, many online news organizations' log files show that photo galleries are among their most popular destinations.
In the Page Elements sections of the study, page elements for all pages were ranked by volume of fixations. Photos are third to article texts and briefs, which were looked at 92% and 82% of the time, respectively.
The conclusions of these early findings are not meant to encourage text-only presentation of websites, nor do the findings reveal that online readers prefer text to images to get their news.
The release of these early findings and the analysis of additional data, described in an accompanying piece by Marion Lewenstein of Stanford, help online news visitors by helping designers better understand their audience.
So, what can we learn from the early results of the Stanford-Poynter Project?
Improve Headlines and Briefs
Many times, headlines and briefs run in the newspaper with a photo or other graphic. However, once uploaded to the website, the text and visual elements are isolated from one another because of limited real estate on the screen. One solution is to rewrite headlines to compensate for the lack of visual support. More often, headlines are written to fit the column space allocated for the story. These limitations do not exist online, so optimize and rewrite headlines to do what they're supposed to do: bring the reader into the story. With headlines and captions drawing the eye first, this may be the first and only opportunity to bring online readers in.
Edit Online Photos and Graphics
Just as headlines are packaged directly from the print edition into online, photographs are often taken straight from the paper and displayed on the web. Unfortunately, the amount of graphic information displayed on screen is far less than in print because of the enormous difference in resolution. Print can display from 180dpi to 1200dpi whereas a standard computer monitor only can display 72dpi. Photo editing for online news should consider the following:
1) Is there a different photo more appropriate for online display, one with a single focus or a single subject?
2) Can the crop of the same image be tighter, to help the user focus on the main detail?
Understand Your Online Reader
The online medium is different from print. The habits of reading from a computer screen are different, of course, than reading a newspaper or magazine. It is common to observe people focused on reading a newspaper on a bus, in a coffee shop, or waiting in an airport terminal, isolated from distractions. In contrast, online readers are catching up with their news between answering e-mail, conversing with colleagues, or answering phone calls. The need for quicker access to information is much more prevalent online. Competition for attention is not limited to other online sites but includes daily activity in and around the user's computer.
Study also shows that the bigger size font is for headlines and help people scan while smaller font siz actually help people to focus and read more.
Usage of lists, bullets and white space is good.
As this video from Poynter shows how several usability issues in online reading can be overcome with this technology
No comments:
Post a Comment