Practical Information Design Tips
| |
Working through the prototyping process requires us to implement our information design skills. Keeping information design principals in mind will help us to sharpen our skills and evaluate a prototype. The following practical tips provide specific help for working through the common information design aspects of websites.
The fist step in evaluating a prototype is to review the overall organization and categorization of its contents. There is a tendency for people working within a company to categorize their content according to internal company structures. These internal conventions for organizing information are not always intuitive and can confuse people from outside the company. Therefore it is helpful to have a fresh, neutral frame of mind when organizing a prototype. We can protect ourselves from making organizational assumptions by stepping back and considering the different ways content can be grouped. Nathan Shedroff points out that there are basically six ways that information can be organized: alphabetically, numerically, by time, by location, by category, or randomly. Reviewing how we have organized and grouped the content in a prototype can help us be more objective, thus ensuring that a site's structure will be clear to others.
Another aspect of organization and categorization is labeling. Once the overall grouping and categorization of the prototype has been settled, the names given to each section and page must be examined. When naming sections or pages, brevity is important. Clarity is also important. Generally speaking, the best labels are those with the shortest names that still clearly identify the content.
Maintaining a consistent navigational structure is one of the keys to making a website easy to use. A navigation system should be established right from the start of a project. In some cases, a home page will use a slightly different layout from the rest of a site and the navigation system might be displayed differently on it. If this is the case, the rest of the site should maintain a consistent navigation system. The main navigation should always appear in the same place on all pages.
The main navigation of a typical site is made up of the main sections and what are sometimes referred to as "site utilities." Main sections are the primary categories for a site. "About us," "Products," "What's New," and "Services" are examples of main categories. These are usually specific to each company and will include any number of sub pages. Site utilities are generally pages that are common to almost every website such as "contact us," "search," "site map," and "home." Site utilities can often be displayed as icons rather than being listed among the main sections.
In addition to maintaining a consistent main navigation bar, we recommend creating a consistently located sub navigation system. Sub navigation makes it easy for a user to toggle between pages within a main section. It also helps a visitor to know where they are in a site at all times. A navigation system should clearly identify and distinguish main sections (first tier), sub sections (second tier), and third tier pages. Indenting, changing color, or changing size can help distinguish between these navigation levels.
Drop down menus make for efficient site navigation, but they do create some interface problems that need to be carefully considered.
DHTML drop down menus are useful because they dynamically display the contents of main and sub sections as a mouse rolls over the navigation bar. A visitor can click on any of the sub links and go straight to a specific page. Drop down menus simplify site navigation. They also remove the need for site maps, since the navigation system itself acts as a dynamic site map.
"Drop down menus" are a useful devise for displaying and linking sub sections (more on this later). For download and speed considerations, graphics can be used for the main section navigation bar, but HTML text should be used for the sub page navigation.
When using drop down menus, visitors tend to "skip over" main section pages, also referred to as a "landing pages." For example, when a mouse moves over an "About Us" section, several sub pages will be dynamically presented. A visitor will usually click directly to one of these sub pages, bypassing the content on the "About Us" page. If there is important content on theses pages, it will typically not be seen. There are a couple of techniques to address this drop down menu dynamic. One is to add a duplicate of the main section pages in its sub page list. For example, one of the sub choices under the "About Us" main section could also be called "About Us" and link to the same page. While this technique does not require a visitor to hit the main section page, it does increase the likelihood that they will see its contents.
The other technique is to make sure that no critical information is placed on main landing pages. Instead they should contain simply short descriptions of the content in the main section with links to each sub page. These kinds of main section pages act as a glorified table of contents pages. In the event that the visitor skips over these landing pages, they will not have missed any critical information.
Searching offers some powerful tools that can make sites easier to use. Search capabilities never replace the need for consistent site organization. In fact, using site search tools opens up other information design considerations.
Search engines can sift through vast amounts of information almost instantaneously. When a site contains a significant amount of content, a search is often the best way to locate specific content. The depth of information to be searched is a factor in determining if a search function is appropriate and how it should be implemented. For example, it would not be very helpful to search a nationwide retail store finder that contains 200 stores by street address or zip code. More likely than not, the search would not find any records. Whereas searching by address or zip code could be very useful if a store locator has thousands of records.
Having too many criteria to search, compared to the number of database records will also result in failed searches. For example, a car database could be searched by the model, year, color, transmission, options, and mileage. The more search criteria presented, the more those criteria can be combined, and the fewer results will be found. If the range of search criteria is too broad for the number of vehicles in a database, the user will be frustrated by "not found" results. Reducing the criteria, or restricting the combination of criteria, would make the search more useful.
Another consideration when using a search is whether to allow Boolean (and, or) operators. "And/or" options allow a user to enter multiple keywords and choose whether the results should contain any of the words in the query, or records with all the terms in the query. Again, one should take into account the depth of content so that an "and" operator will narrow results rather than eliminate them.
When a search engine finds results from a search query, it needs to know how to present the results to the user. They should be ranked in some order. Search engine ranking is often based on the number of occurrences of the search term. However, other factors can be added to this ranking system: how recent is the information, how popular is the content, what is the title of the document, etc. Such factors need to be considered in how a search engine determines relevance when listing results.
Establishing site categories
The fist step in evaluating a prototype is to review the overall organization and categorization of its contents. There is a tendency for people working within a company to categorize their content according to internal company structures. These internal conventions for organizing information are not always intuitive and can confuse people from outside the company. Therefore it is helpful to have a fresh, neutral frame of mind when organizing a prototype. We can protect ourselves from making organizational assumptions by stepping back and considering the different ways content can be grouped. Nathan Shedroff points out that there are basically six ways that information can be organized: alphabetically, numerically, by time, by location, by category, or randomly. Reviewing how we have organized and grouped the content in a prototype can help us be more objective, thus ensuring that a site's structure will be clear to others.
Labeling
Another aspect of organization and categorization is labeling. Once the overall grouping and categorization of the prototype has been settled, the names given to each section and page must be examined. When naming sections or pages, brevity is important. Clarity is also important. Generally speaking, the best labels are those with the shortest names that still clearly identify the content.
Navigation systems
Maintaining a consistent navigational structure is one of the keys to making a website easy to use. A navigation system should be established right from the start of a project. In some cases, a home page will use a slightly different layout from the rest of a site and the navigation system might be displayed differently on it. If this is the case, the rest of the site should maintain a consistent navigation system. The main navigation should always appear in the same place on all pages.
The main navigation of a typical site is made up of the main sections and what are sometimes referred to as "site utilities." Main sections are the primary categories for a site. "About us," "Products," "What's New," and "Services" are examples of main categories. These are usually specific to each company and will include any number of sub pages. Site utilities are generally pages that are common to almost every website such as "contact us," "search," "site map," and "home." Site utilities can often be displayed as icons rather than being listed among the main sections.
In addition to maintaining a consistent main navigation bar, we recommend creating a consistently located sub navigation system. Sub navigation makes it easy for a user to toggle between pages within a main section. It also helps a visitor to know where they are in a site at all times. A navigation system should clearly identify and distinguish main sections (first tier), sub sections (second tier), and third tier pages. Indenting, changing color, or changing size can help distinguish between these navigation levels.
Drop down menus make for efficient site navigation, but they do create some interface problems that need to be carefully considered.
DHTML drop down menus
DHTML drop down menus are useful because they dynamically display the contents of main and sub sections as a mouse rolls over the navigation bar. A visitor can click on any of the sub links and go straight to a specific page. Drop down menus simplify site navigation. They also remove the need for site maps, since the navigation system itself acts as a dynamic site map.
"Drop down menus" are a useful devise for displaying and linking sub sections (more on this later). For download and speed considerations, graphics can be used for the main section navigation bar, but HTML text should be used for the sub page navigation.
A caution when using drop down menus
When using drop down menus, visitors tend to "skip over" main section pages, also referred to as a "landing pages." For example, when a mouse moves over an "About Us" section, several sub pages will be dynamically presented. A visitor will usually click directly to one of these sub pages, bypassing the content on the "About Us" page. If there is important content on theses pages, it will typically not be seen. There are a couple of techniques to address this drop down menu dynamic. One is to add a duplicate of the main section pages in its sub page list. For example, one of the sub choices under the "About Us" main section could also be called "About Us" and link to the same page. While this technique does not require a visitor to hit the main section page, it does increase the likelihood that they will see its contents.
The other technique is to make sure that no critical information is placed on main landing pages. Instead they should contain simply short descriptions of the content in the main section with links to each sub page. These kinds of main section pages act as a glorified table of contents pages. In the event that the visitor skips over these landing pages, they will not have missed any critical information.
Searching a site
Searching offers some powerful tools that can make sites easier to use. Search capabilities never replace the need for consistent site organization. In fact, using site search tools opens up other information design considerations.
Determining the usefulness of a search
Search engines can sift through vast amounts of information almost instantaneously. When a site contains a significant amount of content, a search is often the best way to locate specific content. The depth of information to be searched is a factor in determining if a search function is appropriate and how it should be implemented. For example, it would not be very helpful to search a nationwide retail store finder that contains 200 stores by street address or zip code. More likely than not, the search would not find any records. Whereas searching by address or zip code could be very useful if a store locator has thousands of records.
Searching with too many criteria
Having too many criteria to search, compared to the number of database records will also result in failed searches. For example, a car database could be searched by the model, year, color, transmission, options, and mileage. The more search criteria presented, the more those criteria can be combined, and the fewer results will be found. If the range of search criteria is too broad for the number of vehicles in a database, the user will be frustrated by "not found" results. Reducing the criteria, or restricting the combination of criteria, would make the search more useful.
Boolean operators
Another consideration when using a search is whether to allow Boolean (and, or) operators. "And/or" options allow a user to enter multiple keywords and choose whether the results should contain any of the words in the query, or records with all the terms in the query. Again, one should take into account the depth of content so that an "and" operator will narrow results rather than eliminate them.
Ranking search engine results:
When a search engine finds results from a search query, it needs to know how to present the results to the user. They should be ranked in some order. Search engine ranking is often based on the number of occurrences of the search term. However, other factors can be added to this ranking system: how recent is the information, how popular is the content, what is the title of the document, etc. Such factors need to be considered in how a search engine determines relevance when listing results.
| |
Comments 
|
|
July 14, 2009 3:55 PM Good point, that with dropdrop menus visitors often miss the main category of the menu. Great tips to fix that. |











