information architecture navigation. goals 1. organization systems 2. navigation: conventions 3....
Post on 03-Jan-2016
216 Views
Preview:
TRANSCRIPT
Information Architecture
Navigation
Goals1. Organization systems
2. Navigation: Conventions
3. Login & Forms Task | Dreamweaver
4. Client Project 2 Blue Archer CONSOL Entergy Center
Content Organization
An organizational system consists of an organizational scheme and an organizational structure.
Organizational schemes: classification systems for organizing content into groups
Organizational structures: defining the relationships among the groups
Exact organizational schemes Alphabetical scheme uses alphabet to order
content items (e.g., author index in a library).
Chronological scheme uses time to order the content items (e.g., books and history books).
Geographical scheme uses location to order items (e.g., floor plans, weather maps)
Ambiguous Organizational SchemesContent and Navigation
Ambiguous organizational schemes Situations where there is more than one
reasonable way to group things.e.g., Books organized by author, title, by
audience, price, etc. Types:
1) Topical
2) Task-oriented
3) Audience-specific
Topical organizational scheme
Organizes content by topic or subject Encyclopedia Chapter titles in textbooks E.g., fiction/non-fiction, clothing - shoes,
shirts, coats; mike, bread, meats, etc.
Topical organizational scheme
Topics/Categories
Task-oriented organizational scheme
Example:
Autobytel.com
By Tasks
Audience-specific organizational scheme
Specific audience
s
Hybrid organizational scheme
Combines multiple organizational schemes
Quite common, but must be done with care to avoid confusion
Example: Nordstrom
Hybrid organizational scheme
Category
Audience
Task
Hybrid organizational scheme
Category
Audience
Task
Types of organizational structures
Hierarchy Hypertext Database
Hierarchical structure
CLOTHINGBOOKS BUYMUSIC
HOME
ROCKJAZZ CLASSICAL
FOLK
REGGIE
http://www.surl.org/usabilitynews/42/hypertext.asp
http://www.otal.umd.edu/SHORE/bs04/
Hypertext organizational structures
Database organizational structures
Navigation
Navigation
“Navigation isn’t a feature of the Web site, it is the Web site… without it there’s no there.”
Krug, S. (2001)
Design for the user’s convenience, not yours.
Nielsen, J. (2006)
Navigation: How do we find something? Do you decide to ask first or browse
Search dominant usersLink dominant users
We make our way though hierarchy using signs to guide us.
Source: Krug, S. (2001). Don’t make me think.
In a Store
On the Web
Navigation
The Web lacks cues we rely on in physical spaces.
Source: Krug, S. (2001). Don’t make me think.
Navigation
1. No sense of scale – how big is this site?
2. No sense of direction (no left, right, up down).
3. No sense of location.
Navigation
Size/scale | Location | Direction
Text density???
Navigation
Unlike physical spaces, on the Web, we must remember where something is in the conceptual hierarchy and retrace steps.
The importance of the Home page (Home base) Depicting the information hierarchy The Back button
Navigation: Purpose
Informs user about what is on site. Make a visible hierarchy to convey what is on site.
Informs user how to use site - where to begin and the options available.
Builds user confidence.
Navigation
Conventions
Navigation: Conventions
Good navigation design shows users: where they are where things are located, and how to get the things they need.
Navigation: Conventions
It is predictable and makes people feel comfortable exploring the site.
Doesn’t need to be studied or memorized.
Reflects users impression of how information should be represented in Web space.
Site IDSections
Utilities
Subsections
Location
Local navigation
Small Text Navigation
Global Location
Conventions
Navigation | site map Translate site map | flowchart into navigation
Global Navigation
Sub-level Navigation
Site IDSections
Utilities
Subsections
Location
Local navigation
Small Text Navigation
Conventions
Global Location
Site IDSections
Utilities
Subsections
Location
Navigation: Conventions
Navigation: Conventions Navigation is in same location on every page.
Exceptions – the home page, forms.
Mains topics static and appear at once – users skim the choices
Keep Site ID (logo) on every page of site – upper left.
Site ID is the highest element in the hierarchy
Site IDBooks
Computer Books
Perl scripting made easy
Conveys that items are under this section
12
3
4
Navigation: Conventions
Site ID must look like a Site ID
Site ID should also function as a link to Home.
Add Search to every page: A box, a button, and Search No unique words
Navigation: Conventions
• Primary/persistent navigation also includes space for secondary navigation.
Primary
Secondary
Navigation: ConventionsUtilities
• Utilities are not part of the hierarchy
• Helps users use the site
• Provide information about site publisher
• Only include the most important 4-5 utilities on Primary navigation
• Make utilities list less prominent than sections
Navigation: Page names
• Name your pages
• Page Name should frame content unique to the page.
• Names should be prominent
• Name should match what user clicks.
Site IDBooksName pages
Navigation: You are here
Tell the user his/her location – you are here.
Navigation: Breadcrumbs
Use “>” between levels Use small type Special visual treatment for last item
Navigation: Links | Repeated information Placing duplicate links all over the page
decreases likelihood that viewers see them.
Fewer objects on the page, the more likely people will notice them.
With many competing elements, all items lose prominence.
Navigation: Conventions | Words
People tend to skip meaningless words.
Remove extraneous words.
Links that start with identical or redundant phrases require people to carefully read all of them to glean the differences.
Help people quickly differentiate links by giving them informative names.
Navigation: Your page should answer these questions. What is the site ID? What page am I on (page name)? What are the major sections (global
navigation) Where am I? (global and local navigation) How can I search?
top related