Chapter 7 Navigation Systems From Information Architecture: Rosenfeld and Moreville

Navigation Systems “Hansel and Gretel - breadcrumbs” (the old fables just keep coming back). You are “here” scenario is very important to let the user feel familiarity. Three embedded navigation systems: –Global –Local –Contextual

Embedded Systems Each type of supplemental navigation system serves a unique purpose and is designed to fit within the broader framework of integrated searching and browsing systems

Gray Matters Navigation design takes us into the gray matter between: IA, interaction design, information design, interface design, visual design and usability. interaction design

Navigation Systems: Context is king! Present the structure of information hierarchy in a clear and consistent manner so the user can build a mental model A few “rules of thumb:” –Where are they? “YOU ARE HERE” (even if they enter through a sub-page) –Always extend the sites: name, logo and graphic identity all throughout the site –Navigation Stress TestNavigation Stress Test 1.Ignore the home page and jump directly into the middle of the site 2.For each random page, can you figure out where you are in relation to the rest of the site? What major section are you in? What tells you that? What is the parent page? 3.Can you tell where the page will lead you next? Are the links descriptive enough to give you a clue what each is about? Is the labeling different enough to help you choose one over another?

Navigation Systems Improving flexibility within your design: –Balance flexibility with the dangers of clutter Lateral Navigation –Jumps across branches Vertical Navigation –Jumps to multiple levels of hierarchy –Example of both Apple website The most common design crimes are: –Cluelessly modifying the visited / unvisited link colors –Killing the back button –Crippling the bookmark feature

Embedded Nav Systems Global (site wide) systems –The single consistent nav element in the site, having a huge impact on usability, most of the time on top of the website

Embedded Nav Systems Local Navigation Systems –Usually left-hand side of the site, referred to as subsites –Usually because areas of content are consistent to a unique navigation approach –Usually means that content is driven by different areas or authors –Large organizations always exhibit this

Embedded Nav Systems Contextual Navigation –Nav links that are specific to a page, document or object, more ad hoc or editorial than actual architectural, –which users could overlook (as the result of quick scans) and could be omitted in an audit or assessment –When used in excess, they add clutter – `

Things to consider… Watch out for frames --- could cripple usability –Slices up pages into individual content repositories and disables important browser functions like “bookmarking,” visited/unvisited links, history lists; reloading a page, and printing correctly And there will always be a significant number of users you cannot help: –Sight impaired –Limited bandwidth Using textual labels instead of icons (for faster download)

Sitemaps Represents the top level hierarchy –Always reinforce the information hierarchy when replicating the hierarchy –Facilitate fast with direct access to the desired contents –Avoid overwhelming the user with too much info

Site Index Site Index presents the keywords or phrases alphabetically (you can be creative here) Known-itemThis is where Known-item finding (the perfect catch) can be exploited Most challenging is dealing with the level of granularity Use a two-step approach: 1.User selects a term from the index 2.User selects a group of documents indexed with that term

Site Guides Take the form of a guided tour, tutorial and micro-portal focused around a specific audience, topic or task Rules of Thumb: –The guide should be short the user should always be able to exit the guide whenever they want –Navigation should be on same spot on every page The Guide should be setup to answer questions Use screenshots whenever possible to illustrate If the guide includes more than a few pages, it may need its own table of contents (try to avoid that)

Personalization vs. Customization Personalization - serving a tailored page to a user (amazon) vs. Customization - giving the user direct control over some combination of what he wants, navigation and content options, user says what he wants (yahoo)

Social Navigation Is built upon the simple idea that value for the individual user can be derived from observing the actions of other users, and it will increase in importance as the web develops –WIKI

Where are we now? How much do we know? Context, Content, Users - –drives our content choices User Needs (:The Perfect Catch::The Lobster Trap::Drift Netting:) Schemas: ( Exact: [alphabetic, chronological & geographical] and Ambiguous: [topical, audience specific, task, metaphor driven & hybrid]) ) Structures: ( hierarchy, databases and hypertext) Labeling: Types: contextual, headings, navigational systems, iconic, index