navigation and menus will oakley information architecture and design i october 5, 2006
DESCRIPTION
What is Navigation? Navigation: n 1. The act or process of navigating. 2. The art or science of plotting, ascertaining, or directing the course of a ship, aircraft, spacecraft, etc. –Random House Webster’s College DictionaryTRANSCRIPT
Navigation and Menus
Will OakleyInformation Architecture and
Design IOctober 5, 2006
What are we going to cover?
The reasons for having strong navigation systemsEmbedded Navigation SystemThe Browser: Your Navigation Pal!Supplemental Navigation SystemsNavigation Dos and Don’ts
What is Navigation?
Navigation: n 1. The act or process of navigating. 2. The art or science of plotting, ascertaining, or directing the course of a ship, aircraft, spacecraft, etc.
– Random House Webster’s College Dictionary
What is Navigation?
“Knowing your [rear end] from a hole in the ground.”
– My Mom (quote edited for content)
What is Navigation?
“Knowing your [rear end] from a hole in the ground.”
– My Mom (quote edited for content)
“…and being able to move the former to the latter without getting lost.”
What’s the fuss?
Navigation on the Web must contend with problems that don’t exist in the physical world:
• No sense of scale• No sense of direction• No sense of location
– Krug 57
Lost in HyperspaceKrug speculates that without physical clues, Web users are constantly having to reorientate themselves.“Navigation isn’t just a feature of a Web site; it is the Web site, in the same way that the building, the shelves, and the cash registers are Sears. Without it, there’s no there there.”
– Krug 59
How Navigation Serves the User
Tells us where we arePoints us toward what we’re looking forGives the sense of being groundedIt informs us of what is availableProvides clues on how to use the siteGives users confidence in site creators
– Krug 59-60
Will’s Obligatory Wife Story
Kate is a freelance educational writer and editor.Wanted to learn more about a company before applyingSo she visited www.allenresources.com
Kate’s user experience
FrustrationLack of confidence in site creators, even to the point that initially questioned the website and company’s legitimacy.
What went wrong?
Allen Resources didn’t observe many Web navigation conventions.
Navigation Conventions
The three embedded navigation systems
• Global• Local• Contextual
– Rosenfeld and Morville 107
Global Navigation SystemsIntended to be on every page of a site, with possible exception of the homepage. (Rosenfeld & Morville 113)
Krug lists five things that global navigation systems should have• Site ID• A home button• Sections• Search• Utilities (i.e. help, about us, etc.) (62)
from www.amazon.com
from www.1up.com
Local NavigationEnables browsing in a particular section of a siteOften times global and local systems are integrated into one system, with the local navigation is expanded when that particular section is entered.
From www.texassports.com
Contextual Navigation
Links that exist for a particular page that are outside of the local and global systems.Examples:
• See also• Related Topics
Overuse=clutter
From www.1up.com
The Browser
The Browser Buttons are a web constant for users.
King of the Browser Buttons!
Krug says 30-40% of all web clicks are on the back button. (58)Tauscher and Greenberg’s study shows that there is a 39% chance that the next site a person views will be among the last six sites they’ve viewed. (401)The morale of the this: don’t disable the back button.
Supplemental Navigation
Four main types according to Rosenfeld and Morville (121)
• Sitemaps• Site Indexes• Guides• Search
I’d like to add one more from Krug (75)• Breadcrumbs
search
breadcrumbs
Site mapFrom www.lowes.com
Site indexFrom www.imf.org
Guide from www.myspace.com
Advanced Navigation
Personalization• Attempts to anticipate user’s need
Customization• Allows user control over some elements of
page presentation
Social Navigation• Attempts to anticipate user’s need by
comparing it to the actions of others– Rosenfeld and Morville 127-129
Web Dos and Don’ts
Don’t disable the back buttonDon’t disable bookmarkingDon’t fool around with the color of visited/unvisited links
– Rosenfeld and Morville 109
Web Dos and Don’ts
Put your site ID in the upper left corner and make sure it looks like an IDMake the site ID also a home buttonTabs are great but they don’t scale well
– Krug (64-81)
Frames
=
ResourcesKrug, S. (2000). Don’t make me think! A common sense approach to
Web usability. Indianapolis: New Riders.Nielsen, J. & Tahir, M. (2002). Homepage usability: 50 websites
deconstructed. Indianapolis: New Riders.Rosenfeld, L. & Morville, P. (2002). Information architecture for the
World Wide Web. 2nd ed. Sebastopol: O’Reilly.Tauscher, L. M., & Greenberg, S. (1997). Revisitation patterns in World
Wide Web navigation. ACM SIGCHI '97, Atlanta, Georgia, March 22-27, 1997. Atlanta, GA: ACM. 399-406