Celestial Graphics Web Site Design Agency Celestial Graphics Web Site Design Agency Celestial Graphics Web Site Design Agency Celestial Graphics Web Site Design Agency Celestial Graphics Web Site Design Agency Celestial Graphics Web Site Design Agency
Celestial Graphics Web Site Design Agency
Celestial Graphics Web Site Design Agency
Format this page for print   Back to Regular Version of This Article 

Web Site Design Usability

Home > Articles > Web Design Usability -- Printer Friendly Version


Introduction

Remember the last time you visited a web site seeking information about a product or service only to leave in frustration because the site was confusing or difficult to navigate? Unfortunately, this is a very common experience. It is not uncommon for people to abandon their shopping carts or bolt from a web site after being stifled by an inconsistent and confusing user interface. Creating a good user experience can mean the difference between success and failure. This article will explore what it takes to create a highly usable web site.


Keep it Simple!

Simplicity is perhaps the cornerstone of web design usability. This means everything on your web site should be easy to access and obvious. We cannot over emphasize this!  Visitors to your site will not have the patience to figure out how to navigate your site or get the information they want. If it is not obvious or easily accessible, they will go elsewhere. Here are a few web design usability guidelines for keeping things simple:

Your web site should be self-explanatory.
To quote Steve Krug from the title of his excellent book on usability: "Don’t Make Me Think".

The User Should Be In Control at All Times.
This is an extremely important principle. Visitors to your web site should be treated like honored guests. Do not impose on them. Stay focused on what is important by keeping your web site design clean and simple. This means you should not force them view pop-up windows with advertisements or to listen to background music or wait through a Flash animation because you think its cool. Respect their time and their intelligence.

Your web site should be fast loading.
Do not over burden the main pages of your site with bloated graphics or animation that make your site slow loading. Most visitors are willing to wait 8 to 10 seconds for a page to load. Frustration levels will quickly rise if every page takes a minute or more to load.

Create a Consistent User Experience.
Keep the user interface as consistent as possible from page to page.

Consistent Navigation

Navigation is a very important element of web site design usability. Most people come to a web sites looking for specific information or a specific topic. One mistake that many web site designers make is to assume that a visitor to the web site will look at the entire page before they figure out where they want to go next. Another misconception is that the visitor to the web site will enter the site at the home page and navigate through the site is some orderly fashion. Actually, the visitor to your web site may enter it from almost any page. In addition, they generally navigate the site, not by reading the entire page, but instead by scanning the page and clicking on the first link that seems like it may lead to the information they are interested in.  

Here are few key points to keep in mind:

Create a consistent site wide navigation area that will appear on every page of the web site.
This area should give the visitor a clear idea of where they are and how the site is organized.
For larger sites, create sub-section navigation area on each page or topic within the area of the web site has its own links. This can be either a sub-section of a traditional navigation bar or sub-menus if the site uses drop-down menus.
Provide search box if your site has large amounts of content. Some users prefer to use a search box to help them focus in on exactly the content they are looking for. For a search box to be effective, your web site needs to be intelligently indexed by keyword.
If you have many off site references for a given topic, it is usually helpful to organize these into their own separate side bar.
Keep the organization of the web site "Wide" rather than "Deep". A web site organized many levels of navigations is a deep site. A web site that has many topics but fewer levels is called a wide site. The figures below show an example of a wide site and a deep site. Studies show that having many levels of navigation creates a difficult to navigate and often frustrating site.  In a wide site, everything on the web site is only one or two clicks away.


"Deep Site"  

"Wide Site"

Focus On Your Customer’s Core Needs

Many web sites fail in usability because they do not understand or anticipate how visitors will use their site. Web sites designed for usability, on the other hand, understand their customers, what they want, how they interact with the web site.

An Example of How to Anticipate Your Core Customer’s Needs

Here is an example of how to increase the usability of your web site by focusing on your core customer needs.  Lets say you have an on-line flower shop. What are the core needs of your customers?

1. Choose the flower arrangements by price and/or appearance.
2. Determine whether your company can deliver to their desired location on time.
3. Determine that you are a reputable company that they can trust.
4. Place the order easily and quickly.

So the first step would be to have your web site design company build an on-line catalog that can be searched by price and type of flower arrangement. You might have delivery search box that allows customers to search by zip code. Next, information about your company, including your address, phone number and guarantee should be immediately accessible. Finally, the order process must be as simple as possible. This means asking only for information absolutely necessary to place the order. It also means making it clear to the customer at the beginning of the order process, exactly what they are ordering, when it will be delivered, and how much it will cost, including shipping.

A Common Mistake: Web Site Design Based on Your Organization Structure Rather than the Needs of Your Customers

One of the most common mistakes made in corporate, governmental or organizational web site designs is to model their web site around their organization structure. This type of web site design is "inward looking". It may make sense to its creators within the organization, but generally will create a frustrating experience for visitors to the site since it does not anticipate or attempt to meet their needs.

An organizationally structured web site is categorized by department or division. Often, each division will create their own web content and may even give their web pages a unique look and feel. This type of web design makes sense to management within the organization. In fact, it may be very appropriate for intranet web sites within an organization. So why is this type of web site design bad for web design usability? Because this type of web site design ignores the needs of your customers. The visitor to your web site will have very specific reasons visiting your site. They see your company or organization in terms of fulfilling those needs.

Here is an example. Say you want to find out how to volunteer for the local county run homeless shelter. You visit your county’s web site and are inundated by a maze of departments and governmental services. So you start to guess which department runs the homeless shelter. The web pages of each department all have a unique navigational structure so finding your way becomes an exercise in futility.

Alternatively, the county’s web site design could be organized around key customer needs. Every page on the county’s web site could contain a common keyword search box as well as a dropdown menu that lists the most popular county services. In addition you could have a site map that lists all county services alphabetically as well as a frequently asked question (FAQ) area that logs and answers all questions that are asked county employees. 

Usability of Content

When we refer to content we are generally talking about information or text. However on a music web site, this could be a combination of text and MP3 or Real Audio files. On an on-line art gallery, this could mean a combination of text and images. Content should be organized in easily digestible chunks.  The visitor to a page in your site will generally decide in less than 30 seconds whether to stay or leave so it is important that your content be easily grasped on a visceral level.

Don’t Assume that Your Content Will Be Accessed Sequentially

If you web site contains multi-page articles, don’t assume that the user will access the pages in sequential order. It’s a good idea to put a small paragraph at the top of each page of the article giving a brief synopsis and links back to the first page of the article. You should always keep in mind that any page on your site may be the first page a visitor to your site may encounter.

Provide Multiple Views on Your Content

Generally, you should split up multi-page articles or content into sections. This speeds up download time. Faster download time improves the overall perception of your web site’s usability. Many people will prefer to print the information of your web site and read it off-line. If you have ever tried to do this, you have probably encountered the frustrated experience of having to print each page on at a time or worse printing the article only to find out that the text on the right hand side has been cut off. You can accommodate these visitors by providing a print view that combines all of the content in your multi-page article into one long page. The print view strips out all of the extraneous information such as banner ads and navigation bars. It also formats the text so that it will print properly on an 8.5 x 11 inch page.

User Friendly Forms

Forms offer a way for you to provide interactive content for your web site visitors. For example, real-estate web site can have a form that allows customers to pre-qualify for a mortgage or calculate monthly payments. Almost all web sites can benefit from a customer feedback form. A user-friendly form has the following characteristics:

The form is self explanatory- the form inherently require little or no instructions.
You should ask for the minimum amount of personal information as possible.
If you need to ask for personal information, then you should provide the web site visitor with a clear and concise privacy policy.
If the form requires any form of credit card payment then you need to run it from a secure server and clearly state this. In addition, you should provide a page that gives the customer feedback as to exactly what they are selecting, and how much it will cost. They should be given the option to submit the form or go back and make corrections.

Creating well-behaved user-friendly multi-page forms requires a great deal of skill on the part of your web site design service. Here are some additional requirements for multi-page forms with high usability:

The customer should never have to fill in the same information twice!
This means that your web site designer needs to know how to create a form that will remember what information you fill in on previous pages of the form.

The form must be well behaved under all circumstances.
For example, you should never get the following message if you hit the back button: "Page Expired Please Reload the Page by Hitting the Refresh Button on Your Browser".

The form should have focus.
Think of a multi-page form like a tunnel where you guide the user through the form, while at the same time providing a clear exit. The first page of the form should have your normal site wide navigation. Subsequent pages should have no extraneous elements (i.e. no banner adds, navigation or links that are not directly related to the form). The only links should be forward or backward through the form, links to instructions and a clearly marked exit.

The form needs to provide clear feedback.
The customer needs to know where they are in process. They should also be shown what information they have filled in so far and have the opportunity to change it.

The Importance of Customer Feedback

No matter how carefully you plan your web site or how much insight you have into the needs of your customers, there will also be room for improvement. Web design usability is a continuous process. Customer feedback is invaluable for improving your site. There are several ways you can provide customer feedback. The simplest is a customer feedback e-mail pop-up box. A better method is a page with a feedback. This has the advantage of being more structured. In addition, have the opportunity of making your web site visitors more at ease by stating your privacy policy. People are more likely to give you their feedback if they know that you will not add their name to a mailing list or sell their name and e-mail address to mass marketers (i.e. "spammers"). Other effective methods of feedback include on-line polls and on-line questioners. If you use on-line polls it is good web etiquette to let the participant see the results of the polls immediately.

Testing for Usability

Testing your web site for usability will flush out many potential problems before your web site is launched. Usability testing is essential for medium sized and larger web sites. Smaller sites can also benefit from simple usability testing. Jakob Nielsen, a well-respected authority on web design usability, recommends usability studies consisting of five participants and conducted over multiple portions of the project (http://www.useit.com/alertbox/20000319.html).  Useful results can also be obtained by studies with only three or four participants. It is more important to test over several stages of the web site design than to have one large web design usability study.  Here is a typical web site design usability test schedule for a medium or large web site:

Test Phase

Number of Participants

What is reviewed

Time per participant

Concept Phase

3 to 5: large site
1 to 3: small or medium site

Concept Images
(JPG or GIF) of the Web Site

1 hr.

End of Initial Design

3 to 5: large or medium site
1 to 3: small site

Page Templates, Basic Site Skeleton, Basic Content

1 hr.

End of Re-design

3 to 5: large or medium site
1 to 3: small site

Working Site

1 hr.

You may optionally perform a usability test of competitor’s web sites at the beginning of the design process in order to develop an understanding of what works for your competitors and what does not.

Each participant in the study is observed separately with a facilitator nearby. The facilitator’s job is act as both guide and observing during the process. It is usually helpful to video tape the participants in order to study their reactions later. The facilitator needs to pay careful attention to what attracts the participant’s attention, how they navigate the web site, and what frustrates them about the web site.

Summary

We hope you have enjoyed this article about web site design usability. Here is a summary of what we covered:

Keep it Simple.
Make your web site design self-explanatory, clean, and fast loading.

Create Clear and Consistent Navigation.
The user should have a clear idea of the where they are in your web site and how to get to where they want to go.

Focus on the Needs of Your Customer.
Create a customer centric web site. Understand how your customer thinks and what they want from your web site.

Display Content in a User Friendly Format.
Present your pages in easily digestible and fast loading chunks. Provide a printer friendly alternate presentation of your web site content.

Create User Friendly Forms.
Create forms that are self-explanatory and do not ask the customer to provide any more personal information than absolutely necessary.

Encourage Customer Feedback.
Let your users help your to provide them with a better web site by soliciting their feedback.

Test for Usability.
Test your web site for usability during all phases of web site development. Testing need not be expensive or complex.



  Format this page for print   Back to Regular Version of This Article 

Home > Articles > Web Design Usability -- Printer Friendly Version
    Copyright ©2001 by Celestial Graphics Inc. All rights reserved.
    Contact us by e-mail at customercare@celestialgraphics.com or contact us by phone at 954-726-8035