Usa-blog-bility

Design & The Importance of Context

As a designer & web professional, I have had many discussions about the value of incorporating billboards or “Hero Images” into our website designs.  There are always questions of what is most effective in getting user conversions or retaining site visitors, and the answers always vary.

Today I stumbled across a blog post from by a company (Omniture) who tested two design approaches that wrestled with this issue on websites for two universities last fall. 

One approach used a "Hero Image" with a very stylized design.  The other approach used a less stylized (more text) version of the same promotional page. 

On one university website, the "Hero Image"/Billboard won handily; at the other university, the version without the hero image won in a landslide.  From analysis of the data and site metrics, they discovered that context and referrals made a huge impact on which approach resonated more with users and gained the desired conversions.

"For the page where the stylized design & the lifestyle hero image won, most of the traffic came directly from search engines. For the page where a simple design and no hero image won, most of the traffic came from other pages on the university's own web site. Are you starting to see why audiences may have responded differently? Stop and think about it for a second.

For traffic that comes directly from search engines, the visual impact of a page is a key success factor. These types of users are "pogo sticking" from result to result, giving each landing page about three seconds of their time before they either commit or move on. Snap judgments based on the way a page looks can be critical. A compelling page design and a comforting image can make an enormous impact.

For traffic that comes from other pages on the same site, the visual impact of a page is often less important. Users have likely already qualified themselves and are looking to convert. Too many visuals (and even benefits messaging) can actually create a distraction for these types of users. So in this case, simple is better.

At the end of the day, we got lift for both clients, so it all worked out. But it was a good reminder of how context, not just content, makes a big difference in how users will respond."

The whole post can be read on the Omniture.com blog.


About the Author:  Shayla Mae Bailey joined the Department of Health & Human Services in October of 2009, and currently leads the WCD Design Team.  She has been a part of the web industry for over 12 years, and has worn every hat from coder to designer to team lead--and everything in between!

Posted on July 16, 2010 at 03:38 PM in Design | Permalink | Comments (0) | TrackBack (0)

Survey Respondent Behavior and Satisficing

Although it is nice to think that respondents always consider survey questions carefully before answering (a process called optimizing), several factors may affect their abilities and motivation to do so.  According to the theory of satisficing (a combination of “satisfy” and “suffice”), respondents sometimes take shortcuts to answer survey questions, settling for merely satisfactory answers[1].  By satisficing, respondents provide a reasonable answer without working too hard.  In some cases, the behavior is intentional, but in other cases, respondents may not realize they are taking shortcuts.

There are a number of satisficing behaviors.  For example, respondents may:

· Overuse no opinion, don’t know, or neutral response options

· Overuse socially desirable response options

· Select the first reasonable option, making options earlier on the list more likely to be chosen (primacy)

· Give the same answer to each item in a list (nondifferentiation). 

· Answer affirmatively regardless of the content of the question (acquiescence bias)

· Avoid the endpoints of rating scales (contraction bias)

Respondents satisfice for two main reasons.

(1) The questions are difficult to understand or answer.

(2) They lack motivation to complete the entire survey carefully.

You can minimize the risk of difficult questions by designing good questions for the target audience.  Several other blog postings have listed some ideas for ways to design good questions.  In general, each question should ask about a single issue, with appropriate response options.  The questions and responses should use language that is familiar to the target audience and avoid unfamiliar jargon. 

It may be more difficult to address the lack of motivation, since there are many factors you cannot control.  However, asking good questions and limiting the length of the survey can help keep respondents engaged.  In some cases, you may be able to use an incentive, such as cash or entry in a lottery, to maximize respondents’ motivation.  

 

The views expressed here are those of the author and do not necessarily represent the policies of the U.S. Bureau of Labor Statistics.

Bio:  Jean Fox has been at the Bureau of Labor Statistics since 1998.  She conducts usability design and evaluation work on tools for data collection and dissemination and promotes usability whenever she can.  She wishes to thank Scott Fricker of BLS, who co-authored two papers from which many of these ideas were drawn.



[1] Krosnick, J.A. (1991).  Response strategies for coping with the cognitive demands of attitude strength in surveys.  In J.M. Tanur (ed.) Questions About Questions: Inquiries into the Cognitive Bases of Surveys.  New York: Russell Sage Foundation, pp. 177 – 203.

 

Posted on June 04, 2010 at 03:24 PM | Permalink | Comments (0) | TrackBack (0)

More About Mental Models

Last blog I wrote about mental models and provided an example of a restaurant mental model. I am sure that our restaurant mental models match and you may have even said - oh that is what I expect to happen too. This time I thought I would blog about what happens when a change occurs and our mental model is no longer valid

Fast Food Restaurant Revisited

My fast food restaurant mental model says that I will go to the counter, order my food and beverage, pay and then when my order is complete the number is called and I get my order in a bag (unless you live in Washington, DC where the bag is optional and you must pay for the bag). What would happen if you went into the fast food restaurant, stood at the counter waiting for someone to ask you for your order but no one waited on you? Your attempts to get the attention of the staff who were busily filling other orders were ignored. Obviously your mental model is no longer valid and now you can't even predict how to do something as simple as ordering food.

 

But We Just Wanted to Improve the Ordering Interface

What happened? Well the restaurant decided to improve service and customer satisfaction. Rather than having you wait in a line they implemented an ordering service at the table. All you have to do now is input your selection into the panel. When your order is ready, the input device will notify you and you just go pick it up and pay for the order. The restaurant's intent was not to confuse you and they thought they were improving the ordering interface and process.

 

Changes Happen All the Time

Changes happen all the time, leaving us in a position where we have to edit our mental models. Remember a couple of years ago when you would go to a Web site and you could always recognize a link. They were blue and underlined unless you had already visited the link and then it was purple and underlined. There was never any doubt what was a clickable link. Now the predictability of the link world has changed. You cannot always predict what text is a link and usually it requires a mouse over to be sure.

 

A Link Example

Recently I went to a well-known government website to see how they handled links. I had to create a new link mental model because nothing on the home page was blue and underlined. I did notice some blue font so I moused over the font and discovered that this color blue was a link. I continued to form my mental model and soon found that other link font colors included: gray, black, gold and sometimes burgundy. I say sometimes burgundy because I quickly found out that not all burgundy text was a link. I continued to navigate through the site with my new mental model. Unfortunately I am on another page now and there are blue underlined links and a slightly different blue font color that is also a link. Off to another page and I note that white with an underline and sometimes without an underline is also a link. Oh no and now there is a link labeled click here (that is not so helpful for screen readers).

 

My New Mental Model

Well I have been navigating around the Web site so I think my mental model is almost complete. So here goes: Most blue fonts are links whether they are underlined or not, black font is a link when used for navigation but not usually in the content, gray font is a link, gold is a link, and sometimes burgundy. But to be sure you may want to mouse over the text.

So that took some time to create a mental model for something that would appear quite simple - finding links on a page. And I ask myself - how did life get so complicated?

Author Bio
Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and the usability.gov Web site at the U.S. Department of Health & Human Services.

 

Posted on May 25, 2010 at 09:33 AM | Permalink | Comments (0) | TrackBack (0)

Mental Models

Definition

A mental model is how we explain our thought processes about how something works in the world. It helps us to shape our behavior and define the way we are going to approach something or how we solve problems. Our mental models help us to predict what will happen.

 

A Restaurant Mental Model Example

We have mental models for almost everything we do. So I think an example will help. We will call this mental model - our restaurant mental model. And for this example, I have three parts to my restaurant mental model. I have a mental model for a fast food restaurant, a cafeteria-style restaurant, and a casual restaurant. I am sure you are saying to yourself - oh right I get it now.

 

Fast Food Restaurant

So when we walk into a fast food restaurant we walk up to the counter (usually have to wait in a line). The person at the counter says "can I take your order please". We might say - I want a number 2 please (that way we get fries and a drink). The person at the counter enters the order into a computer type device and tells you the amount. The person will ask us if we want this order to go or eat in. We give them some money and they hand us the change with a receipt. We wait until someone says a number 2. We either take the bag of food to go or sit at one of the plastic tables.

 

Cafeteria-Style Restaurant

A cafeteria-style restaurant is slightly different than a fast food restaurant. But I bet you are saying – oh yeah – when I go there I do this. I grab a serving tray, some silverware, and napkin. I look around and since I like salads I go to the salad bar. I assemble my salad, decide on a roll, go over to the drink station, pick up a drink cup and fill it with diet Coke. I am ready to pay so I go get in the line with the cashier and pay her for the food and go find a table to sit at.

 

Casual Restaurant

I think by now you probably are thinking – yes this is what I do too. Interesting how our mental models for predicting what we should do are similar. This restaurant is a bit different than the other two. I enter the restaurant and the greeter says how many in your party. I say there are three of us and she escorts us to our table, hands us our menus, and says your server will be Mary. Mary comes a few minutes later and says “Good evening, I am Mary and I will be your server this evening. May I take your drink order?” She goes off with our drink order while we look at the menu. She comes back with the drinks and says “are you ready to order?” We give her our order and soon the food server delivers our food. Mary will come back several times (well if she wants a good tip) and ask if we need anything else. When it is time to pay, Mary will bring our check. We leave the money and a tip and we leave the restaurant.

 

Mental Models and Interfaces

So now you are probably thinking, what does this have to do with computer interfaces? Well, users come to our sites with expectations of how things are supposed to work. Much like learning the behaviors for different types of restaurants, users learn and have expectations how interfaces work.

 

All is well and good until we deviate from the standard way interfaces work. For example, a couple of weeks ago I facilitated a usability test. The interface had a horizontal tabbed navigation scheme. Users’ expectations are they click a tab and the home page for that section is rendered. Not so this time. Instead the clicking the tab behavior resulted in a drop down of the second level navigation for this category. Part of that second-level navigation was also the home page for that category. It was interesting to watch users click and click and click the tab and nothing happened. Sure after a while they noticed the home page but I am sure they were thinking what is going on here this isn’t how this is supposed to work.

 

All nine of the users did the same thing – they clicked on the tab because that is how it was supposed to work according to their mental models. It didn’t work that way so they were confused. Sure they got it after they saw the drop down had a home but not all the drop down menus worked that way. So another deviation from how they were learning the navigation worked on this Web site.

 

The moral of this story is we have to be very careful when we deviate away from our users’ expectations of how things are supposed to work. If we always put the navigation at the top of the page or in a left navigation menu then we shouldn’t put the navigation some other place on the page. If all our Web sites have the navigation menus or tabs separate from the other content then we should continue to put the navigation where our users are expecting to find it.

 

 

Posted on May 11, 2010 at 10:28 AM | Permalink | Comments (0) | TrackBack (0)

The Owner’s Manual is Everything

I decided I needed another car. So I purchased a BMW Z3 convertible with a seat for me and one for Buster my silky terrier. And thank goodness this one has a much easier clock to set so I don’t have to be concerned about changing the time this Fall.

 

Since it is 12 years old I guess I couldn’t expect it to still have the owner’s manual. But I quickly learned not to push buttons that have ASC on it to see what it does. Apparently that wasn’t a wise choice and it wasn’t long before a warning light came on the dashboard. Of course I had no idea why that warning light came on.

 

Which brings me to my point, a simple six letter word”GOOGLE”! There are actually 12 definitions for “Googled” in the Urban Dictionary. The favorite definition is “to do an internet search on someone/something”.

 

So I googled 1998 BMW Z3 owner’s manual and for only $5 I could download it as a PDF. That was a lot cheaper than buying the hard cover manual for $90. Within minutes of paying electronically, the file was zipped and sent to me. I found out that the ASC was my automatic stabilization control. I won’t push that button again.

 

So just what did we do before Google? Seriously, you can find anything or anyone online now because of the power of a search engine and an internet connection. So I started to think about what I would have done about something as simple as an owner’s manual. I guess I would have gone to the BMW dealer and tried to order one. Which if you have ever gone to a BMW service center you would understand how much that was going to cost me.

 

So what did we do before Google? I guess we all worked a lot harder trying to find information. Does that mean we create better ideas or find better information? Are we more creative because of it? Or has it lead us to be a group of individuals who no longer go to the library and research topics? And what about the credibility of the information we find?

 

Funny I asked the same thing before word processing. Thinking about writing my dissertation and making all those changes on a typewriter would have really put me over the edge. Hopefully the committees were more lenient then. That only led me to think about all the other wonderful discoveries. All of these seem to have the same result – it took a lot longer before to do the same things. Without airplanes, it took a lot longer to get from point A to B especially if it was a thousand miles away. Before the telephone, we actually had to write a letter or travel to talk to someone. And now with cell phones, we don’t even have to call and talk we can just text.

 

All of these discoveries have all added some type of value to our lives. But whether you consider them positive or negative is difficult to answer. Certainly many of them have changed social interaction.  

Author Bio
Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and the usability.gov Web site at the U.S. Department of Health & Human Services.

Posted on April 01, 2010 at 08:50 AM | Permalink | Comments (2) | TrackBack (0)

Text-Laden Pages

One of my pet peeves is landing on a Web page with a lot of text. I feel exhausted before I even start to attempt reading. I am sure most or even all of us have had that experience. But what can we do to assist the user so they don’t look at the page and decide they just don’t have the energy and will go some place else?

In cognitive psychology, Herbert Simon used the term chunk to indicate long-term memory structures that can be used as units of perception and meaning. Chunking refers to a strategy to make more efficient use of short-term memory. Okay now you want to go somewhere else too. But think about the number 12312010. It has eight numbers (and within Miller’s magic 7 + 2). It might be difficult to remember that number if you were asked. But what if we ‘chunked’ it and related the number to something else? What if we said 12 31 2010? We could even say New Years Eve 2010 since that is a way that we could make it a bit more relevant.

Okay so what does this have to do with text-laden pages? Well we can use the same technique to organize page content and write visually. I think this example might help. As you can see this looks like a ‘wall of words’. The user cannot easily scan the sections to see what content is there and read what they are interested in and skip other content.

Example
A successful Web site has the information that users are seeking and is presented in a way that makes sense to them. Thoughtful selection, logical organization, and clear and visual writing are critical components of a usable Web site. Reading online is different than reading print materials. Typically web users scan the site looking for relevant words that match the information they are seeking. Since we know that the majority of users scan the page content, we should write in a style that accommodates that behavior. Large masses of text are overwhelming for users with short attention spans.

You will want to use a technique called chunking. Chunking is nothing more than breaking your text into manageable sections. These techniques will help you to chunk your information and write visually: Write short sentences; limit paragraphs to two-three sentences; use bulleted and numbered lists; use tables to make complex information easier to understand; use pictures, images, diagrams or illustrations representative of the ideas expressed in the content; use headings and sub-headings; add a table of contents at the top of the page and hyperlink the categories to the related content on the page; use white space to separate chunks of information.

Clear writing is simple and direct and makes you want to read more. It uses short sentences and words that are easy to understand. Use these techniques to write more clearly: present the main or essential message first; cut out words and watch for prepositions (e.g., “of”, “to”, “on”) because they often mark phrases you can reduce to one or two words; keep paragraphs and sentences short; use words that are familiar to your readers; give examples because users love examples and will often read them instead of the text.

The Fix
So let’s see what we can do to the above section to make it more readable.

  • We are going to add a ‘Topics on this Page’ (like a page index) and hyperlink it to the sections. Users can quickly scan the topics and go directly to the one(s) of interest.
  • We are going to add headers to 'chunk' the information (i.e., organize it by topics into sections)
  • We are going to add 'Back to Top' links so that the user can quickly return to the top of the page without scrolling.

Writing for the Web

Topics on this Page:

  • Introduction
  • How Users Read
  • Chunking Information
  • Clear Wrting

Introduction
A successful Web site has the information that users are seeking and is presented in a way that makes sense to them. Thoughtful selection, logical organization, and clear and visual writing are critical components of a usable Web site. Reading online is different than reading print materials. How Users Read Typically web users scan the site looking for relevant words that match the information they are seeking. Since we know that the majority of users scan the page content, we should write in a style that accommodates that behavior. Large masses of text are overwhelming for users with short attention spans.

Chunking Information
You will want to use a technique called chunking. Chunking is nothing more than breaking your text into manageable sections. These techniques will help you to chunk your information and write visually:

  • Write short sentences and limit paragraphs to two-three sentences.
  • Use bulleted and number lists
  • Use tables to make complex information easier to understand.
  • Use
  • bulleted and numbered lists.
  • Use tables to make complex information easier to understand.
  • Use pictures, images, diagrams or illustrations representative of the ideas expressed in the content.
  • Use headings and sub-headings.
  • Add a table of contents at the top of the page and hyperlink the categories to the related content on the page Use white space to separate chunks of information.
  • Add a back to top link to long scrolling pages.

Clear Writing
Clear writing is simple and direct and makes you want to read more. It uses short sentences and words that are easy to understand. Use these techniques to write more clearly:

  • Present the main or essential message first
  • Cut out words and watch for prepositions (e.g., “of”, “to”, “on”) because they often mark phrases you can reduce to one or two words
  • Keep paragraphs and sentences short
  • Use words that are familiar to your readers
  • Give examples because users love examples and will often read them instead of the text

Back to Top

By adding a few easy techniques we have made this content a lot easier to scan and read. Try these techniques for long pages that look like a wall of words.

Author Bio
Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and the usability.gov Web site at the U.S. Department of Health & Human Services.

Posted on March 25, 2010 at 02:23 PM | Permalink | Comments (1) | TrackBack (0)

The Usability of Everyday Things

I think sometime during our lives even the smartest among us have felt inept because we have failed to figure out even the simplest things - whether to push, pull, or slide a door.  In Donald Norman's book The Design of Everyday Things, he talks about how and why some products satisfy customers while others only frustrate them. 

It is Spring in the Nation's Capitol and that means turning the clocks ahead. Well for some reason I have a lot of watches and thank goodness only one car. Most of the watches just have a knob that I turn. But the latest addition to my watch collection was a real challenge and I vowed I would wait until fall when the time would be correct. I will admit I had to break down and read the rather confusing instructions. After 20 minutes I was able to turn the clock ahead but now it beeps at every hour.

Speaking of my car. Unfortunately, we had an interaction with a rather large deer and now I am driving a rental car. No one at the rental office showed me anything in the car and I thought how hard can it be? Unfortunately it isn't at all like my car and I still haven't figured out how to open the trunk without using the ignition key.

Spring means rain and when it rains I ride the Metro (subway system) to work rather than walk. Apparently the Metro purchased some new trains in the last couple of months. I happened upon one of those new cars and was amazed at how open the design was. Unfortunately if you are short and you have to stand you will have a major problem in that large open space. I am 5'7" tall and I can almost comfortably hang onto the bar above my head. If you have ever ridden our metro, you will understand that it isn't exactly the smoothest of rides. But I managed to hang on and not take anyone else out during that ride.

I recently purchased a golf GPS handheld device. Charging it was simple when I figured out how to get the plug open. The problems really started when I tried to register the device. I thought I could simply go to the Web site and enter the number on the device into the proper field. Not so fast! I had to download an executable app that launched a browser window. Now that was pretty neat because I didn't have to enter the device code because it was going to recognize it for me. But what it launched instead was my Dreamweaver app and javascript code. 

These are just every day things that I interact with and yet I cannot begin to tell you how frustrated I was with the simplest of actions - changing the time on my watch. Okay and really, a handheld golf GPS, I guess if you own one, you may not want to admit it (and no, it doesn't find my ball for me). But other things like the hand bars on a metro or the knobs and dials on a vehicle interface are a bit more serious. So look around and think about all the every day things you interact with and frustrate you - it's the design not you!

Authors Bio

Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and the usability.gov Web site at the U.S. Department of Health & Human Services.

 

 


Posted on March 17, 2010 at 10:39 AM | Permalink | Comments (1) | TrackBack (0)

Navigation and Its Role in the Information Architecture

Navigation and the Role it Plays in the Information Architecture

I thought it might be a good idea to review the role or function of the navigation menu as it relates to a Web site’s information architecture (IA). I have seen Web sites that don’t create a clear relationship between the navigation and the IA.

 

The navigation menu is a result of the Web site’s information architecture (IA). The IA represents how you categorized your site’s content. An analogy that may make sense to all of us is the structure of a house.

 

The rooms in your house are (hopefully) structured some way that makes sense.  Except for closets or master baths, most rooms are accessible from some main hallway. You don’t have to find the room that has the only entrance to another room in the house. Or you don’t find a room because you happened on a hidden doorway in another room to this room you had not idea even existed.

What the Navigation Is

The navigation menu is the map of your content. The navigation menu informs the user of what types of content your site has to offer. It helps them to find the content they want to find. Well designed and labeled navigation menus must represent your user’s mental model. So clearly navigation/category labels are important.  

What the Navigation Menu Isn’t

The major issues I see on sites are the following:

· Navigation menus that link to other web sites. The navigation menu should never lead to another Web site. Again, it is the content of your web site and not someone else’s site.

· Floating pages that are not anchored to a navigation category. There should never be any floating pages and all pages must be included in a content category.

· Site designs that drive the navigation menu. The navigation menu schema should drive the site design. Just because you want to use horizontal tabs doesn’t mean you should when another schema works better.

· Segmented web sites. Site segmentation by user type makes it difficult for the user to identify what content is in that category. Labeling a category for Medical Professionals doesn’t inform the user about the content. It is often much better to segment your category page than your navigation.

 

Creating an IA and resulting navigation menu is the most important piece of your Web site. Certainly I am not negating the importance of an aesthetic design. However, having a visually appealing site that has poor navigation, results in poor usability and frustrated users.  

Posted on March 01, 2010 at 09:15 AM | Permalink | Comments (0) | TrackBack (0)

Form Field Alignment

Lately I have noticed a change in the alignment of labels to their corresponding field on a form. In the past, fields typically were left aligned to the form edge. This was considered a standard or minimally good practice. The latest trend seems to be the right alignment of the label to the field resulting in a jagged edge.

Right aligning the label certainly makes it easier to keep it adjacent to the input field. This typically occurs when the labels are long. You don’t have to be concerned about the length of the labels for any of the fields. As a result your labels are easier to tightly align to the fields. There won’t be a large gap between the two as compared to left alignment.

But that isn’t an excuse to have long field labels. Clear, concise field labels are important especially for user comprehension. And right aligning the field label to the input field makes it difficult for users to quickly scan the fields and find the required fields. This alignment design also causes visual fatigue.

Left aligning fields to the form requires you to create short, concise labels. But it also makes it easier for users to quickly scan the form and identify the required fields. It may require a bigger effort to create short field labels that make sense to the user but in the end it is the best choice.

Jagged edge

I thought it would be nice to see an example of both left and right aligned labels on the same form and the visual path that each requires. The following image shows the field labels right aligned and adjacent to the input fields. Notice the ragged edge of the user’s visual flow pattern. Another issue is the required field mark is also right aligned to the fields and it is difficult to scan the form and decide which fields are required. The Submit button is also left aligned to the bottom of the form and that isn’t the last place the user looks.

 Left aligned fields

Above is the same form with the fields left aligned to the form edge rather than right aligned to the field. Note the straight visual track and how much easier it is to quickly scan the form for the required fields. The Submit button is aligned to the right at the bottom because that is the last place the user will look and right under the last field they need to complete.

 If you are considering right aligning the fields because of long field labels, then you should reconsider. Try renaming your field labels if it is driving the gap between the label and the corresponding field. Long field labels can overwhelm the user. If it appears that the label is confusing, add an example (as shown above) to the end of the field.  Following this standard will improve the usability of your forms. 

Author's Bio

Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and Usability.gov at the U.S. Department of Health & Human Services.


Posted on February 16, 2010 at 03:23 PM | Permalink | Comments (3) | TrackBack (0)

The Picture Says It All or Does It Say Too Much

I am sure that we have all seen Web sites that use images to benefit the user experience and of course a lot that don’t. Graphics often help when they improve the user’s experience but sometimes images just take up space and lead to more confusion.

 

Jared Spool and associates have classified graphics into three types: navigation graphics, content graphics, and ornamental graphics. He believes that well-done navigation and content graphics contribute to the user’s experience; unfortunately it is a lot harder to see the value of ornamental graphics. 

 

Navigation Graphics

So what is a Navigation graphic? Well it is probably easier to give a visual example then try to explain what it is. Let’s say you go to one of the online electronics retailers and you want to purchase a digital camera. If the link was labeled sleek and slim or Digital SLR, you may be confused about what camera you are interested in viewing. But if I were to add an image example of what a sleek and slim or Digital SLR with the link, it would help you to narrow down the camera selection.

 

Content Graphics

Content graphics provide additional information to a written description. So let’s say I want to sell my 100 year old Victorian row home located on Capitol Hill. I could write a nice description of the house and describe the large kitchen and the landscaped back yard. But how appealing is that? You would get a better idea of both the descriptions if I included nice pictures of the house and yard.

You may have some specific questions about the location of my house. You may want to know where exactly is it located on Capitol Hill and what is it close to. Can you walk to the metro? So if I were to provide a nice map showing the location of my house and the closest metros, stores, or points of interest, it would provide a better idea of the location then just the address.

 

Ornamental Graphics

Ornamental graphics are images on a page that help to break up the density of the text. These graphics are often used to make the site appear more professional, friendly, or fun. You are probably familiar with these graphics. Let’s say you go to a Web site that offers loans and you see a group of people smiling and shaking hands. It really doesn’t tell you anything about the interest rate or help you calculate your monthly payments. Does it make you feel better about dealing with this company because of the happy people?

 

Picture This – Other Options

Graphics are not inexpensive so they come at a cost whether you buy them from an image company or have a graphic artist create them for your site. Navigation graphics often help users find the items they are looking for better than the just the text alone. Content graphics supplement item descriptions. If you are using ornamental graphics to break up text density, there are cheaper ways to accomplish that task and help the user find the information they are looking for (e.g., headers and sub-headers to help chunk the information into meaningful pieces). Don’t overburden you pages with images that don’t provide any additional information or purpose.

 

Author's Bio

Susanne Furman has been a usability engineer for almost a decade. She earned a Ph.D. in Applied Experimental Psychology, Human Factors from George Mason University. She manages the usability program and Usability.gov at the U.S. Department of Health & Human Services.

Posted on January 08, 2010 at 10:31 AM | Permalink | Comments (0) | TrackBack (0)

Next »
Logo

About this Blog

Comment Policy

Comments submitted after hours or on weekends will be posted as early as possible the next business day

Frequently Asked Questions

Join the conversation by visiting the Comment section at the end of any post.

Recent Posts

  • Design & The Importance of Context
  • Survey Respondent Behavior and Satisficing
  • More About Mental Models
  • Mental Models
  • The Owner’s Manual is Everything
  • Text-Laden Pages
  • The Usability of Everyday Things
  • Navigation and Its Role in the Information Architecture
  • Form Field Alignment
  • The Picture Says It All or Does It Say Too Much

Archives

  • July 2010
  • June 2010
  • May 2010
  • April 2010
  • March 2010
  • February 2010
  • January 2010
  • December 2009
  • November 2009
  • October 2009

Categories

  • Design
Subscribe to this blog's feed

Usability.gov | Accessibility | Privacy Policy | USA.gov

This is an official U.S. Government Web site managed by the U.S. Department of Health & Human Services.