Effective thinking. Deliery results

News and blog

How we look at the web

April 6th, 2010 by Phil H

I thought this might make for a pretty interesting post. In my daily search of the world wide web for all things geeky, I recently came across a study carried out by Eyetrack III In the hope of trying to answer some difficult questions regarding best practice in web design, they mapped the eye movements of a bunch of people looking at a variety of websites, and have revealed some pretty interesting stuff about how we look at the web. So… is there a template that the user will intuitively understand, knowing where to click without really thinking about it and without being bogged down spending time learning how to interact with it?

The results were pretty interesting (to me anyway) and not always what you’d expect.

Here are 11 points of the study I found to be particularly interesting. (Yes, I’m a nerd).

1. Page layout

Viewers’ eyes most often began their journey in the upper left of the page, then hovered in that area before travelling left to right. Only after perusing the top portion of the page for some time did their eyes start to explore further down the page.

2. Headlines draw the eye first

Contrary to popular belief, dominant headlines tend to draw the eye first when landing on a homepage, especially if they are positioned correctly in the top left. They even drew more first eye fixation than leading homepage images.

3. Small vs. large

Large type on a page promotes scanning, with views tending to gloss over areas and pull out engaging words they find. Smaller type encourages focused view behaviour. Admittedly, this is a little dangerous, and I’m not suggesting that all body copy should be 8pt in size, but the study showed people focused on the smaller type more intently and spent longer on it over large type in body copy. Don’t make everything tiny, just don’t make body copy massive to fill space.

4. Rule of thirds

People commonly engaged with the first third of a headline or blurb then made an educated decision to continue reading based on how engaging those few words were. Get your key words in your headline and get them first. This will also help with search engine optimisation.

5. Blink and you’ve missed it

Headlines have less than one second to grab the viewer’s attention. You need to catch their eye. Fast. Then work on keeping them there. Web viewers as a general rule are incredibly impatient and will gloss over a site as a whole so you need something they can engage with straight away.

6. Top of the nav

Navigation at the top seemed to work best (but nav on the left side is fine). People spend more time observing navigation at the top rather than at the side.

7. Short and sweet

Perhaps it’s a bit obvious, but short paragraphs encourage reading not grazing. Long blocks of unbroken copy weren’t read but skimmed over, whereas the same article broken up into bite-size chunks gained longer eye fixation. This suggests that people weren’t over-faced and took time to read. People don’t want information they have to chew on, they want information to dissolve on their tongue.

8. Ads the way to do it

Adverts close to popular content were viewed much more frequently. Adverts found towards the top of the page, in close proximity to relevant content, received a much higher eye fixation rate. Smaller ads, positioned on the right hand side of the page away from the main content, were rarely viewed and over two thirds of people never looked at them once.

9. Bigger is better

The bigger the image, the more time people spend looking at it. This may seem a little obvious but many websites suffer from having many thumbnail images relating to relevant stories and case studies. They bring little to the table. People also tried clicking on almost all of the images, big or small. I assume they expected to be taken somewhere, or to see a larger version of the image. Make an image big enough to see and link it to something relevant because people are probably going to click on it.

10. Multimedia for the unfamiliar

Although people did indulge in reading familiar topics, video, animation and illustration were far more successful in engaging the viewer in unfamiliar subjects. Specialised subjects can really benefit from relevant video and multimedia.

Thanks for your time and for reading. It took me absolutely ages to do this – so hopefully my bite-sized chunks did the trick.

Share this on

Leave a comment

Recent posts

February 3rd, 2012
February 3rd, 2012

RSS

Sign up to our rss feed

Twitter

Follow us on twitter
Twitter: madhousehq
Madhouse - Integrated Marketing Communications
Click to visit the Madhouse IPA homepage
Click to visit the Madhouse RAR homepage
Sign up to our rss news feed
Follow us on twitter