Is Your Website Ready for the 5-seconds-attention-span Challenge?

After decades of TV, Radio, Magazines and now Internet, we find ourselves in a society overwhelmed by information begging for attention. As a result of that we have a world with an attention span now shorter than a goldfish’s. How is the media and specially the web facing that? And how can we take advantage on way the human mind works?

By the time that there was no PCs, Internet or cell phones, the kids had just the Street and Atari to compete for their attention. The only thing that matters was trading cartridges and getting lots of video games to play. Then, with the internet, they started having access to thousands of games to play. That’s when the things started to get boring.

We live in era of too much information, and our attention span (the amount of time a person can concentrate on a single activity) is getting lower. The TV is the mostly blamed for the beginning of that, 30 years ago. To show how our attention span is getting shorter, see these examples: Radio and TV advertising air time. These ads used to be 60 seconds long, and today we have even 5 seconds ads and 2 seconds blinks. They are trying to get our attention in smaller chunks.

Attention span of a goldfish

If television is to blame for being addictive and diminish our attention span, what can we say about the Internet? When we are on the Internet, our attention span is shorter because we have too many options. As a result it is pretty difficult for a web user to keep focus on one single thing; we get quickly bored and just jump to another site.

The addictive nature of the Internet and the long hours we spent on it can leave us with an attention span of nine to five seconds –a goldfish have nine.

Five seconds to make your web Sticky

The average time an online viewer spends on a page is less than 60 seconds. But, “If a website has stickiness, it will keep your attention glued to that site rather than let you click on another one as your competitor is just one click away” explains psychiatrist Pam Briggs, of Nottingham University in the UK.

How we measure that so called stickiness?

There’s a method that measures where the user clicks or looks: the heatmap. feng-gui.com is free heatmap service where you upload a image, website, ad, photo and it simulates human vision during the first 5 seconds of exposure to an image. The algorithm that predicts the human eye reaches a 70% of accuracy compared with Eye and Mouse Tracking.

What are the benefits?

In plain English, it tells you “What people is looking at” and it’s an invaluable tool to determine:

* Product Placements and Branding Effectiveness
* Hotspots Fixations
* Hotspots Order
* Gaze Saccades
* Which areas are being ignored

Which are features that are analyzed in the images?

The basic features the algorithms analyze, to predict the what humans will look at, are:

* Color
* Orientation
* Density, Contrast
* Intensity
* Size, Weight
* Intersection
* Closure
* Length, Width
* Curve

The user jumps from one interesting spot to another following a hierarchy. The bigger ones, with more contrast elements will sure call our attention first, for example. And here is where it is important to determine the hierarchy of the information and translate it on the design. The primary task of graphic design is to create a strong, consistent visual hierarchy in which important elements are emphasized and content is organized logically and predictably.

Graphic design is visual information management, using the tools of page layout, typography, and illustration to lead the reader’s eye through the page. Readers first see pages as large masses of shape and color, foreground elements and a background field. Secondarily they begin to pick out specific information, first from graphics if they are present, and only then do they start parsing the harder medium of text and begin to read individual words and phrases. We scan images, unconsciously looking for things that drag our attention. It means that through the use of images, shapes, colors, fonts and illustrations we guide the readers, showing them were to look and what to look first, drawing a reading flow.

How to take advantage of that?

We can make the most of it, following some design principles:

* How To Improve Direction in Your Designs at snap2objects.com
* Typographic Contrast and Flow at webdesignerwall.com
* Visual hierarchy at webstyleguide.com
* Color Theory at valcasey.com

Conclusion

In the ever increasing world of media screaming for attention, is crucial to understand how our body and mind reacts to a visual stimuli. That way we can take advantage of the primitive human impulses as well as the new behavioral scenarios that media and technology bring along.