architecting & designing for accessibility misty mclaughlin information architecture &...
TRANSCRIPT
![Page 1: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/1.jpg)
Architecting & Designing for Accessibility
Architecting & Designing for Accessibility
Misty McLaughlinInformation Architecture &
Design I
October 19, 2004
Misty McLaughlinInformation Architecture &
Design I
October 19, 2004
![Page 2: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/2.jpg)
Accessibility
• Why and What• Types of disabilities• Assistive / adaptive technology• Legislation, policy, standards• Design techniques• Testing, simulation and repair tools• Opportunities to practice
![Page 3: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/3.jpg)
Why?
• 20 million: Americans with disabilities that seriously affect their use of the Web
• 50%: Americans over 65 with disabilities
• 500-750 million: People with disabilities internationally
• $690 million: Annual cost to make federal websites accessible
From “Who Are the Disabled?” and Maximum Accessibility
![Page 4: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/4.jpg)
What is Accessibility?Some Accessible Design Philosophy
Point of Cohesion
• Same information, same tasks• Does not depend on a single sense or ability
Points of Contention
• Accessibility v. usability • Is accessibility a patch or a fundamental
design consideration?
![Page 5: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/5.jpg)
Formal Disabilities
• Cognitive / learning• Auditory• Motor / physical• Speech
• Visual- legal blindness- impaired vision- color blindness
![Page 6: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/6.jpg)
Quasi-disabilities…a.k.a. “Access Barriers”
• Slow internet connection
• Old browser• Missing plug-ins• No speakers• Small display (old
monitors, handheld devices)
• No mouse
• Age• Language issues• Noisy environment• Eyes or hands busy• Photosensitive
epilepsy
![Page 7: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/7.jpg)
Assistive / Adaptive Technology
As defined by the Assistive Technology Act of 1998: “…any item, piece of equipment, or product
system, whether acquired commercially, modified, or customized, that is used to increase, maintain, or improve the functional capabilities of
individuals with disabilities.”
“…mediates and decodes the technology for users with disabilities.”
“…make information devices more accessible.”
![Page 8: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/8.jpg)
Assistive / Adaptive Technology
Auditory Closed captioning
Visual Screen readers & magnifiers, refreshable Braille display
Motor / physical
Alternative keyboard layout & mouse systemSlow-mo software
Speech Special voice recognition software
Cognitive / learning
???
![Page 9: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/9.jpg)
Accessibility Legislation
National• Americans With Disabilities Act (ADA) – 1990• Section 508 of the Vocational Rehabilitation Act –
1973- Requires that electronic and information technology developed, procured, maintained, or used by the Federal government be accessible to people with disabilities.
Statewide• Chapter 206 of the Texas Administrative Code,
the “Access to Information” Law - 2002
![Page 10: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/10.jpg)
Policy – In-house Rules
• UT Austin’s Web Accessibility Policy- Section 508 compliant- Accessibility policy link required- Responsibility- Testing & Documentation
![Page 11: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/11.jpg)
StandardsChecklists, guidelines, & practical info
• W3C’s WCAG (Web Content Accessibility Guidelines)– Over 60
checkpoints– International
acceptance (EU, Canada, Australia)
• Section 508 Guidelines- Applies only to federal agencies, legally- 16 checkpoints- based on WCAG’s most critical points- objective & measurable
From Maximum Accessibility
![Page 12: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/12.jpg)
Design Considerations
Some rules
• “The ultimate error that any developer of accessible applications can commit is to modify the user’s environment.”
--John Paul Mueller, Accessibility for Everybody
• Graceful transformation, understandability, navigability
--Web Content Accessibility Guidelines, W3C
![Page 13: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/13.jpg)
Visual Style
Color• Don’t use color to
convey primary meaning
• High contrast
Font•Sans-serif•Relative font size
![Page 14: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/14.jpg)
Images & Multimedia
• Provide a text-equivalent to visual or audio information (alt-text or captions)
• If video, captions / alt-text should be synchronized
• Avoid flickering
“The Living Room Candidate,” American Museum of the Moving Image
Simulation exercise for the non-disabled:
1) Turn your speakers off and watch.
2) Turn your monitor off and listen.
![Page 15: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/15.jpg)
Markup
• Correct, structural rather than fixed markup
• Use CSS to control page elements (but don’t convey critical info through CSS)
• Elastic, relative units
Avoid:• Font tags, fixed pixel
sizes
![Page 16: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/16.jpg)
Quality Content
• Plain, readable language• Quality descriptions and link text• Clear referents• Avoid jargon and specialized language
unless your audience is insider-only
![Page 17: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/17.jpg)
From Maximum Accessibility
Can Use If You Do ItCarefully
Don’t Do It If You Can Help It
Image Maps Images that blink or flicker
Data tables Decontextualized pop-ups
Graphs and charts
Scripts
Frames
Applets and plugins
Forms
![Page 18: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/18.jpg)
Tips• 1-pixel accessibility
info at the top of your page
•“Skip navigation” or “skip to main content”
•Offer alternative stylesheet option
![Page 19: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/19.jpg)
Testing, Simulation & Repair
• W3C’s Web Accessibility Initiative (WAI) - comprehensive list
• * Accessibility Toolbar (for IE) *
• Evaluating Web Site Accessibility (checklists, tips, and more)
Simulation of www.utexas.edu appearance for users with diabetic retinothopy
![Page 20: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/20.jpg)
Best Testing Tool
User testing with groups
of users who have
mixed disabilities
![Page 21: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/21.jpg)
Local Accessibility Opportunities
• Accessibility Internet Rally - AIR-Texas - AIR-University
• UT’s Accessibility Institute- Free training- Accessibility research- Site evaluation and user testing
• Knowbility Accessible Technology - Community training programs- Annual accessibility conference (free to UT students, faculty & staff)
• Jim Thatcher, Accessibility Consultant- Free training- Site evaluation
![Page 22: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/22.jpg)
ReferencesClark, Joe. Building Accessible Websites. New Riders, 2002.
Slatin, John and Rush, Sharron. Maximum Accessibility: Making Your Web Site More Usable for Everyone. Boston: Addison-Wesley, 2003.
Mueller, John Paul. Accessibility for Everybody: Understanding the Section 508 Accessibility Requirements. Berkeley: Apress, 2003.
Thatcher, Jim. Constructing Accessible Websites. San Francisco: Apress, 2003.
Van Duyne, Douglas and Landay, James and Hong, Jason. The Design of Sites: Patterns, Principles, and Processes for Crafting a Customer-Centered Web Experience. Boston: Addison-Wesley. 2002.
![Page 23: Architecting & Designing for Accessibility Misty McLaughlin Information Architecture & Design I October 19, 2004 Misty McLaughlin Information Architecture](https://reader030.vdocuments.mx/reader030/viewer/2022032604/56649e665503460f94b60ba9/html5/thumbnails/23.jpg)
Accessibility Resources Online
GlossaryToolbar
Resource CenterCourse / tutorial