HFWEB June 3, 1999

AMS Center for Advanced Technologies

1Web Navigation •

Web NavigationEugene Tiller & Phillip Green

AMS Center for Advanced Technologies

HFWEB June 3, 1999

AMS Center for Advanced Technologies

2Web Navigation •

Lay the Groundwork

Identify the goals of the Web site

Identify the target user population

HFWEB June 3, 1999

AMS Center for Advanced Technologies

3Web Navigation •

Web User Interfaces

Users, Goals & Tasks

HFWEB June 3, 1999

AMS Center for Advanced Technologies

4Web Navigation •

All Users Want

Easy, quick navigation Fast page downloads Satisfaction

HFWEB June 3, 1999

AMS Center for Advanced Technologies

5Web Navigation •

The User Experience

Information complexity

HFWEB June 3, 1999

AMS Center for Advanced Technologies

6Web Navigation •

Corner Stones of Web Navigation

1. Site structure 2. Page navigation 3. Links and information

HFWEB June 3, 1999

AMS Center for Advanced Technologies

8Web Navigation •

Site Structure

Break a large site into mini-sites (CNET)

News.com Builder.com Shareware.com

HFWEB June 3, 1999

AMS Center for Advanced Technologies

9Web Navigation •

Site Structure

Fewer vertical levels are better Two or three levels are best A one page Web site is ideal “Shallow pond”

HFWEB June 3, 1999

AMS Center for Advanced Technologies

10

Web Navigation •

Site Structure

Storyboards help us think clearly

Storyboards help us convey our concepts clearly to others

HFWEB June 3, 1999

AMS Center for Advanced Technologies

12

Web Navigation •

Page Navigation

Casual visitors won’t memorize your navigation

Visitors are looking for the right information hooks

HFWEB June 3, 1999

AMS Center for Advanced Technologies

13

Web Navigation •

Page Navigation

Visitors don’t read, they scan for a path to their goals.– Books– Fiction– Science Fiction– Arthur C. Clark– 2001 A Space Odyssey

HFWEB June 3, 1999

AMS Center for Advanced Technologies

15

Web Navigation •

Page Navigation

More scrolling is better than more pages

HFWEB June 3, 1999

AMS Center for Advanced Technologies

16

Web Navigation •

Page Navigation

Use “within-a-page” anchors

HFWEB June 3, 1999

AMS Center for Advanced Technologies

17

Web Navigation •

Page Navigation

Use the Ferris wheel metaphor

1

2

5

4

3

HFWEB June 3, 1999

AMS Center for Advanced Technologies

18

Web Navigation •

Questions for Every Page

Who owns this page?” Where am I? How did I get here? How do I get back?

HFWEB June 3, 1999

AMS Center for Advanced Technologies

19

Web Navigation •

Links & Information

Push content (data) to the top of a Web site

HFWEB June 3, 1999

AMS Center for Advanced Technologies

20

Web Navigation •

Links & Information

Push pivotal content to the top of each page

HFWEB June 3, 1999

AMS Center for Advanced Technologies

21

Web Navigation •

Links & Information

Edit and edit again Find a good writer and editor

HFWEB June 3, 1999

AMS Center for Advanced Technologies

23

Web Navigation •

Links & Information

Follow page size guidelines The 10 second principle

HFWEB June 3, 1999

AMS Center for Advanced Technologies

25

Web Navigation •

Links & Information

Cell coloring “chunks” information

HFWEB June 3, 1999

AMS Center for Advanced Technologies

28

Web Navigation •

Links & Information

Content links vs. category links

HFWEB June 3, 1999

AMS Center for Advanced Technologies

29

Web Navigation •

Links & Information

Use 7-12 words in a content link

HFWEB June 3, 1999

AMS Center for Advanced Technologies

30

Web Navigation •

Links & Information

Information can be defined in many ways Use redundant links

HFWEB June 3, 1999

AMS Center for Advanced Technologies

31

Web Navigation •

Questions?