The Attention Map

Attention mapping is a tool to help you start to plan a visual layout around realistic communication between user and site.

It can also be a helpful analysis tool, helping you work out what's wrong about a layout.

The most important elements on a page are those that help the user (and site) achieve their goals. Those things should be nearest to hand, and in positions where they'll be seen.

Attention maps are great because it is much quicker and easier tosketch out your priorities first on paper than to try to do it as yougo in Photoshop etc.

Once you've got your map, you can use it to guide the amount of contrast/noticeability you give to each screen element.

1. Primary importance

What are the most important elements on the page - the ones the user probably needs to use? Is there any? A regular web page will normally have three or less of these elements.

Only applications that use a common interface that features multiple tools should ever have more than three. If you can think of more than three, consider whether they are really all top-priority. Take a piece of paper and draw a placeholder for the top-priority elements, really big and bold, up near the top-left.

2. Secondary importance

Next, consider the things that the user might need to find, but not urgently. Add these to your attention map, half as big and half as bold as any urgent elements. Then, take the minor elements that probably belong on the screen, and add them, smaller and less bold.. and so on.

etc. etc..

A rough example

This is the kind of attention map I might draw for Web design from Scratch.

Sample attention map

The layout of this site is very simple, but there is still a pecking order among its elements.

The page title is the highest-priority item, because it tells you where you are / what's there. It should get the first attention, which is why it's large and very bold on my attention map.
Second in the line for the user's attention is the site logo (siteidentifier). Obviously, the logo should be clear, because it tells youwhere you are, and someone could land on any page on this site,following a link or search engine result. I want them to know wherethey are quickly and easily. But a site's logo surely isn't asimportant as the page title, or the page contents, because you don't*need* to be reminded what the site is on every page. Although I've gotthe site id as second-highest priority, I know that it isn't *actually*2nd priority, because of the way the brain works. If you've browsedseveral pages on this site, you'll know what the site is already, andyou'll automatically ignore the logo (as long as it isn't tooin-your-face). This is one reason why the logo should always be in thesame place on the page - at the origin!
Same goes for the title bar pictures at #3. Once you've seen a pic, you'll start to ignore it on subsequent pages.
I've got the page summary in next. It is important, because it answersthe question "Am I in the right place? Is what I'm looking for here?".
I have the course navigation less noticeable than the site id, page title, title pic, and page summary. I can make a general assumption that someone looking at a page on my site has followed a link for a reason. This is a content site: a destination, not a stepping stone, not an obstacle. Also, I value all pages on the site equally. I don't want the user to buy, subscribe, or click on adverts. That means that giving my user the page content is higher-priority than sending them somewhere else. That's why the site navigation isn't particularly prioritised visually.
Footer navigation is very low priority, and serves more to round off the page than provide useful links.

How to Grab the Attention of your Audience With your Web Site
Using the first ten seconds of view time to offer and deliver your promise is the key to converting a hesitant website visitor into a customer.
3 Secrets to the Perfect Headline that Will Have Your Prospects Hungry for More
The key to attracting a potential customers attention in any form of marketing is your headline. Your headline is the first thing that a prospect sees in your marketing campaign, and it will either make or break the effectiveness the rest of your ad copy.
Photo-spangled designs
Photos into design is like putting life into it. Without photos, the design would appear bland and boring to those who are seeing them. People, having short attention span, gets bored easily. It is when they see something interesting that their attention first is caught. Curiosity will follow...
Are pictures really worth thousand words?
Are you amenable to the maxim - a picture is worth a thousand words. If you do, then you are presumed to use more colorful and arty images and not so much with texts.
A great banner only needs simple things
To create your own great banner, you only need five (5) simple things:
1. Size according to standards. Always keep to the standards. Having a bold, huge banner would look good and attract more attention than any graphic design ever would...
AIDA is the Acronym for Healing Website Worries
Did you know that every website, like every ad, should contain four elements which can be remembered through the acronym AIDA? Read this article and increase your sales.
2 Surefire Ways To Maximize Your Adsense Earnings
Most webmasters know that Adsense generates a sizeable source of additional advertising income. That is why most of them use it to go after high paying keywords. They have with them the lists that tells what the keywords are and have already used various methods of identifying them.
7 Pointers about Web Design
In order to master the art of web design, designers must follow the subsequent pointers:
Selling Your Domain. To Auction or Not to Auction?
Looking to capitalize your domain names fast? Putting your domain up for auction may be just the ticket for sales with a side benefit of promotion.
Words Come Before Looks In Web Design
Advertising agencies tend to design awful websites because they are obsessed with getting attention. When people come to your website, you have already got their attention. They want to do something. They want detail. They want facts. The thing they value most is their time. So dont waste it. A....