Navigation and Menus Will Meurer. Topics Navigation Basics Navigational Elements Other Navigation...
-
Upload
cornelius-green -
Category
Documents
-
view
238 -
download
0
description
Transcript of Navigation and Menus Will Meurer. Topics Navigation Basics Navigational Elements Other Navigation...
Navigation and MenusWill Meurer
Topics
• Navigation Basics• Navigational Elements• Other Navigation Techniques• Implementation• Usability• Take Away Points• References
Navigation Basics
What is a navigation system?A set of tools that enables users to get to the
information they desire
How?By providing structure and context
Navigation Basics
Navigation…– Gives users the ability to get from one place to the
next while understanding:• Where they are• Where they’ve been• Where they’re going
– Helps users understand the content structure
Navigational Elements
• Browser-based– Linear - Back, Forward
– Nonlinear – Browsing History, Favorites– Contextual – Status Bar, URL
(e.g. www.news-site.com/entertainment/music)
Status Bar
Navigational Elements
• Site-based– Menus
• Global• Local
Global and Local Menus,www.walmart.com
Global and Local Menus, www.apple.com
Navigational Elements
• Site-based– Contextual
• Bread crumbs• Inline links• Relational
– intersite, see also
Bread crumbs, http://www.useit.com/alertbox/20000109.html
Inline and relational links,http://www.dictionary.com
Navigational Elements
– Supplemental• Sitemaps• Indexes• Guides• Search
Index, http://www.cdc.gov/az.doSite Map, http://www.utexas.edu/sitemap/
Other Navigation Techniques• Personalization
– Automatically building menus and contextual navigation based on user characteristics
• Customization– Enabling the user to
alter the layout and navigational elements according to preference
• Social filtering– Elements built based on
all the site’s users
Personalization, http://www.amazon.com
Customization, http://www.amazon.com(Rosenfield & Morville, 2002)
Implementation – Organization• Hierarchical
– Menu systems, like global and local
– Sitemaps• Task-based
– Guides• Alphabetical
– Indexes• Chronological
– News– History
• Popularity-based– Social filtering
Alphabetical, http://www.lib.utexas.edu/indexes
(Vanduyne, Landay & Hong, 2003)
Implementation – Goals• Navigation should support every type of viewing
strategy– Undirected Viewing, Conditioned Viewing, Informal
Search, Formal Search (Choo, Detlor, & Turnbull, 2000)• Navigation should be simple and transparent
– Users don’t focus on the navigation and site structure (Nielsen, 2000)
– Deep menus on each page are difficult to use• Fitt’s Law (Wikipedia, 2005)
Implementation – Goals
• Therefore, don’t do this:
Looking for a hair dryer, I mean, uh, something less embarrassing, http://www.outpost.com.
Implementation – On your site
• Navigation decisions are based on:– Taxonomy– Site structure– Labels– Site type
• Portal – Customization• Library catalog – Index
Usability
• Menus– Use features such as:
• Mouseovers, even just underlining text• Mouse pointer change, make it a hand• Showing current location
– Image• Watch file size• Provide alt tags for accessibility
– E.g. <img src=“world.jpg” alt=“World News” /> • Preload all graphics so mouseovers work instantly (preload
code)– Flash
• Basic rule: Do not use Flash menus
Usability
• Contextual elements– Stay away from “click here”.– Linking every word appears overly complex and
lessens strength of the important links (Nielsen, 2000)
Take away points• Navigation systems are what get users to the information
they are seeking• Various types of navigational elements can be leveraged
to provide a user with the best tools to get the information they want
• Choosing elements and implementing navigation systems is an integral part of Information Architecture.
• Effective navigation, like all parts of a successful product, must be built with usability in mind.
References• Choo, C. W., Detlor, B., & Turnbull, D. (2000). Information Seeking
on the Web: An Integrated Model of Browsing and Searching. Retrieved 12 Oct. 2005 from http://www.ischool.utexas.edu/%7Ei385e/readings/Information%20Seeking%20on%20the%20Web.htm
• Nielsen, J. (2000). Is Navigation Useful? Retrieved 12 Oct. 2005 from http://www.useit.com/alertbox/20000109.html.
• Rosenfeld, L., & Morville, P. (2002). Information architecture for the World Wide Web. 2nd ed. Sebastopol, CA: Orsquo;Reilly
• van Duyne, D. K., Landay, J. A., & Hong, J. I. (2003). The design of sites: Patterns, principles, and processes for crafting a customer-centered Web experience. Boston, MA: Addison-Wesley
• Fitt’s Law. Wikipedia, 2005. Retrieved 15 Oct. 2005 from http://en.wikipedia.org/wiki/Fitt's_Law