1. Open this web page prior to the presentation

2. Library Website Design Usability and Accessibility Faith Yokoyama LIS 670Summer 2005

3. HSPL Five Year Library Services and Technology Plan From fewer physical to more online collections, From fewer library buildings to more home and community access points, From less emphasis on staff-mediated services to more self-service, privacy-enhancing, and personalized options, and From requiring customers to come to us to delivering collections and services to people (Source: Hawaii State Public Library System LSTA Five-Year Plan, 2003-2007 http://www.librarieshawaii.org/pdf/LSTA%205-year%202003- 2007%20050401%20%20SUBMISSION.pdfhttp://www.librarieshawaii.org/pdf/LSTA%205-year%202003- 2007%20050401%20%20SUBMISSION.pdf)

4. Overview Usability Target user group – children Accessibility

5. Usability The measure of the quality of a user's experience when interacting with a product or system. Web site Software application Mobile technology

6. Usability Usability is a combination of factors that affect the user's experience with the product or system. Ease of learning Efficiency of use Memorability Error frequency and severity Subjective satisfaction

7. Why is usability important? Research by User Interface Engineering, Inc. shows that people cannot find the information they seek on Web sites about 60% of the time. Wasted time Reduced productivity Increased frustration Loss of repeat visits and money

8. Usability Why are you developing a site? Who should come to your site? When and why those people might come?

9. Collect Data Data must be collected about user needs. Feedback forms Online surveys Usability testing of the existing site

10. Designing Childrens Websites Faith Yokoyama LIS 670 Information Science and Technology

11. Dont Dumb Them Down Jakob Nielsen & Shuli Gilutz (2002) Usability of Websites for children Study children 5 – 11 How they navigate through kids sites http://www.nngroup.com/reports/kids/ Nielsen Norman Group Report: Usability of Websites for Children: 70 design guidelines based on usability studies with kids 128 pages PDF format Download Report (from eSellerate) $129 for a single report Download Report

12. Nielsens findings Debunks myths that: Children are not naturally adept at computers. Often become more confused than adults. Are not as naturally skillful on computers as we thought.

13. Nielsens findings Unlike grownups, children will: actually read directions (up to one paragraph) when they encounter error messages… - they just ignore it - go someplace else

14. Nielsens findings Children have literal thinking. They dont scroll down the page. If its out of sight, then its out of mind.

15. Nielsens findings Pop-up advertisements Children do not distinguish between ads and content. To children – its ALL information. Children will click on ad banners ALL the time

16. Children like… Animation Sound Easter egg-hunting

17. Design by age Pre-Readers ( 3 – 5 year-old) Beginning Readers (5 – 8 year-old) Intermediate Readers (9 – 12 year-old) Young Adults ( 13 - 17 year-old)

18. What to put in a childrens library website

19. 5 cores areas Homework assistance Outreach Readers advisory Reference help Programming

20. Homework Assistance KidsClick! Web Search http://www.kidsclick.org Kids Webrary Links http://www.webrary.org/kids/jkidslinks.html (also has a site for adults)

21. Outreach Hands on Crafts http://www.handsoncrafts.org Work with others

22. Readers Advisory Animated reviews Animated characters tell a book review http://www.readthebooks.com/rtb/files/ rtb_danbury/aliens/general/composeGe neral.mvhttp://www.readthebooks.com/rtb/files/ rtb_danbury/aliens/general/composeGe neral.mv. (subscription-based service only)

23. Reference Tutorials KidsClick! Worlds of Web Searching Searching tutorial Each planet = Type of Internet searching (Source: http://www.rcls.org/wows/index.html)http://www.rcls.org/wows/index.html

24. Programming StoryPlace –Assist young readers in developing literacy skills –Children may select or name characters http://www.storyplace.org Usability – voice integration –Multiple languages –ESL / Special Ed –Visually Impaired –Elderly

25. Want to make your own Childrens Web site? Lack time? Lack know how?

26. Portals Portal created for use by many libraries Customize it Tailoring it to the needs of your users Making your own web site

27. Portals Start Squad Kids Portal http://startsquad.org –Display own library logo –Select default sites –Limit topics Brarydog Portal http://www.brarydog.net –Students create their own homework help website Webmonkey for Kids http://webmonkey.wired.com/webmonkey/kids/ Making your own web site

28. Displaying childrens work and photos Mid-Hudson Library System, New York http://midhudson.org/news/picturereleaseform.htm http://midhudson.org/news/picturereleaseform.htm North Suburban Library System, Illinois http://www.nsls.info/marketing/photo.html

29. Privacy Policy Notify users about how they are safeguarded ALAs Office of Intellectual Freedom Guidelines for Developing a Library Privacy Policy (Source:http://www.ala.org/template.cfm?Section+Privacy1&Templa te=/ContentManagement/ContentDisplay.cfm&ContentID=40426)http://www.ala.org/template.cfm?Section+Privacy1&Templa te=/ContentManagement/ContentDisplay.cfm&ContentID=40426

30. Privacy Policy Make a link accessible from anywhere in your site Place at the bottom of each page Specifically for children: Indianapolis Marion County Public Library (Source: http://infozone.imcpl.org/kids_about_disclaimer.htm)http://infozone.imcpl.org/kids_about_disclaimer.htm

31. Accessibility Web Design Standards

32. Usability vs. Accessibility Usability Guidelines Website is intuitive and easy to use Designed with its target audience in mind Accessibility Standards Website is as barrier-free as possible Designed to reach the widest possible audience

33. People with disabilities feel more isolated, detached from communities Heavy computer and Internet use among those with disabilities. This technology is presenting new opportunities for social outreach and work and educational opportunities. (Source: National Organization on Disability/Harris Poll survey, 7 July 2000 http://www.nod.org/index.cfm?fuseaction=page.viewPage&pageID=1430&node ID=1&FeatureID=238&redirected=1&CFID=3226770&CFTOKEN=9374483) http://www.nod.org/index.cfm?fuseaction=page.viewPage&pageID=1430&node ID=1&FeatureID=238&redirected=1&CFID=3226770&CFTOKEN=9374483

34. Section 508 Ensures that information technology and equipment purchased or developed by the Federal government is accessible to people with disabilities. This includes websites and multimedia.

35. "These guidelines explain how to make Web content accessible to people with disabilities.... However, following them will also make Web content more available to all users.... Following these guidelines will help people find information on the Web more quickly." W3C Web Content Accessibility Guidelines (WCAG)

36. Section 508 http://www.usdoj.gov/crt/508/ W3C Web Content Accessibility Guidelines http://www.w3.org/TR/WAI-WEBCONTENT/ http://www.w3.org/TR/WCAG20/ (Working draft of Version 2.0)

37. …all Hawaii Department of Education (HDOE) websites including school and office sites, are required to be to fully ADA compliant by January 1, 2002. (http://doe.k12.hi.us/technology/accessibility memo001208.htm)http://doe.k12.hi.us/technology/accessibility memo001208.htm

38. Accessibility Tutorials Section508.gov http://section508.gov/index.cfm?FuseAction=Content&ID=5 Jim Thatcher.com http://www.jimthatcher.com/webcourse1.htm IBM: Give Your Website an Accessibility Makeover (Downloadable PowerPoint) http://www-306.ibm.com/able/education/

39. Accessible Web Design Basics Web pages should be keyboard enabled Hawaii Voyager Library Catalog Catalog Books, Videos, etc. in UH System Libraries Electronic Resources Find Articles & Data in Online Indexes, Full Text Databases, Journals, Newspapers, eBooks Digital Reference Shelf Quick online access to fact-based fact-based reference sources Online Archive Collections Scanned Photographs, Documents, Art Prints Learning the Library Digital Reference, Online Tutorials, Classes, Subject Guides

40. Accessible Web Design Basics (Source: http://www.webaim.org/simulations/screenreader)http://www.webaim.org/simulations/screenreader

41. "A text equivalent for every non-text element shall be provided." Insert an alt attribute for every non-text element. (Source:http://www.section508.gov/training/index.cfm?FuseAction=LessonPages&LessonID=3&Sta rtRow508=11&EndRow508=11)http://www.section508.gov/training/index.cfm?FuseAction=LessonPages&LessonID=3&Sta rtRow508=11&EndRow508=11 Insert an alt attribute for every non-text element.

42. Accessible Web Design Basics Non-text elements (graphics), HTML tables, frames, image maps and other navigational elements can in many cases be made accessible through proper coding Scanned PDF documents should have HTML or downloadable Word document equivalents Web multimedia should be closed-captioned or accompanied by transcripts

43. Test Your Site for Accessibility Watchfire WebXACT http://webxact.watchfire.com/ HiSoftware Cynthia Says http://easi.cc/workshops/easiweb.htm VisCheck (for colorblindness) http://www.vischeck.com/vischeck/

48. Just checking to see if youre still awake. PABLO PUDGE P

49. Cascading Style Sheets (CSS) Future Uses

50. What are Stylesheets? One file holds patterns for a master design Layout Fonts Colors Overall look of your site (Source: http://www.yourhtmlsource.com/stylesheets/introduction.htmlhttp://www.yourhtmlsource.com/stylesheets/introduction.html

51. Benefits of CSS Define things once Pages download faster Maintenance Modify one CSS file All the HTML pages reading that file will change

52. Benefits of CSS Site is consistent throughout all pages Allows you to configure text for many devices Multiple web browsers (Firefox, IE, Navigator) PDAs (http://www.libs.uga.edu/pda/#)http://www.libs.uga.edu/pda/# Cell phones Ensures that web users with disabilities can use your site

53. Sample Style Sheets You insert text to different backgrounds. The backgrounds are controlled by the style sheet. http://www.csszengarden.com/zengarden-sample.html http://www.csszengarden.com/