The Scent of Information and Landing Pages

By Shari Thurow and Nick Musica
Excerpted from When Search Meets Web Usability (New Riders)

Dateline: May 8, 2009

More Insight articles
Discuss this in the Web Site and Multimedia Creation forum

After searchers click a link to your website from a search engine, they have two choices: They can either stay on your site, or they can abandon it. One reason searchers stay on a website is the scent of information. If they see their user-generated scent of information (keywords) on a website’s landing page, they believe the page will help them reach their goals: where they want to go, what they want to learn, and what they want to do. Searchers become confident that the landing page is giving them what they need. The result is a great user experience, more sales and conversions, and a positive brand impact.

Searching does not end after a person clicks a link from a search engine results page (SERP) to a website. People still look for desired content once they enter and browse a website, and they exhibit some specific behaviors while they are looking. By considering these behaviors and applying some simple techniques, you can build your website to help users follow the scent of information.

See Jakob Nielsen’s How Little Do Users Read? The article contains a link to the full academic paper.

The vast majority of users do not read web pages word by word. Instead, they scan pages for individual keywords and keyword phrases. If users arrive on your site and do not see their desired content after a quick scan, they will abandon the site and move on to another. Recent studies show that users only read about 20 percent of the words on a web page. Therefore, if users arrive on your site via the commercial web search engines, important keywords and calls to action need to be featured prominently (above the fold) on web pages.

It is not enough to call attention to keywords on your web pages. For your site to be successful, users must perform certain actions on it. Calls to action should stand out on the page as well. What do you want users to do after they find their desired content? Add to cart? Enroll or register? Log in? Subscribe to your blog? Fill out a form?

A call to action is something you wish users to do when they land on a page. Most web pages contain multiple calls to action. As an example, let’s use a product page from an e-commerce website.

The primary call to action on a product page is Add to cart. A primary call to action is the one action you most wish users to do. If users are not ready to respond to your primary call to action, what do you want them to do instead? Abandon your website? Of course not. You want them to stay on your site and maybe purchase a similar item. So the secondary call to action might be to click links to alternative products. What if users do not wish to answer the secondary call to action? What do you want them to do? Call a customer service agent?

Identifying and prioritizing calls to action for every page on your site might seem like an exhausting exercise. However, site visitors will not Add to cart unless you make it easy for them. And they will not look at additional items unless you provide links to those related items. Site visitors need to see both keywords and the main calls to action with a quick scan.

How can you call attention to both keywords and calls to action on a web page? First, you should identify and prioritize the primary, secondary, and third-level calls to action on each type of web page. The illustration below shows a simple spreadsheet layout for this process:

Identifying and prioritizing calls to action on web pages.

Second, as you design each element on a page, format the primary call to action so that it stands out. The following list includes some ways to draw attention to an item on a web page (ordered from the least attention grabbing to most attention grabbing):

• Dimmed text
• Italics
• Bold
• Larger font/typeface (typically in page headings)
• Border
• Color (warm colors advance and cool colors recede; eyes naturally move to heavy color saturation and a large number of colors, and so on)
• Graphic images (curves versus straight lines; photos of faces or people; effects that indicate a dimension change such as beveling, embossing, shadows, and so on)
• Sound
• Animation/movement

The secondary call to action should be subtler than the primary one, but the secondary call to action should still be featured prominently on a page. The third-level call to action should be even more subtle than the secondary one, and so on. The illustration above shows the formatting of the various calls to action on a product page.

An e-commerce site’s product page.

The primary call to action is Add to cart. It is formatted as a graphic image in a warm color. The image has rounded corners, which makes it stand out on a website that has a grid layout, and it has an icon. It is larger than other navigation buttons. The shading and slight bevel add unique dimension. And it is placed near the center of the screen surrounded by some extra white space.

The secondary call to action is either to enlarge the product photo or to take the product tour. These calls to action are easy to spot because online shoppers always want to see a photo or a video of the product they are purchasing. Therefore, users have come to expect a link for such views. Additionally, photos typically contain millions of colors. The product photo is the largest photo on the page. The curved magnifying glass (icon) link to view the larger photo is located within the photo’s border. Note that the magnifying glass conforms to prior experiences among users. Therefore, the site visitor need not spend effort to “decode” the icon. User icons match users’ expectations and prior experiences. Users do not have to click that icon to view a larger photo. They can click the product photo as well. Both the magnifying glass link and the product tour button use a dimmed color, which helps the primary call to action stand out.

A performance test evaluates the effectiveness of site navigation, labeling and terminology, organization of content, task flow, error handling, and calls to action on a website. Performance tests can tell you how many users complete the assigned task, how many steps they took to complete the task, time spent, and potential roadblocks.

The third-level call to action is to view related items. This call to action is formatted as text links and associated thumbnail photos, which are located in the right column of the page. Note that placement on the right side conforms to site visitors’ expected pattern of page reading: left to right. Thus, a third-level call to action fits best to the right of a secondary call to action. In a text-like document, task follows our left-right, top-down reading habit (in Romance languages). Note that Arabic and Hebrew are read right-left, then top-down. Follow the expectations of whatever language you serve.

Once you have formatted some page prototypes, you can conduct a variety of usability tests to determine their effectiveness. Eye-tracking studies can tell you whether users’ eyes are focusing on keywords and calls to action. Performance tests can tell you which formats yield the most clicks and the most conversions. Even free exploration tests can let you know if calls to action are annoying, too subtle, or just right. Let’s look in greater detail at a couple of usability tests you can conduct to determine the mental models of web searchers.

Anticipate Searcher Needs with Usability Tests
One way to determine searchers’ mental models of your web pages is to perform an expectancy test. An expectancy test will also reveal searchers’ expectations about your web page’s content.

To perform this test, you first will need to gather examples of listings from the commercial web search engines, using your most important keyword phrases shown below.

Google listings for the keyword phrase pancreatic cancer symptoms. These listings appear specifically for the National Cancer Institute’s website.

If you are having a difficult time finding your site’s listings in Google’s search results, you can easily find them by performing an advanced search. Type in your targeted keyword phrase followed by site: and your domain name (no space between the colon and your domain name). For example, the listings above were located using the following query:

pancreatic cancer symptoms site:www.cancer.gov

How to perform the expectancy usability test:

1. Present participants with one or two search engine listings, such as the ones shown above.
2. Ask participants, “What content do you expect to see if you click this link?” Have them explain why they expect to see specific content.
3. Ask participants, “What do you think will happen if you click this link?” Have them explain why they believe something will or will not happen.
4. Perform this test for navigational, informational, and transactional keyword phrases.

Normally, in an expectancy test, you do not tell participants whether their answer is right or wrong because you are simply determining their mental models. However, we also want to know how well or poorly the landing page meets searcher expectations. So follow up the expectancy test with Jared Spool’s five-second usability test, a test which is used to gather initial impressions and to quickly measure how a content page performs with users.

How to perform Jared Spool’s five-second usability test:

1. Show the user the landing page that corresponds directly to the search listing.
2. Count five seconds.
3. Close the window or take the landing page away from the user.
4. Ask the user:
   • Was this content what you expected to see after you clicked the search listing? Why or why not?
   • What (content) did you expect to see but did not see?
   • What (content) did you want to see? Why did you want to see it?

If the scent of information is too weak or disappears, people will abandon your website.

What you are trying to determine is whether users easily spotted their scent of information (keywords). Were users able to see their information scent validated on the landing page? If they did not, why didn’t they see it? Where on the landing page did they expect to see keywords and associated images?

Sometimes, after the initial five-second test, you might allow test participants to view the landing page for an additional 8–10 seconds to gather more details. But still carefully note what they did and did not notice within the first five seconds of viewing the page.

If a web page was optimized well for search engine visibility, keyword usage on the landing page will be obvious. You will commonly see keywords in the title tags, visible body text (headings, paragraphs, breadcrumb links, and so on), and the URL. However, you might not always see keywords on the page because the design team might have unwittingly blocked the information scent.

Remember, if the scent of information is too weak or disappears, people will abandon your website. Let’s look at some ways that web designers, and search engine marketers, might unwittingly delay, diminish, or block the scent of information.

Avoid the Iceberg Effect
On many websites, the most important content tends to get buried far below the fold, like the proverbial iceberg, with only 10 percent of page content visible at the top of the screen.

The iceberg effect

Bounce rate is a term used in website analytics that refers to the effectiveness of an entry page. More specifically, it is a percentage of pages that are viewed once—when a site visitor lands on an entry page and then abandons the site after only viewing that entry page. It is typically calculated as:

When web searchers land on an iceberg page, it does not appear to have their desired content. The scent of information is missing and they abandon the site. So if you find that important pages have a high bounce rate, see if the page layout might be hiding keywords.

Some web designers and developers inadvertently hide the scent of information when they use a file tab layout as shown in below on the next page. The default file tab displays product details. If a user clicks another file tab, the product details content will disappear and different text will appear in its place. Although this particular design strategy is useful for preserving screen real estate, it can hide the scent of information—keywords.

File tabs and their corresponding layers. Product review content is not visible to web searcher (1) until they click the “Reviews” link (2). If the website owner wants searchers to read product reviews, the scent of information (the “Reviews” link) should be located at the tip of the iceberg.

An even worse situation can occur if the file tabs appear below the fold. In this situation, not only are important keywords invisible to users, but the links that lead to their desired information disappear. To preserve the scent of information on pages that use this layout, make sure the most important keywords are available above the fold in the short product description. If you cannot place searchers’ most important keywords above the fold, then make sure the file tabs appear above the fold. The file tab links let your target audience know that their desired content might be available on that web page.

Keep file tabs visible above the fold to provide an information scent.

Another effective way to maintain the scent of information on a long web page is to write multiple HTML headlines using keywords. At the top of the web page, make sure there are hypertext links to those headings. This format is highly useful for screen readers as well, as shown below.

Provide links above the fold to the content below the fold.

To maintain the scent of information, make sure that the words on file tabs and hypertext links are reinforced in the text the users see after they click them. If the words are not reinforced, users feel the links are misleading.

Avoid Misleading Links
Users become frustrated if they follow a scent of information and it leads them down the wrong path. If users believe that a website is deceitful, they will view that brand as being untrustworthy.

Suppose you are driving to Phoenix, Arizona, to meet potential customers. You are looking forward to meeting these prospects because they have actively sought out your products and services. As you are driving, you see the sign shown below.

The scent of information in this sign is straightforward. If you wish to go to Tucson, then you drive straight ahead. If you wish to go to Phoenix, then you must make a right turn. The sign provides two visual cues as the scent of information: city names (text) and arrows (images) indicating the direction you must drive to reach your destination. Now suppose your competitor wants you to miss your meeting with your prospect. He replaces the sign shown below with the sign following that.

Now suppose your competitor wants you to miss your meeting with your prospect. He replaces the sign shown below with the sign below that.

Road sign pointing to Phoenix, Arizona.

Sign showing the wrong directions.

The directions are reversed. Drivers who follow this misleading scent of information will drive toward the wrong city—wasting time and gas money, maybe even losing new customers. Even if a person notices that the sign’s directions are reversed, he is distracted from reaching his destination because of his confusion. And this is how users feel when they use a website with misleading or mislabeled links—confused, distracted, annoyed, and frustrated.

Many Flash sites appear to be misleading links in search listings because searchers do not see keywords in the search listing also appearing on the landing page shown below. What product, service, or information does this home page offer? Help desk software? Accounting software? Press release services? Babysitting services? Or maybe skip intro services? In this instance, the Flash technology is not the problem since Google has been able to crawl Flash sites for many years. The problem is how Flash technology is being used—web developers and site owners do not always consider searchers’ scanning behavior when they build these sites.

This web page formatted in Flash does not contain any keywords.

On a website, a misleading scent of information can be a costly mistake. Not only will it confuse current site visitors, it will also alienate new visitors. Even if you did not intend to mislead site visitors, they still might perceive your site as deceptive. People will not give you their personal information and credit card numbers if they feel your website is untrustworthy.

Foster Orienting Behaviour
Orienting is a behavior in which people use cues to determine where they are located. In the physical world, people might determine their location by using a map, road signs (see below), symbols, words, a global positioning system (GPS), or a combination.

The stop sign, the painted line on the road, and the word stop painted on the road are all visual cues that help drivers orient themselves at this intersection.

Orienting is something people do without realizing it. For example, when you ride in an elevator, the lights above the doors communicate which floor you are on. If you see the number “3” light up, you know the elevator is on the third floor. If you see the letter “L” light up, you know the elevator is on the lobby level. The elevator lights are you are here cues that help you orient yourself within a building.

Likewise, there are many you are here cues that can help users determine their location within a website. After people click a link from a search engine results page, they scan the web page for you are here cues. Ideally, people should be able to orient themselves on a web page with little or no effort. And they should be able to orient themselves within five to 10 seconds after a page loads.

The presence of easily scanned you are here cues helps instill trust and credibility in your site. As users click, the site should communicate to them that they are getting closer to their goal. You are here cues can provide that feedback, especially if they are based on query words. In addition, consistently implementing you are here cues helps users accomplish their tasks more quickly and efficiently.

To determine how easily searchers orient themselves on a web page, use the five-second usability test again:

1. Show the user the landing page that corresponds directly to the search listing.
2. Count five seconds.
3. Close the window or take the landing page away from the user.
4. Ask the user:
   1. Whose website are you viewing? How did you determine this?
   2. What section, if any, of the site are you viewing? How did you determine this?
   3. What content is available on this page? How did you determine this?
   4. How confident are you that your desired content is on this page?
5. Ask the following questions if participants indicated that they did not see their desired content:
   • Do you believe that this page will lead you to your desired content?
   • How did you determine this?
   • How confident are you that this page will lead you to your desired content?

   The illustration below shows the places that people typically look at to orient themselves within a website.

   1. Title tag. In Firefox and Internet Explorer, a web page’s titletag content is visible at the top of the screen and in the file tab underneath the address bar in the latest web browsers.
   2. URL. In an ideal situation, the URL should refl ect page content, especially for navigational queries.
   3. Logo and tagline. People expect to be told whose site they are visiting in the upper left corner of a web page.

      Areas on a web page where site visitors scan to establish a sense of place.

   4. Locational breadcrumb links. These links communicate to users where they are within a website’s hierarchy and what page they are currently viewing.
   5. Page heading. Site visitors use the page heading to orient themselves largely due to wording, font size, font color, surrounding white space, and location on the screen.
   6. Main content at the top of the page. People scan text at the top of the page for their targeted keywords. If they used a transactional word for images (such as photos) or videos, they expect to see non-text representations of those transactional words as well.
   7. Navigation buttons. Current page and/or section of the site is highlighted.

   You are here cues are very important to web searchers because when they click a link from a search engine results page, they do not always enter the site via the home page. In all likelihood, they arrive on a page somewhere in the middle a site. If the search engine correctly interprets searchers’ intent, then searchers should land on a page that contains their desired content, or leads them to their desired content. Let’s look at an example.

   The illustration below shows the top Google search results for the informational query breast cancer tests. Notice that both listings from the National Cancer Institute site do not lead to the home page.

   If web searchers click a link from a search engine results page, they often land on a page in the middle of a website.

   The first search listing above leads to a category page. Google has interpreted the plural form of the word test to mean that searchers might be looking for a list of breast cancer tests (see below), which the following landing page provides.

   Landing page after a searcher clicks the link in the first search listing in the previous illustration. The searcher is landing on a category page in the middle of a site, not the home page.

   Now let’s review the questions asked during a five-second usability test to see if and how users were able to determine their location within the National Cancer Institute’s website.

   • Whose website are you viewing? How did you determine this?
     Participants said they were viewing the National Cancer Institute’s website. They specifically mentioned the logo and text in the masthead area as key indicators that they were viewing a web page on the National Cancer Institute site.
   • What section, if any, of the site are you viewing? How did you determine this?
     Participants believed they were in the Cancer Topics area of the site because they saw the navigation button labeled Cancer Topics highlighted. They also believed they were in a breast cancer area of the site because of the large page heading.
   • What content is available on this page? How did you determine this?
     Participants believed they were viewing a page about breast cancer tests, the very keywords that they typed into Google. The large page heading, the logo, and the organization name all led them to believe that their desired content was available on this page.
   • How confident are you that your desired content is on this page?
     All participants were confident that their desired content was on the page, or at least on the site. This particular landing page contains easy-to-find links to guide people to more detailed information on other pages within the site. The presence and formatting of the secondary heading Mammography helped increase user confi dence (see below).

     When test participants were shown the National Cancer Institute’s category page about breast cancer tests for five seconds, almost all participants were able to establish where they were within the NCI website.

     Websites that facilitate scanning and orienting help searchers reach their goals more quickly and efficiently; increase user confidence, trust, and credibility; and can help sites achieve and maintain top search engine positions. However, not all behaviors that people exhibit when they look for content indicates a positive user experience. Some search behaviors indicate a negative user experience due to a lost scent of information.

     Pogo-sticking: Negative Search Behaviour
     Pogo-sticking is a browsing behavior where users jump up and down the hierarchy of a website to find their desired content. If users exhibit considerable pogo-sticking behavior, they are less likely to purchase, download, or answer any primary call to action on your website. Here is an example of pogo-sticking behavior.

     Suppose a searcher wants to purchase a digital camera. He is viewing a category page labeled “Digital Cameras.” This category page contains a list of thumbnail photos and corresponding text links to individual product pages. One camera looks promising. So he clicks the link to view details about the camera. He doesn’t see exactly what he wants and clicks back to the category page. He sees another camera that he likes. So he clicks the link to a different product page. The camera is too expensive, so he clicks back to the category page. And so on. This searcher is exhibiting pogo-sticking behavior, jumping back and forth between a category page and individual product pages as the figure below illustrates.

     A searcher clicks back and forth between a product page and category pages, pogo-sticking to find the information they want.

     Usability testing is crucial to determining whether users are pogosticking, because web analytics data can be misleading. Many analytics packages are designed to calculate the average number of page views per visitor, but the packages are not set up to determine if the increased page views are due to pogo-sticking behavior.

     Clickstream analysis might help you identify pages where pogo-sticking occurs. To help users succeed in getting their desired content, site owners should understand where people are pogo-sticking on a site, and why people are pogo-sticking. Usability testing will give you those answers.

     Remember, management might be happy to see increased page views. But if site visitors are pogo-sticking, they are having a negative user experience. Most users buy products without pogo-sticking at all.

     Conclusion
     

     Key points in this chapter:

     1. Users only read about 20 percent of the words on a web page. Users don’t read; they scan web pages for their targeted keywords. So don’t make users work too hard to find desired content.
     2. Conduct expectancy tests to determine web searchers’ mental model of your landing page after they view various search listings.
     3. Web searchers want see their query words and calls to action featured prominently on web pages.
     4. Identifying and prioritizing calls to action for every web page on your site is important for converting site visitors into buyers.
     5. Make the primary call to action the most noticeable call to action on a page. The placement and formatting of secondary and third-level calls to action should be more subtle.
     6. Web designers and search engine marketers might delay, diminish, or block the scent of information by hiding desired content below the fold and in invisible layers.
     7. Many Flash sites appear to be misleading links in search listings because searchers do not see keywords in the search listing also being used on the landing page.
     8. Orienting is a behavior in which people use cues to determine where they are located with little or no effort.
     9. Site visitors should be able to orient themselves within five to 10 seconds after a page loads.
     10. Pogo-sticking is a browsing behavior in which users jump up and down the hierarchy of a website to find their desired information. This behavior can be an indication of a lost information scent.