innovation
AMS Center for Advanced Technologies
Web NavigationEugene Tiller & Phillip Green
AMS Center for Advanced Technologies
innovation
AMS Center for Advanced Technologies
2
Web User InterfacesPeople + goals = success
innovation
AMS Center for Advanced Technologies
3
The User ExperienceInformation complexity
innovation
AMS Center for Advanced Technologies
4
Web Users WantFast page downloads
Time in seconds
1 2 3 4 50
innovation
AMS Center for Advanced Technologies
5
Web Users WantEasy, quick navigation
innovation
AMS Center for Advanced Technologies
6
Web Users WantSatisfying, usable Web sites
innovation
AMS Center for Advanced Technologies
7
Web Navigation3 areas of study for Web navigation
innovation
AMS Center for Advanced Technologies
8
3 Areas of Study1. Site structure
2. Page navigation
3. Links and information
innovation
AMS Center for Advanced Technologies
9
Site StructureHigh-level
Tree-top view
innovation
AMS Center for Advanced Technologies
10
Site StructureBreak a large site into mini-sites (CNET)
News.com Builder.com Shareware.com
innovation
AMS Center for Advanced Technologies
11
Site StructureFewer vertical levels are better
innovation
AMS Center for Advanced Technologies
12
Site StructureStoryboards help us think clearly
innovation
AMS Center for Advanced Technologies
13
Site StructureThink simplicity
Combine rather than differentiate
innovation
AMS Center for Advanced Technologies
14
Page NavigationMost visitors won’t memorize your navigation
innovation
AMS Center for Advanced Technologies
15
Page NavigationVisitors don’t read, they scan for buzzwords
innovation
AMS Center for Advanced Technologies
16
Page NavigationVertical vs. horizontal navigation arguments don’t matter
innovation
AMS Center for Advanced Technologies
17
Page NavigationMore scrolling is better than more pages
innovation
AMS Center for Advanced Technologies
18
Page NavigationUse “within-a-page” anchors
innovation
AMS Center for Advanced Technologies
19
Page NavigationAsk “who am I?” on every page
innovation
AMS Center for Advanced Technologies
20
Links & InformationPush content (data) to the top of a Web site
innovation
AMS Center for Advanced Technologies
21
Links & InformationPush pivotal content to the top of each page
innovation
AMS Center for Advanced Technologies
22
Links & InformationEdit and edit again
innovation
AMS Center for Advanced Technologies
23
Links & InformationWhite space = good (marketing sites)
White space = bad (information sites)
innovation
AMS Center for Advanced Technologies
24
Links & InformationFollow page size guidelines
innovation
AMS Center for Advanced Technologies
25
Links & InformationColumns keep text lines short
innovation
AMS Center for Advanced Technologies
26
Links & InformationCell coloring “chunks” information
innovation
AMS Center for Advanced Technologies
27
Links & InformationGood color usage speeds navigation
innovation
AMS Center for Advanced Technologies
28
Links & InformationHigh content density is good
innovation
AMS Center for Advanced Technologies
29
Links & InformationContent links vs. category links
innovation
AMS Center for Advanced Technologies
30
Links & InformationUse 7-12 words in a content link
innovation
AMS Center for Advanced Technologies
31
Links & InformationInformation can be defined in many ways
Use redundant links
innovation
AMS Center for Advanced Technologies
Questions?