View
218
Download
1
Category
Tags:
Preview:
Citation preview
OverviewOverview
Frank CervoneFrank Cervone
OverviewOverview
• Web site design and redesigns– Usability testing techniques– Designing for “scent”
• Web site design and redesigns– Usability testing techniques– Designing for “scent”
OverviewOverview
• Writing for the Web – Techniques, strategies, and
examples
• Writing for the Web – Techniques, strategies, and
examples
OverviewOverview
• Interactive, content-driven Web sites – Efficient site management – On-target search results
• Interactive, content-driven Web sites – Efficient site management – On-target search results
Web site designWeb site design
• What is good design?– Schools of thought
•Tufte - buffet•Nielsen – treasure hunt
• What is good design?– Schools of thought
•Tufte - buffet•Nielsen – treasure hunt
Web site UsabilityWeb site Usability
• How do we know what is usable?– Usability engineering as an
emerging discipline– What does research tell us?
• How do we know what is usable?– Usability engineering as an
emerging discipline– What does research tell us?
Jared M. Spool
Essentials for Quality Web Design
Essentials for Quality Web Design
• Know who your users are• Know why they are coming to the site• Design for Scent of Information
• Know who your users are• Know why they are coming to the site• Design for Scent of Information
What is the Scent of Information?
What is the Scent of Information?
• The clues users follow as they navigate a site
• Based on Xerox’s Information Foraging theories
• Tell us why users make the choices they make as they are seeking their target content
• The clues users follow as they navigate a site
• Based on Xerox’s Information Foraging theories
• Tell us why users make the choices they make as they are seeking their target content
What We Know About ScentWhat We Know About Scent
• Users can scan the page for Trigger Words
• If they don’t find the trigger words, they look for Search
• If Search isn’t a good option, they hit the Back Button
• Users can scan the page for Trigger Words
• If they don’t find the trigger words, they look for Search
• If Search isn’t a good option, they hit the Back Button
Tips for Creating Sites with Scent
Tips for Creating Sites with Scent
• Start with the most important content - make that easiest to find
• Find out what your user’s trigger words are
• Look for uses of the back button and search to tell you things are going awry
• Longer, more descriptive links work better than short links
• Start with the most important content - make that easiest to find
• Find out what your user’s trigger words are
• Look for uses of the back button and search to tell you things are going awry
• Longer, more descriptive links work better than short links
How do you know if your site has good scent?
How do you know if your site has good scent?
• Common technique: Usability Testing
- Find out how users work with your site
– Options: simple to complex
• Common technique: Usability Testing
- Find out how users work with your site
– Options: simple to complex
Writing for the WebWriting for the Web
• What do libraries do?– organize as much content as possible
• What is the focus of Web publications– Select the best content– Edit it well– Make compelling reading
• What do libraries do?– organize as much content as possible
• What is the focus of Web publications– Select the best content– Edit it well– Make compelling reading
Writing for the WebWriting for the Web
“It is words that drive actions on a Web page”
“It is words that drive actions on a Web page”
Gerry McGovern – author of “Content Critical”
Gerry McGovern – author of “Content Critical”
And with that, let’s learn about
effective writing for the Web
Writing for the Wired WorldWriting for the Wired World
Darlene Fichter Data Coordinator
University of Saskatchewan
Darlene Fichter Data Coordinator
University of Saskatchewan
Library Web developmentLibrary Web development
• Focus on technology, design and navigation• Site-wide perspective• Often, key Web developers do not have Web writing
experience
• Focus on technology, design and navigation• Site-wide perspective• Often, key Web developers do not have Web writing
experience
The ResultThe Result
Writing is ignoredWriting is ignored
The realityThe reality
• Technology and navigation are important
• Design is important
• Technology and navigation are important
• Design is important
Librarians enjoy hunting
for information.
Users like finding it.
Typical library audienceTypical library audience
• Diverse: age, occupation, etc.• Focused on getting the job done
• Diverse: age, occupation, etc.• Focused on getting the job done
Research shows people don’t readResearch shows people don’t read
• People who are looking for information don't read
• What do they do?• They scan
• People who are looking for information don't read
• What do they do?• They scan
ReadingReading
• Is at least 25% slower on the screen compared to a paper-based format
• Is at least 25% slower on the screen compared to a paper-based format
Reading slower: Implications for style
Reading slower: Implications for style
• Be succinct Use ½ the word count of
conventional writing• Write in pyramid style like a
newspaper article
• Be succinct Use ½ the word count of
conventional writing• Write in pyramid style like a
newspaper article
“More is better” syndrome“More is better” syndrome
• Need to ask what is important? • Then give prominence to high
demand items
• Need to ask what is important? • Then give prominence to high
demand items
Four ways to improve your writing
Four ways to improve your writing
1.Strike out useless words
2.Use simple sentences3.Avoid jargon4.Be direct
1.Strike out useless words
2.Use simple sentences3.Avoid jargon4.Be direct
Remember: Readers understand
more when reading less.
Remember: Readers understand
more when reading less.
ScanningScanning
• Make your page easy to scan• Use lists, lists, and more lists• Create page titles, headings,
and subheadings• Be consistent in how you
design the headings
• Make your page easy to scan• Use lists, lists, and more lists• Create page titles, headings,
and subheadings• Be consistent in how you
design the headings
Use listsUse lists
• Lists speed up scanning• Use bulleted items when
sequence doesn’t matter– Use numbered items when it does
• Lists are for key concepts, not full sentences
• Lists speed up scanning• Use bulleted items when
sequence doesn’t matter– Use numbered items when it does
• Lists are for key concepts, not full sentences
Which is fastest to read? Research says…
Which is fastest to read? Research says…
Anatomy
Biology
Biotechnology
Chemistry
Microbiology
Physics
Zoology
Anatomy
Biology
Biotechnology
Chemistry
Microbiology
Physics
Zoology
Anatomy Biology Biotechnology Chemistry Microbiology Physics Zoology
• Make the links meaningful• Set link colors• Don’ t use “standard” colors in
odd ways– this is not a link, but it sure looks like one
Power of hyperlinksPower of hyperlinks
What is the weakest link?What is the weakest link?
Staff Directory
1. Search by last name 2. Browse by location 3. List all staff, click here
Promoting better writing
Promoting better writing
• Share a couple of strategies• Share a couple of strategies
Set standardsSet standards
• Editorial standards– Capitalization, punctuation– Naming conventions– Readability scores– Page length
• Formatting– Headings and subheadings– Lists
• Editorial standards– Capitalization, punctuation– Naming conventions– Readability scores– Page length
• Formatting– Headings and subheadings– Lists
Recruit authors as observers for your next usability test
Recruit authors as observers for your next usability test
• Nothing works better•Seeing is believing
• Nothing works better•Seeing is believing
Writing guides and resources
Writing guides and resources
• Before and after examples• Before and after examples
Instead of Use
construct build
concerning about
in order to to
Secrets to good wired writing
Secrets to good wired writing
• Be informed − read the research
• Watch users and learn what works
• Practice writing and editing for the Web
• Be informed − read the research
• Watch users and learn what works
• Practice writing and editing for the Web
Content-driven Web sitesContent-driven Web sites
• Moving from static to dynamic pages– Allows for customization based on
user – Provides a means for organizing
large amounts of content– Volume of resources makes hand-
coding impractical
• Moving from static to dynamic pages– Allows for customization based on
user – Provides a means for organizing
large amounts of content– Volume of resources makes hand-
coding impractical
Content-driven Web sitesContent-driven Web sites
• What it means– Page content generated on
demand– “Web page” is a template– Content is stored in a database– A template processing engine
combines the template and content to create a Web page
• What it means– Page content generated on
demand– “Web page” is a template– Content is stored in a database– A template processing engine
combines the template and content to create a Web page
Dynamic Content DeliveryDynamic Content Delivery
Laura Pope RobbinsDecember 6, 2002
Effective Web Design: A Fresh Look
Laura Pope RobbinsDecember 6, 2002
Effective Web Design: A Fresh Look
Why use a database?Why use a database?
• Library perspective– Increase access– Simplify maintenance– Save time– Eliminate errors– Focus on content not format
• Patron perspective– Dynamic and interactive– Fast and easy to use
• Library perspective– Increase access– Simplify maintenance– Save time– Eliminate errors– Focus on content not format
• Patron perspective– Dynamic and interactive– Fast and easy to use
Static content deliveryStatic content delivery
• Hard-coded HTML pages – Team effort– Webmaster as editor-in-chief
• Long lists– Subscription databases– Journal titles– Selected Web sites
• Hard-coded HTML pages – Team effort– Webmaster as editor-in-chief
• Long lists– Subscription databases– Journal titles– Selected Web sites
Static content deliveryStatic content delivery
• One link can span several pages– Unwieldy– Facilitates errors– Time consuming
• One link can span several pages– Unwieldy– Facilitates errors– Time consuming
Dynamic content deliveryDynamic content delivery
• Centralized resource– Specific piece of information exists only once– Update only one resource
• Centralized resource– Specific piece of information exists only once– Update only one resource
Dynamic content deliveryDynamic content delivery
• Editing controlled via Web forms– Consistent content– Separate style and content
• Editing controlled via Web forms– Consistent content– Separate style and content
• Variety of access– Multiple access points for one resource– Customized content
• Dynamic content
• Variety of access– Multiple access points for one resource– Customized content
• Dynamic content
Dynamic content deliveryDynamic content delivery
How were these sites created?How were these sites created?
• Webserver– Microsoft IIS
• Database– MS Access
•Provides the raw data for the Web pages
• Middleware– Active Server Pages (ASP)
•Provides the interface
• Webserver– Microsoft IIS
• Database– MS Access
•Provides the raw data for the Web pages
• Middleware– Active Server Pages (ASP)
•Provides the interface
Recommended