 |
|
Numerous research groups have conducted studies to determine how people read online (and print) content. Eye tracking research tests the theories and assumptions about this consumer behavior and can help us build a better website and guide better designs.
Although the test methodology may differ, researchers have collected and analyzed data regarding how different aspects of a web page are viewed (headlines, subhead/tag lines, ads, photos and other graphics); how people navigate a website; how long the readers stay with an article and how much of the content they read and content placement may affect any of this. Some research even tests reader retention.
Generally, eye trackers use fancy eye tracking equipment that records the users’ eye movements on a page. The results typically show red/orange/yellow spots where the reader’s eye stops or lingers; green/blue indicate areas that the reader finds less important or interesting, or, in some studies, the areas a reader does not even look at. Some tests also record where the reader clicks on their mouse and how far down the page the participant read or scrolled before bouncing away somewhere else.
Left, Right, Left
Reading in our Western culture flows top left corner to right and has a great influence in these studies. Not surprisingly, the upper left corner of the page (print or web) seems to be the overwhelming favorite gateway to websites. The upper left side of the page was strengthened when strong headlines and company logos (flags) were incorporated into the design of the page. Larger sized headlines obviously being more noticeable than smaller headlines.
Top, Right or Left
After starting in the top left corner of the web page, users’ eyes then moved left to right so logically, users focused on main navigation bars or other navigational elements that were placed at the top of the page. In some studies, main nav elements in the right hand column got more attention than those in the left hand column. The argument for a right side secondary nav is that the scroll bars are usually on the right side of the browser window. By putting the navigational elements on the right side, you increase your users’ efficiency on your website.
The argument for a left hand secondary nav is that the users’ eye always traveled back to the left side of the page (Western reading), so using the left column for this navigation would seem appropriate. The majority of websites are designed with left hand navigation and users’ are comfortable finding it in this area – force of habit. Forcing a change in this habit could force your user to have to work to figure the page out and potentially spend less time on the important content, or leave the site altogether. A good compromise is to leave the secondary navigation in the left column and include other calls-to-action items or links in the right column.
Pretty Picture or Catchy Headline?
There’s some controversy over whether people are more attracted to a photo or the web page’s headlines. After landing on a homepage, most users were attracted to content – catchy headlines – more than they were large photos. Content also guides the users’ actions on a site, so good content is critical. Users gravitated toward headlines and summaries leading into the main article as well. In most studies, they preferred content written in short paragraphs. Remember most online users scan for what they are looking for, rather than reading entire paragraphs of content.
However in some studies, users were attracted to larger and more eye-catching photos with good placement: mid-page and above the fold. Users do like content broken up with images (photos or graphics; photos were viewed more than graphics in general), whether larger or icon-sized. Since the text dictates the users actions more than images, compelling images will supplement your content well.
Ads and Folds
Ads placed in those same areas (left side of page, top of page) received a lot of attention, but that placement can cause a design challenge if you want to establish clear brand identity. Ad placement on a web page has more limits on the real estate, so it’s an extremely important exposure issue for advertisers. Users also looked at bigger ads over smaller ones and those placed near content they were interested in reading.
Content and ads placed “below the fold” or in the lower parts of the screen received some attention, but were often overlooked, especially if the user has to scroll too far down. There is some controversy over content placement in the lower right corner or lower parts of a web page, as those areas would be the logical end of the users’ eye movement. The decisions about where to place a call-to-action or an ad are: how far south on the page and above or below the fold. Best practice is usually above the fold.
F+
What we’re really looking at here is an ‘F’. The user enters your web page at the top left corner of the page (top left corner of the ‘F’) . Their eyes them move across the page to the right, comes back to the left side move down the page and then across the page to the right again….a loose ‘F’ pattern. Good web design will take advantage of this almost automatic reading behavior and place critical elements in the page’s strategic hot spots.
- ~ Place a captivating image or a dynamic headline in the top left area is great; combine the two and placing them together has even greater impact.
- ~ Use your left column for secondary navigation – it’s a natural fit for the spine of the ‘F’. And place other important navigational or calls-to-action on the right side of the page where the users’ eye naturally travel makes perfect sense.
- ~ Keep your most important content and eye-catching photographs above the fold helps grab users quickly.
- ~ Write in a way a scanner can rapidly absorb information on your home page to keep their interest. Include links or other strategies to lead users to sub pages where they can read articles in full or gather more information.
(2 votes, average: 4 out of 5)
Loading ...
