Engineering Usability and Accessibility into Portlets and Portals
•
0 likes•654 views
Recommended
More Related Content
Viewers also liked
Recently uploaded
Recently uploaded (20)
Engineering Usability and Accessibility into Portlets and Portals
- 1. Engineering Usability and Accessibility into Portlets and Portals A Presentation By: RAJESH KUMAR TRILOKHRIA 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 2. Engineering Usability and Accessibility into Portlets and Portals Agenda User eXperience (UX) Usability Accessibility Best practices CampusEAI audit process 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 3. Engineering Usability and Accessibility into Portlets and Portals UX 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 4. Engineering Usability and Accessibility into Portlets and Portals 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 5. Engineering Usability and Accessibility into Portlets and Portals 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 6. Engineering Usability and Accessibility into Portlets and Portals User Experience Design User design Self design Task-oriented Intuition-oriented Sympathetic Confident Accessible Usable 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 7. Engineering Usability and Accessibility into Portlets and Portals User Experience Design Vision Feedback Culture 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 8. Engineering Usability and Accessibility into Portlets and Portals Why should I bother? Social Technical Financial Legal 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 9. Engineering Usability and Accessibility into Portlets and Portals Usability 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 10. Engineering Usability and Accessibility into Portlets and Portals Principles Learnability Efficiency Memorability Recoverability Functionality Satisfaction 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 11. Engineering Usability and Accessibility into Portlets and Portals Principles: User-centered General Fast Mapping Learnability Efficiency Memorability Visibly Answers THEM handled Recoverability Functionality Satisfaction 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 12. Engineering Usability and Accessibility into Portlets and Portals Principles: Self-centered Simple Practical Intuition Learnability Efficiency Memorability Hidden by Questions ME design Recoverability Functionality Satisfaction 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 13. Engineering Usability and Accessibility into Portlets and Portals Challenges Dynamic navigation Errors (misconfiguration) Customization Cluttered screen / complex layout 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 14. Engineering Usability and Accessibility into Portlets and Portals Workshop 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 15. Engineering Usability and Accessibility into Portlets and Portals Accessibilit y 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 16. Engineering Usability and Accessibility into Portlets and Portals Accessibility A hostile environment 97% of websites fail to meet basic requirements 600-750 million people have a disability 3 out of every 10 families 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 17. Engineering Usability and Accessibility into Portlets and Portals Standards and guidelines WCAG 1.0 WCAG 2.0 Section 508 (USA) DDA (UK) IBM Guidelines IEEE Standards Internal Organization Guidelines 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 18. Engineering Usability and Accessibility into Portlets and Portals Standards and guidelines WAI w3.org/WAI/ 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 19. Engineering Usability and Accessibility into Portlets and Portals Access Barriers Visual Auditory Mobility Cognitive Learning Technologica l 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 20. Engineering Usability and Accessibility into Portlets and Portals Access Barriers Visual Auditory Mobility Cognitive Learning Technologica l 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 21. Engineering Usability and Accessibility into Portlets and Portals Access Barriers Visual Auditory Mobility Cognitive Learning Technologica l 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 22. Engineering Usability and Accessibility into Portlets and Portals A Personal Perspective 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 23. Engineering Usability and Accessibility into Portlets and Portals Workshop 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 24. Engineering Usability and Accessibility into Portlets and Portals Access Barriers Visual Auditory Mobility Cognitive Learning Technologica l 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 25. Engineering Usability and Accessibility into Portlets and Portals Access Barriers Visual Auditory Mobility Cognitive Learning Technologica l 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 26. Engineering Usability and Accessibility into Portlets and Portals A Personal Perspective 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 27. Engineering Usability and Accessibility into Portlets and Portals Workshop 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 28. Engineering Usability and Accessibility into Portlets and Portals Best Practices 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 29. Engineering Usability and Accessibility into Portlets and Portals Testing for Accessibility Practical testing with disabled people Stand alone software Deque Ramp, InFocus by SSB, Fujitsu Web Accessibility Inspector Online tools for accessibility checking Cynthia Says, WAVE, WebXact, Watchfire® Bobby 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 30. Engineering Usability and Accessibility into Portlets and Portals CEAI Audit 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 31. Engineering Usability and Accessibility into Portlets and Portals CampusEAI Audit Process Design Web Accessibility Standards Usability Performance Functionality jonathan_mullapudy@campuseai.org 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 32. Engineering Usability and Accessibility into Portlets and Portals User Experience Design Vision Feedback Culture 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
- 33. Thank you. 1940 East 6th Street • 11th Floor • Cleveland • Ohio 44114 • Tel: 216.589.9626 • Fax: 216.589.9639 info@campuseai.org• http://www.campuseai.org
Editor's Notes
- Above all, we want a user experience to be valuable. If it isn’t, we should work on something else.
- You start with findability (do I know about it?), then accessibility (can I perceive it?), desirability (is this something I want to use?), usability (how easy is this to use?), credibility (now that I’m using it do I trust its results?), and usefulness (did this help me do what I wanted/needed to do?) and finally value (will I use this again? Will I depend on this?)
- If you focus on the just the user or just yourself, can you really create successful user experiences for the universe of users?User-centered versus self-centered design.Microsoft (15,000 user tests a year; user-centered)Apple (barely any; self-centered)
- UCD is dogma. Self-design is dogma. There is a center: UX.Source: Jared Spool, “Journey to the Center of Design”, sxsw interactive 2009 * Vision - Can everyone on the team describe what the experience of using your design will be like five years from now (an experience vision)? (me) * Feedback loop - In the last six weeks, have you spent more than 2 hours watching someone use your design or a competitor’s design? (them) * Great culture - In the last six weeks, have you rewarded a team member for creating a major design failure (accepting making mistakes means you honor learning from mistakes; if you are completely risk averse where everything has to be perfect, you put out drek)? (us)
- Describe each:Social - Positive Public Image - Web Accessibility is an Aspect of Social Responsibility- Improved Usability - Web Accessibility Benefits People With and Without Disabilities Increased interaction between your site and end usersTechnical Reduce Development and Maintenance TimeEnable Content for Different Configurations - write it once, use it many times Be Prepared for Advanced Web Technologies - future proof your siteFinancial Decreases the need for creating multiple versions of a site for different devices Improved Search Engine ranking - Increased Web Site use by reaching a wider audienceLegal Web Accessibility is Essential for Equal Opportunity Proactive initiatives are defensive Legal liabilities generally un-tested - negative publicity
- Is it just about not making me think?
- Learnability: familiar, consistent, general (related to previous experience), predictable, simpleEfficiency: time to completion for tasks, practicality of method for completing tasksMemorability: do users repeat initial mistakes after a time has passed since the last time they used the product? How intuitive is the experience? What kinds of aliases does your product provide (symbols)?Recoverability: how well do you handle errors or design applications to not have errors?Functionality: does the tool solve my problem? does it do so in the way I would expect? Satisfaction: is this the tool for me? How successful do I feel after using the tool? Do I feel like the developer had me in mind? Do I enjoy using the tool?
- Thinking about THEM.
- Thinking about ME.Self-centered design is about delivering products where quality is high because you only create what you know, and adoption can be high because you are developing for people who might not have found another solution yet (nonconsumers)
- Accessibility means making sure yourwebsite is accessible to all users, regardless of abilityor disability.Basic requirements are: keyboard navigation, descriptive text for non-text artifacts, and use of headers to provide outline navigationThere is a continuum of ability and disability; almost everyone has some level of disability, just like people have different strengths in ability. Some disabilities are severe obstacles to gaining access to the information the rest of us take for granted.
- These guidelines and laws started out as technical ways to accommodate people with disabilities (post development).
- (WAI) develops guidelines for accessibility of Web sites, browsers, and authoring tools, in order to make it easier for people with disabilities to use the Web.Guidelines like the Web Accessibility Initiative (WAI) are starting to take a design-level approach for the equitable use of web content:Web content must be perceivable, interface elements must be operable, content/controls must be understandable, and content must be sustainable (withstand future technological change).
- Going to talk about three of them.
- Visual DisabilitiesBlindnessScreen readersScreen reader limitationsImagesVisual layoutData tablesKeyboard accessibilityLow VisionFixed Fonts should be avoidedScreen Magnifiers - Use true text as much as possible, rather than text in graphicsHigh ContrastUser % for document layoutColor BlindnessColor must not be the only means of conveying information.Foreground and background Color pairs must have sufficient contrastColors must be declared in the style sheet
- Kyle, a student at Utah State University who is blind, shares his perspective on Web accessibility and screen readers in the video below. *Source - www.webaim.org/articles/visual/blind.php
- Auditory DisabilitiesAudio is unusableProvide transcripts for audio clips
- Motor DisabilitiesMake sure that all functions are available from the keyboard (try tabbing from link to link).Make sure that your pages are error-tolerant (e.g. ask \"are you sure you want to delete this file?\"), do not create small links or moving links.Provide a method for skipping over long lists of links or other lengthy content.In addition to onMouseOver and onMouseOut, use onFocus and onBlur.
- Gordon Richins, Consumer Liaison at the Center for Persons with Disabilities at Utah State University, who has quadriplegia, shares his perspective on web accessibility. *Source - www.webaim.org/articles/motor/motordisabilities.php
- Engaging disabled users in testing your website with real tasks is a guaranteed way of ensuring everyone can use your website easily and effectively.screen reader (Jaws/Window-Eyes/Hal) magnification software (Zoomtext/Lunar/Magic) large text in browser with colour preferences
- Design AuditWeb Standard AuditAccessibility AuditUsability AuditPerformance AuditFunctionality Audit
- UCD is dogma. Self-design is dogma. There is a center: UX.Source: Jared Spool, “Journey to the Center of Design”, sxsw interactive 2009 * Vision - Can everyone on the team describe what the experience of using your design will be like five years from now (an experience vision)? (me) * Feedback loop - In the last six weeks, have you spent more than 2 hours watching someone use your design or a competitor’s design? (them) * Great culture - In the last six weeks, have you rewarded a team member for creating a major design failure (accepting making mistakes means you honor learning from mistakes; if you are completely risk averse where everything has to be perfect, you put out drek)? (us)