Presentation is loading. Please wait.

Presentation is loading. Please wait.

HFWEB June 3, 1999 AMS Center for Advanced Technologies 1 Web Navigation Eugene Tiller & Phillip Green AMS Center for Advanced Technologies.

Published byPatrick Hill Modified over 8 years ago

Similar presentations

Presentation on theme: "HFWEB June 3, 1999 AMS Center for Advanced Technologies 1 Web Navigation Eugene Tiller & Phillip Green AMS Center for Advanced Technologies."— Presentation transcript:

1 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1 Web Navigation Eugene Tiller & Phillip Green AMS Center for Advanced Technologies

2 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2 Web Navigation Lay the Groundwork n Identify the goals of the Web site n Identify the target user population

3 HFWEB June 3, 1999 AMS Center for Advanced Technologies 3 Web Navigation Web User Interfaces n Users, Goals & Tasks

4 HFWEB June 3, 1999 AMS Center for Advanced Technologies 4 Web Navigation All Users Want n Easy, quick navigation n Fast page downloads n Satisfaction

5 HFWEB June 3, 1999 AMS Center for Advanced Technologies 5 Web Navigation The User Experience n Information complexity

6 HFWEB June 3, 1999 AMS Center for Advanced Technologies 6 Web Navigation Corner Stones of Web Navigation n 1. Site structure n 2. Page navigation n 3. Links and information

7 HFWEB June 3, 1999 AMS Center for Advanced Technologies 7 Web Navigation Site Structure n High-level n Tree-top view

8 HFWEB June 3, 1999 AMS Center for Advanced Technologies 8 Web Navigation Site Structure n Break a large site into mini-sites (CNET) News.comBuilder.comShareware.com

9 HFWEB June 3, 1999 AMS Center for Advanced Technologies 9 Web Navigation Site Structure n Fewer vertical levels are better n Two or three levels are best n A one page Web site is ideal n “Shallow pond”

10 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1010 Web Navigation Site Structure n Storyboards help us think clearly n Storyboards help us convey our concepts clearly to others

11 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1 Web Navigation Site Structure n Think simplicity n Combine rather than differentiate

12 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1212 Web Navigation Page Navigation n Casual visitors won’t memorize your navigation n Visitors are looking for the right information hooks

13 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1313 Web Navigation Page Navigation n Visitors don’t read, they scan for a path to their goals. –Books –Fiction –Science Fiction –Arthur C. Clark –2001 A Space Odyssey

14 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1414 Web Navigation Page Navigation n Vertical vs. horizontal navigation arguments don’t matter

15 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1515 Web Navigation Page Navigation n More scrolling is better than more pages

16 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1616 Web Navigation Page Navigation n Use “within-a-page” anchors

17 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1717 Web Navigation Page Navigation n Use the Ferris wheel metaphor 1 2 5 4 3

18 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1818 Web Navigation Questions for Every Page n Who owns this page?” n Where am I? n How did I get here? How do I get back?

19 HFWEB June 3, 1999 AMS Center for Advanced Technologies 1919 Web Navigation Links & Information n Push content (data) to the top of a Web site

20 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2020 Web Navigation Links & Information n Push pivotal content to the top of each page

21 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2121 Web Navigation Links & Information n Edit and edit again n Find a good writer and editor

22 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2 Web Navigation Links & Information n White space = good (marketing sites) n White space = bad (information sites)

23 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2323 Web Navigation Links & Information n Follow page size guidelines n The 10 second principle

24 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2424 Web Navigation Links & Information n Columns keep text lines short

25 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2525 Web Navigation Links & Information n Cell coloring “chunks” information

26 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2626 Web Navigation Links & Information n Good color usage speeds navigation

27 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2727 Web Navigation Links & Information n High content density is good

28 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2828 Web Navigation Links & Information n Content links vs. category links

29 HFWEB June 3, 1999 AMS Center for Advanced Technologies 2929 Web Navigation Links & Information n Use 7-12 words in a content link

30 HFWEB June 3, 1999 AMS Center for Advanced Technologies 3030 Web Navigation Links & Information n Information can be defined in many ways n Use redundant links

31 HFWEB June 3, 1999 AMS Center for Advanced Technologies 3131 Web Navigation Questions?

Download ppt "HFWEB June 3, 1999 AMS Center for Advanced Technologies 1 Web Navigation Eugene Tiller & Phillip Green AMS Center for Advanced Technologies."

Similar presentations

Web Usability Starring the Webcredibles: Link, Dr. Web Credible, & Wendy Warner.

Web Usability Starring the Webcredibles: Link, Dr. Web Credible, & Wendy Warner.
YOUR WEB SITE REVISITED Appearance, Organization, Tone.

YOUR WEB SITE REVISITED Appearance, Organization, Tone.
Good Vs. Bad UI & Oakley Airwave 1.5 Sean Gergen & Derik Wright.

Good Vs. Bad UI & Oakley Airwave 1.5 Sean Gergen & Derik Wright.
Chapter 3 – Web Design Tables & Page Layout

Chapter 3 – Web Design Tables & Page Layout
Reviewed by: Mandy Parsons.  High quality content  Easy navigation  Planning, selecting, organizing, writing, illustrating, reviewing, and testing.

Reviewed by: Mandy Parsons.  High quality content  Easy navigation  Planning, selecting, organizing, writing, illustrating, reviewing, and testing.
CSE2MA Multimedia Authoring Semester 2, 2011 Web Page Design Week 2.

CSE2MA Multimedia Authoring Semester 2, 2011 Web Page Design Week 2.
Chapter 19 Design Model for WebApps

Chapter 19 Design Model for WebApps
Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI 211-214, MSTI 131 and MSTI 260 Developed by BNapoli.

Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI , MSTI 131 and MSTI 260 Developed by BNapoli.
6 Developing Content and Layout Section 6.1 Generate and organize content ideas Write and organize Web text Section 6.2 Identify page dimension guidelines.

6 Developing Content and Layout Section 6.1 Generate and organize content ideas Write and organize Web text Section 6.2 Identify page dimension guidelines.
LAYOUT OF PAGE ELEMENTS September 28 th, 2009. PATTERNS Common ways to use the Layout Elements of Visual Hierarchy, Visual Flow, Grouping and Alignment,

LAYOUT OF PAGE ELEMENTS September 28 th, PATTERNS Common ways to use the Layout Elements of Visual Hierarchy, Visual Flow, Grouping and Alignment,
Mgt 240 Lecture Web Site Design Principles April 5, 2005.

Mgt 240 Lecture Web Site Design Principles April 5, 2005.
Design Elements of a Web Page. Focal Point Each page should have a focal point to attract the viewer. This can be one large picture or a headline, a combination.

Design Elements of a Web Page. Focal Point Each page should have a focal point to attract the viewer. This can be one large picture or a headline, a combination.
Web Usability By Chao Liang Based on Jakob Nielsen’s Book “ Designing Web Usability”

Web Usability By Chao Liang Based on Jakob Nielsen’s Book “ Designing Web Usability”
Good Websites. 2. Submit one good web interface. This website is a good because of it usability and appears of the website.

Good Websites. 2. Submit one good web interface. This website is a good because of it usability and appears of the website.
AdvWeb-1/20 DePaul University SNL 262 Web Page Design Design Information Instructor: David A. Lash.

AdvWeb-1/20 DePaul University SNL 262 Web Page Design Design Information Instructor: David A. Lash.
Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.

Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.

Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
User Centered Web Site Engineering Part 2. Developing Site Structure & Content Content View Addressing content Outlining content Creating a content delivery.

User Centered Web Site Engineering Part 2. Developing Site Structure & Content Content View Addressing content Outlining content Creating a content delivery.
Expression Web 2 Concepts and Techniques Expression Web Design Feature Web Design Basics.

Expression Web 2 Concepts and Techniques Expression Web Design Feature Web Design Basics.
Color Theory in Web Design Web Design – Sec 2-2. Objectives  The student will: –Have a better understanding of effective use of color on the web. –Be.

Color Theory in Web Design Web Design – Sec 2-2. Objectives  The student will: –Have a better understanding of effective use of color on the web. –Be.

Similar presentations

Ads by Google