Web Site Information Architecture: Planning and Designing Information Collections for the Web

July 8-12, 2002

Instructor

Paul Kahn, Information Architecture Consultant, Paris, France

Overview

This workshop will focus on three themes: analyzing Web site structure, design principles for the computer screen, and the team required to create and sustain a successful Web site. We will introduce basic concepts of information architecture for planning and building public Web sites. Participants will learn how to analyze an existing site, and plan new or revised sites. We will examine visualization techniques for mapping Web sites and review principles of information design, typography, multimedia, and legibility as they apply to effective presentation on the computer screen. Assignments will include development of simple and complex Web sites. Participants are encouraged to bring their own projects for use in the assignments.

Target audience

This workshop is intended for people actively involved in the planning, building, and maintaining of public web sites. Technical and graphic design skills, as well as previous experience with web sites is a definite plus, but not a requirement.

Full outline

Day One, Session 1
Lecture: Defining the problems
This lecture will develop an understanding of the principles of information architecture for the web. The instructor will present a series of information architecture problems common to all web sites. Examples will be drawn from current web sites, presented as examples of how these problems are solved. Emphasis will be on the common problems and the variety of solutions.

The communications model

What is the purpose of the web site?

How should items (nodes) be related (linked)?

Can the content be divided into sections?

Where should items be located in the hierarchy or network?

What are the global requirements for the entire collection?

What are the local navigation requirements at each level?

How do you use it - how will the user interact with it?

How will the user read the page?

What can we present to the user on the web that cannot be done as well in any other medium?

Day One, Session 2
Workshop: Analyzing and planning web sites
This workshop will develop a greater understanding of how to apply information architecture techniques to the redesign of existing web sites and the planning of new projects.

Summary of visualization techniques
The instructor will present a variety of visualization techniques including isometric diagrams and flow charts. Methods for indicating global and local navigation structures, page types, static and dynamic pages, and interaction with applications and databases will be described.

Mapping a web site
Students will select a familiar web site. Students will diagram the structure of the web site, individually or in small groups. The purpose of the diagram will be to explain the content and scope of the web site to the workshop.

Day Two, Session 3
Planning a web site
Student, working in groups of 2-3, will be asked to develop the plan for a new web site. The specifications for each site will be explained to the group, and each team will develop their own solutions, captured in a planning diagrams. The final architecture will be presented to the group. Members of the group will be assigned client roles for each critique: head of marketing, chief technology officer, editorial manager. The purpose of the critique will be to develop greater understanding of the planning process and the mediation of conflicting goals within an organization, leading to a successful information architecture.

Day Two, Session 4
Lecture: Design for the computer screen
This lecture will develop an understanding of the principles of designing for the computer screen. Emphasis will be on the visual principles of two-dimensional design drawn from all forms of graphic arts, as they apply to screen design. Examples will be drawn from a combination of fine arts, graphic arts, and contemporary web pages. The purpose of the lecture is to raise participants awareness of what web designers can learn from fine arts, book, and publication design traditions.

A. Polarity of representation and abstraction

creating an image not on the surface of the screen but in the mind of the viewer

B. Presenting information in two-dimensional space

common variables: position, size, symbol, color

windows and frames

C. Type

typeface, legibility, and line

positive and negative space

contrast, color, and size

choreography of moving type

D. Sound

reinforcing interaction

providing narrative

adding audio information

E. Reading the page

controlling the viewer's experience

layering information

identifying active areas

highlighting context and location

Day Three, Session 5
Workshop: Designing web sites
This workshop will increase the understanding of participants as to how well visual design supports the goal of a web site and the intended user experience.

Restaurant Finder assignment
Participants will be given a list of restaurants in Providence, Rhode Island. Information will be provided on what meals are serves (breakfast, lunch, dinner) and relative cost (cheap, moderate, expensive). Working in teams of 2-3, participants must design web site that allows the user to choose a restaurant by meal and cost.
Critique of participants web sites

Day Four, Session 6
Workshop (continued)
Participants will be asked to present a web site of their choice, and critique the visual design in light of the principles described in the previous lecture. Participants will be encouraged, but not required, to use a web site from their own organization. Emphasis of the critique will be on how well the visual design supports the goal of the web site and the intended user experience.

Suggestions for revision of participants web sites
A group of web sites previously critiqued will be selected, and assigned to teams of 2-3 participants. Each team will develop suggestions for how to revise the visual design of the web site to improve the user experience.

Learning objectives overall and for each session

Participants will learn how to analyze, visualize, and plan web sites. They will gain a greater understanding of how to design navigation systems. They will learn how to apply principles of publication design to the creation of effective design for the computer screen.

Suggested readings/activities for registrants prior to workshop

Information Architecture for the World Wide Web by Louis Rosenfeld and Peter Morville (O'Reilly)
Mapping Web Sites by Paul Kahn and Krzysztof Lenk (Rotovision)
Moving Type: Designing for Space and Time by Matt Woolman and Jeff Bellantoni (Rotovision)

Any technical requirements beyond those provided

Most assignments will be done on paper. Large pads, colored markers, and something to stick the pages on a wall for review will be required. Common web editing tools such as Photoshop, BBedit, and Fireworks can be used by participants who are familiar with these programs. There are no software requirements other than a web browser. Plug-ins for Flash, RealPlayer and Quicktime are required.