Almost all of the notes for this lecture are derived from the book Information Architecture for the World Wide Web: Designing Large-Scale Web Site by Louis Rosenfeld and Peter Morville (1998, O’Reilly & Associates; ISBN 1402874545; Amazon | B&N.com)
Information architecture can loosely be defined as organizing content, especially organizing into classifications, and creating a labeling system for users to follow to search and retrieve such content.
The most common example of information architecture is the Dewey Decimal System found in almost all American public libraries. Books about business plans go under 658, while books on vegetarian cooking go under 641. An index linking these books to their respective topics and numbers is easily found at the reference desk area or, in most cases, online.
The World Wide Web, which contains vastly more content than any one public library, has no Dewey Decimal system. There is no authoritative, trained librarian staff organizing Web sites or pages. Some have tried – the biggest being Yahoo! – but such services index a tiny fraction of what’s out there.
At best, search engines are dumb. Such sites rely on automated robot programs to follow links and index whatever they find. The keyword term “packers” can refer to the NFL team based in Green Bay, job posting for warehouses in need of light industrial help, or any of a dozen other possible interpretations. It’s up to users themselves to come up with the right search phrase like “packers and green bay” to screen results they will find. Even then, some search engines cannot tell the difference between one site with a 1,000-page archive of sports news coverage versus a site posting just a few photos from Packer Pete’s last big tailgating party.
That’s where information architecture comes in – to provide a Web site with a definition. The information architect:
- Clarifies the mission and vision for the site, balancing the needs of its sponsoring organization and the needs of its audiences.
- Determines what content and functionality the site will contain.
- Specifies how users will find information in the site by defining its organization, navigation, labeling and searching systems.
- Maps out how the site will accommodate change and growth over time.
From Rosenfeld and Morville, p. 21:
“As an information architect, you face the daunting challenge of helping others visualize such abstract concepts as a metaphor-based architecture and indexing systems. The information architect has to identify both the goals of the site and the content that it will be built on. This means getting the people who drive the business, whether bosses or clients, to articulate their vision of the site and who its users are. Once you’ve collected the data and developed a plan, you needs to present your ideas for an information architecture and move the group toward consensus. All in all, this significantly burdens the architect to communicate effectively.”
Organizing Web content can be challenging especially since content is heterogeneitic – that is, it’s made up of several unrelated and unlike parts. Web sites often provide access to documents and their components at varying levels of granularity – users can view and/or follow as much or as little details are they want. Also, Web sites typically provide access to documents in multiple formats – financial news, product descriptions, image archives, software files all presented together.
Organizational schemes
Different user needs require different ways to organize. The alphabetical organization of the phone book’s white pages is exact; the topic/task organization of the supermarket is ambiguous.
Exact organizational schemes: Uses well-defined, mutually exclusive sections. Easy to design and maintain; organization is alphabetical, chronological, or geographical.
Ambiguous organization schemes: Categories that defy exact definition: topical, task-orientated (edit/insert/format), audience-specific, metaphor-driven. Consider the Dewey Decimal subject search, where different readers might argue about a book’s core topic.
For example, does A Guide to Britain’s World War I Fighter Biplanes belong under airplanes, military history or British forces of WWI? The main advantage to ambiguous organization is simply that users don’t always know what they are looking for.
Hybrid schemes: Common on the Web, mixing the two systems. Example: News, Business, Sports, Lifestyles – but subsets of these topics might be alphabetized (Baseball, Basketball, Football, Hockey, etc.).
From Rosenfeld and Morville, p. 36:
“In cases where multiple schemes must be presented on one page, you should communicate to designers the importance of retaining the integrity of each scheme. As long as the schemes are presented separately on the page, they will retain the powerful ability to suggest a mental model of users.”
Creating an Information Hierarchy
This is key: Like an outline, a hierarchy makes the broad categories obvious to the user to make decisions on where to go next for more information.
Rules of thumb:
- Hierarchical categories should be mutually exclusive.
- If too many items are cross-linked, the hierarchy loses its value.
- Consider the breadth and depth in your information hierarchy. Breadth refers to the number of options at each level of the hierarchy. Depth refers to the number of levels in the hierarchy.
- The “seven plus-or-minus-two” rule: Limit users’ options to 5 to 9 choices per point of decision. Any less is probably too broad, not enough control; any more is probably too specific, too much decision.
- Do not become trapped by the hierarchical model: consider the non-linear use of hypertext or the set/subset nature of databases.
- Use a controlled vocabulary. Don’t use “Life,” “Living” and “Lifestyles” in the same set since users have no way to understand what the difference between such categories could be.
Designing Navigation Systems
Don’t break the rules users already understand. For example, don’t disable link underlining or default link colors without a good reason.
From Web Site Usability (Andover, MA: User Interface Engineering, 1997):
“Of all the graphic design elements we looked at, the only one that is strongly tied to user success was the use of browser-default link color… . Our theory is that use of the default colors is helpful because users don’t have to relearn every time they go to a new site.”
Miscellaneous navigation aids:
- “You are here” links/labels for context.
- Flexibility through use of hypertext.
- Avoid relying on links within blocks of text; these links can be missed by users scanning the document.
- Provide search in an obviously, easy to use fashion.
- Use redundant browsing models such as tables of contents, indexes, site maps and/or guided tours.
Labeling Systems
Compare the following labeling systems and explain how they differ:
LIST 1:
- Faculty Skunkworks
- Office for Instructional Technology
- K12 PDN Projects Web Page
- Digital Libraries Project
- Office of Technology Management
- Extension Services
- The New Media Center
- Project 1999
- Institutute for Information Technology
- English Composition Board
- Technology Dissemination Office
LIST 2:
- Arts & Humanities
- Business & Employment
- Communication
- Computers & Information Technology
- Education
- Engineering
- Environment
- Government & Law
- Health & Medicine
- Places & Peoples
- Recreation
- Science & Mathematics
- Social Sciences & Social Issues
The first list is unorganized, used vague and redundant terms, and terms meaningless without a context. The second list is clearer, organized and much more focused.
Labels Within Navigation Systems
Some conventions have emerged for navigation system labels:
- Main, Main Page, Home, Home Page
- Search, Find, Browse, Search/Browse, Site Map, Contents, Table of Contents, Index
- Contact, Contact Us, Contact Webmaster, Feedback
- Help, FAQ, Frequently Asked Questions
- News, What’s New
- About, About Us, About (company name), Who We Are
Avoid using the term “info” or “information” as a term – of course the content is information, but how does it fit within users’ other choices?
From Rosenfeld and Morville, p. 83:
“To ensure that you heading labels work well as a system, display the heading labels from each page in your site as a single outline. Look for two characteristics: consistency in terminology and consistency in granularity. Consistent terminology means that the wording used among labels is uniform and cohesive. Consistent granularity means two things: 1) that the chunks of information represented at each level of labels are roughly of equal importance, and 2) that the levels of labels don’t vary greatly in how deeply they cover parts of the site.”
Whenever you create a label, look at the words you are using and try to imagine every possible interpretation of what those words could mean. For example, depending on the context of the Web site, “Lifestyle” could refer to health features, fashions, sexual orientation or all three.
Icons and buttons present an even greater problem. A picture might be worth a thousand words, but are they the correct words? An envelope icon might reasonably lead to something to do with e-mail, or a question mark might mean “help” or “more information,” but what does a spinning star or blinking exclamation point mean? Icons should never be used alone without redundant text labels.
Getting a grasp of the Big Picture
On p. 132, Rosenfeld and Morville offer the following list of questions:
- What are the short- and long-term goals?
- What can you afford?
- Who are the intended audiences?
- Why will people come to your site?
- What types of tasks should users be able to perform?
- What types of content should and should not be part of the site?
“You’ll find that everyone has different answers to these questions. Inevitably, we all bring personal, professional, and departmental biases to the table. The architect is no exception: both the architect and designer have their own biases and ambitions. To avoid wasted work and complications later on, you need to get these out in the open as soon as possible.”