Presentation given at the New England Historic Genealogical Society on March 4, 2014.

1. websites that work
an exploration of
user-centered
website design
Emily Singley
Systems Librarian
Harvard University

2. a usable website is…
 Understandable
 Navigable
 Searchable
 Browser and device neutral
why usability matters
 Familiar
 Accessible

3. understandable

5. “Studies report that about 80% of users scan any
new page. Only 16% read each word.”
http://guidelines.usability.gov/guidelines/178
http://www.congregationallibrary.org/churches/records-management

6. navigable
“People won’t use your Web site if they can’t find their
way around it.” – Don’t make me think / Steve Krug

7. The F-shape pattern
http://www.usability.gov/get-involved/blog/2010/03/eyetracking.html

8. Not so good:
http://www.ingenweb.org/

9. searchable
users love search boxes
is everything on your site searchable?

10. Not so good:
http://www.washoecounty.us/library/

11. How Googleable is your website?
many users prefer to navigate from a search engine

12. browser and device neutral
test…then test some more….

13. does your site require more than a browser?
avoid using proprietary formats

14. do you need a separate mobile site?
…..or a responsive design?
http://www.cantonpl.org/

16. familiar
meet your user’s expectations
Top websites in the US by usage:
Google
Facebook
YouTube
Yahoo
Wikipedia
Twitter
Blogspot
Amazon
does your site follow these standards?

17. accessible
can all your patrons use your site?
http://screencast.com/t/Ke3s84eJN
“Access problems often occur because website designers mistakenly assume
that everyone sees and accesses a webpage in the same way. ”
– ADA best practices toolkit

18. 5 steps to a
user-centered
website

19. 1 – identify site goal(s)
http://www.slideshare.net/RealFreeWebsites.com/step-1-how-to-set-your-website-goal

20. 2 – know your audience(s)

21. 3 - test
“All you really need is a room with a desk, a computer, and two chairs.” –
Don’t make me think / Steve Krug
http://youtu.be/h4lfb4SHakw

22. You only need 5 users for valid results:
“Why you only need to test with 5 users“ Jakob Nielsen, March 19,
2000 http://www.useit.com/

24. 4 – organize content
with the help of your users!
http://www.usability.gov/how-to-and-tools/methods/card-sorting.html

25. 5 – create the site

26. go back to step 1
goals
create
content
audience
test
“Websites are like living organisms…
if they stop changing, they die.”
-- Heather Shaw, graphic designer

27. Resources
Usability.gov: http://usability.gov/
Usability Guidelines: http://usability.gov/guidelines/guidelines_book.pdf
Krug, Steve. (2005). Don’t make me think: A commonsense approach to web usability.
2nd ed. Indianapolis: New Riders.
Steve Krug’s website: http://www.sensible.com/
Jakob Nielsen’s website: http://www.nngroup.com/
“Top 10 mistakes in website design” by Jakob Nielsen:
http://www.nngroup.com/articles/top-10-mistakes-web-design/
Mobile Usability from Jakob Nielsen:
http://www.nngroup.com/articles/mobile-usability-update/
W3C Mobile Checker – check to see if your site is mobile compatible:
http://validator.w3.org/mobile/

28. Some good websites:
http://www.congregationallibrary.org/
http://www.massaudubon.org/
http://www.gardnermuseum.org/home/
http://www.metmuseum.org/
http://www.oldsouth.org/
http://www.slcpl.lib.ut.us/
http://www.nypl.org/
http://www.dbrl.org/

29. Accessibility
ADA best practices toolkit: http://www.ada.gov/pcatoolkit/chap5toolkit.htm
Accessibility basics from usability.gov: http://www.usability.gov/what-andwhy/accessibility.html
Section 508 guidelines: http://www.section508.gov/
United States Access Board: a federal agency committed to accessible design
http://www.access-board.gov/guidelines-and-standards/communications-and-it
Good blog post comparing screen readers: http://usabilitygeek.com/10-free-screenreader-blind-visually-impaired-users/
Demo version of JAWS: http://www.freedomscientific.com/downloads/jaws/jawsdownloads.asp
Free screen readers:
http://www.screenreader.net/index.php?pageid=11
http://webanywhere.cs.washington.edu/
http://www.nvda-project.org/

30. This presentation and more:
http://emilysingley.net/resources/

31. Any Questions?