empirically based web design - stc rmc based web design copyright 2003 don zimmerman cu denver 9...
TRANSCRIPT
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 1
Empirically Based Web Design
Don Zimmerman, PhD.ProfessorDepartment of Journalism & Technical CommunicationCenter for Research on Writing& Communication TechnologiesColorado State UniversityFort Collins, Colorado
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 22
Overview• Why do we need research-based
guidelines?• National Cancer Institute’s Usability
focus/ Communication Technologies Branch
• CSU Journalism & Technical Communication Research
• Selected guidelines
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 2
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 33
Why Research Based Guidelines?• Enhances the effectiveness of Web
sites • Tells what works and what doesn’t
work• Adds to your credibility
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 44
Why Research-based Guidelines?• Answers the “Why” behind design
questions• Provides evidence to support your
recommendation, guideline
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 3
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 55
National Cancer Institute--1
• www.usability.gov• Being revised, post spring 2003• 190+ guidelines• 475+ sources identified
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 66
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 4
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 77
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 88
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 5
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 99
National Cancer Institute--2
• Research-based guidelines for Web • NIH medical guidelines• Research paradigm• Best practices based on research
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1010
National Cancer Institute--3
• Process– Communication Technologies Branch
selected initial guidelines– Identified preliminary sources– Team reviewed– Met in DC to develop & pretest rating
system
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 6
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1111
National Cancer Institute--4• NCI Staff & Contractors• Janice Nall, Chief Communication Technologies
Branch• Sanjay Koyni, Usability Engineer• Crag Lafond, Project Manager• Susan Allison• Shruthi Nawab• Conrad Mulligan, McNeil Technologies• Kent Bailey, Mind Design, Inc.
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1212
National Cancer Institue--5• Bob Bailey, President
Computer Psychology• Barbara Chaparro,
Software Usability Res. Wichita State U.
• Melody Ivory, Inform. School, U of Wash.
• Bonnie John, HCI MS program, Carnegie Mellon U.
• Judy Ramey, Tech Comm, U. of Wash, University
• Ginny Reddish, Redish& Associates.
• Jean Schultz NIST• Tom Tullis, Human
Interface Design• Don Zimmerman, CSU
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 7
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1313
National Cancer Institute--6• Classify each guideline
– Hypothesis testing– Non-hypothesis-oriented experiment– Ethnography– Meta-analysis– Exploratory– Usability report or test– Model-based evaluation– Expert opinion
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1414
National Cancer Institute--7
• Rate sources on 1-5 guideline of quality• Rated confidence of rating on 1-5
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 8
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1515
CSU Research--1
• MS Tech Comm launched 1988• Given graduates have solid, writing,
editing & production skills • Value added
– Skills in identifying & analyzing audiences– What does research say about what works
and what doesn’t work
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1616
CSU Research--2
• Communication Science based : Testable research questions– Empirical social sciences
• Communication science• Psychology• Sociology• Education• Human computer interaction
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 9
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1717
CSU Research--3• Faculty generated $6+ million research • Center for Research on Writing &
Communication Technologies– Hewlett Packard– IBM– Environmental Protection Agency– National Cancer Institute– USDA Forest Service
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1818
CSU Research--4
• Center for Research on Writing & Communication Technologies– National Institutes of Health– Colorado Commission on Higher
Education– Colorado State University– National Park Service– National Science Foundation
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 10
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 1919
CSU Research--5
• Research studies & evaluations • Usability/Design: 1000+ participants• First Web Study
– 1993-1994– Linda Bilsing: new “thing” Web & HTML
• Surveys & adoption studies 3000+ participants
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2020
CSU Research--6• Animation• Distracters• Frames• Legibility• Navigational
patterns
• Navigational aids• Link characteristics
Scent• Tutorials• Visuals
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 11
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2121
CSU Research--7• Computer & Web
anxiety, Learning styles, Situated cognition
• Visual cognition, visual memory
• Cognitive science• Map reading
• Technology Transfer
• Diffusion of innovations--Web forms usage, professional Web site usage
• Web usage studies
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2222
CSU Research--8 • Problem-solving approach• Wide range of methods:
– Verbal protocol analysis– Card sorting– Tracking software– Surveys– Nominal Group Techniques– Focus groups– Surveys
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 12
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2323
Framework for Guidelines
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2424
Emerging Guidelines--1
• Follow accessibility standards– Section 508, Feds– www.W3.org
• Analyze audience– Content knowledge– Hardware & connection speeds
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 13
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2525
Emerging Guidelines--2
• Design for 800 x 600 resolution (?)
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2626
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 14
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2727
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2828
Emerging Guidelines--3
• Design for connection speeds– At work 66% users have fast connections– At home
• 14% high-speed (broadband) • Balance modems
– 56K Modem– Telephone line speed? 26K?
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 15
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 2929
Emerging Guidelines--4• Fast download speed
– 40k to 70k– Download ? Less minute
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3030
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 16
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3131
Emerging Guidelines--5
• Use standard links (?)• Blue underlined (?)• File folder Tabs• Buttons• Breadcrumbs
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3232
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 17
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3333
Emerging Guidelines--6
• Use high scent links (telling)• Prefer text over graphics
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3434
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 18
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3535
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3636
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 19
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3737
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3838
Emerging Guidelines--7
• Provide multiple navigation aids– Left-hand navigational panel– Tabs– Home– Tab folders– Breadcrumbs
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 20
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 3939
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4040
Emerging Guidelines--8
• Provide additional navigation aids– Index– Site map– Search engine– Table of contents– Links at bottom of page
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 21
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4141
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4242
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 22
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4343
Emerging Guidelines--9
• Put key information high in Web site hierarchy
• Put key information center and high on page (screen)
• Structure site broad & shallow
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4444
Vegetables &Fruits
CelebratingVegetables
& Fruits
SeasonalVegetables
& Fruits
Fun Facts& Ideas
Science:Truths &
Myths
How toBuy, Store,& Prepare
NutritionInformation
Buying
Storing
Preparing
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 23
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4545
Emerging Guidelines--10
• 55-60 character line: understanding • Use Verdana, Arial, Helvetica or other
sans-serif font• Provide good contrast
– Black text on white background– Avoid patterned backgrounds
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4646
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 24
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4747
Emerging Guidelines--11
• Use point size appropriate users• Use text aids for informational Web
sites– Bullet lists– Short, succinct paragraphs– Short sentences
• Use vertical lists, when possible
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4848
Emerging Guidelines--12
• Readability– Audience?– 10th grade level?– Run tests (MS Word function)– Write tightly– Edit, but don’t write to readability formulas
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 25
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 4949
Emerging Guidelines—13
• Use illustrations carefully– Functional?– Attract attention
• Use animations with care– Attract attention?– Functional– Distract users?
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5050
Emerging Guidelines—14
• Use photos, video, & sound with care
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 26
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5151
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5252
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 27
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5353
Emerging Guidelines—15
• Provide printable version
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5454
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 28
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5555
Emerging Guidelines—16
• Signal leaving site
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5656
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 29
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5757
Emerging Guidelines--17
• Signal page length
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5858
Empricially Based Web Guidelines Rocky Mountain STC 16 January 2003
1/17/03
Copyright 2003 Don Zimmerman Colorado State University 30
1/17/031/17/03
Empirically Based Web Design Empirically Based Web Design copyright 2003 Don Zimmerman CU copyright 2003 Don Zimmerman CU
Denver Denver 5959
Don Zimmerman
Center for Research on Writing & Communication Technologies
Dept of Journalism & Technical Communication
Colorado State University
Fort Collins, CO 80523-1785
Telephone 970-491-5674