Back to Main Workshop Page

 

Information architecture defines how a Web site organizes its information and how users navigate that information. Web-based products and services are focused principally on the collection and dissemination of information. The design process includes aligning user needs with an effective information architecture.

 

Two dimensions usefully characterize information architectures. First, what is the organizational logic of the site. Second, what type of hierarchical structure organizes the site.

 

Organizational Logic

Most web sites are organized in one of these ways:

 

Exact Lists

Many sites are intended primarily to efficiently provide access to a large number of items or objects. One way to do this is with lists arranged by an exact organizational scheme (e.g., alphabetical, by date, by geography, etc.). For example, one of us (KU) worked on a team last year to create a new syllabus repository for Wharton. It is organized as a list with an exact logic (department, semester, course number, instructor) that can be easily sorted and filtered.

https://syllabi.wharton.upenn.edu

 

Organization by Topic 

The New York Times is focused on information dissemination and organizes that information by topic: US News, International News, Society, Health, Technology, etc.

http://www.nytimes.com

 

Organization by Task

Ponoko is an interesting new company that allows users to design, produce, and sell objects via its services. It organizes its site around these tasks.

http://www.ponoko.com

 

Organization by Tool 

Google organizes its site based upon tools: Search, Gmail, Shopping, News, etc.

http://www.google.com

 

Organization by User Segment

Hewlett-Packard organizes its site largely by user segment.

http://www.hp.com

 

Depending upon the different target users and needs, a single site might integrate several different organizational schemes. Consider, for example, the University of Pennsylvania home page.

http://www.upenn.edu

 

This single site includes an alphabetical scheme (Penn A-Z), a topical scheme (academics, research, etc.), and an audience-based scheme that doubles as a chronological ordering of the stakeholder experience (prospective students, current students, alumni, parents).

 

Hierarchical Structure

How are the elements of a site displayed hierarchically? There are three basic approaches.

1. Broad & flat hierarchies
2. Deep hierarchies
3. Search

 

In a broad & flat scheme, a large number of elements are visible from a single page. For example, The New York Times provides the title stories from all different topics directly on its front page. Some other broad, flat sites are: 

http://www.craigslist.com

https://medley.isc-seo.upenn.edu/penn_portal/u@penn.php 

 

By contrast, many retailers use deep hierarchies to organize the elements of their sites. Consider the furniture retailer Design Within Reach.

http://www.dwr.com (find a dining chair by first clicking on furniture in the navigation bar)

 

Sometimes, the information provided via a web site is so extensive that automated search is the most effective way to access information. The most extreme example of this approach is search engine sites themselves which provide access to all the information on the web. Consider Kayak, whose search interface is the only way to access the information on its site.

http://www.kayak.com

 

Other examples of search as the primary means of accessing information are Amazon and eBay. For both of these sites, we suspect most users access information with search, but they also provide hierarchies of categories for those who may wish to browse.

http://www.amazon.com

http://www.ebay.com

 

Google is somewhat of a hybrid in terms of organizational structure. Google's principal service is search, directly accessible from its home page. Other services, including news and video, require navigating further into the site. Note that although the top level of google.com is organized with a deep hierarchy, parts of the site are quite broad and flat. Click, for example, on "more" on the top of the Google page, and then on "even more" to get a feel for how the scheme changes.

http://www.google.com

 

Task Analysis

People interact with a website to address needs. They have a job to do. In most settings your goal as a designer is to help them do that job better, faster, and at lower cost. There are a few instances in which a commercial website may be designed to guide behavior towards more profitable outcomes, but typically these efforts are short sighted if they frustrate the ability of users to address easily their true needs.

 

Consider the sites you visited today. What needs were you seeking to address?

e.g., Yahoo Weather: What is the current temperature? Will it rain later?

 

Consider the site you are developing. What needs are your target users seeking to address?

• List different segments (or types) of users.
• What tasks are each of these segments trying to complete?

 

In what ways do your objectives as the owner of the site conflict with these objectives?

Are your objectives the same as your users?

 

References

Tidwell, J., Designing Interfaces. (O'Reilly: San Francisco) 2005.

Rosenfeld, L. and P. Morville, Information Architecture for the World Wide Web: Designing Large-Scale Web Sites. (O'Reilly: San Francisco) 2006.

 

These two books are ok. However, most of the big ideas on information architecture have already been summarized on this page. If you want to read some of the material from these books, we've posted these chapters on Webcafe:

• Tidwell, J. "2.1 The Basics of Information Architecture," Designing Interfaces. (O'Reilly: San Francisco) 2005.
• Rosenfeld, L. and P. Morville, "5.3  Organization Schemes," Information Architecture for the World Wide Web:  Designing Large-Scale Web Sites. (O'Reilly:  San Francisco) 2006.
• Tidwell, J. "3.2  The Cost of Navigation," Designing Interfaces.  (O'Reilly: San Francisco) 2005 .

 

If you are interested in further reading, the entire text of both books is available on-line through Safari books.  You have free access to these materials through the University of Pennsylvania libraries.  Search for 'Safari' as an online resource from the library's website.