Download Source

Accessibility
Kate Bronstad
INF 385E
Information Architecture
and Design I
November 2nd, 2006
Overview
•Accessibility & Disability
•Why Accessbility is important
•Web Guidelines & Standards
•Accessible practices you can
adopt
•Resources
•References
What is (web) Accessibility?
“Web resources are ‘accessible’ if
people with disabilities can use
them as effectively as nondisabled people”
-UT Accessibility Institute,
www.utexas.edu/research/accessibility
Types of disabilities
•Visual
- blind, low vision, and color blind
•Motor/Physical
•Auditory
•Cognitive Learning
Why accessibility matters
•Human rights
•Good business practice
•Legality
-section 508
-TX HB 2819
-ADA?
Target vs. the Blind
Judge rejected Target’s argument
that ADA only applied to physical
spaces. The case will proceed.
Accessibility for others:
•Slow Internet Connection
•Old Browser
•Missing Plugins
•No Speakers
•Small Display (pda, mobile phone)
•Eyes busy / Hands busy
•Noisy Environment
Source:http://www.utexas.edu/learn/accessibility/disability.html
Web Accessibility Guidelines
•WCAG 1.0
-official W3C recommendation
-WCAG 2.0 in draft
•Section 508 checkpoints
-based on WCAG 1.0
WCAG 2.0 Principle 1
•Content must be perceivable
–Give text descriptions for all non-text (but
still meaningful) content
–For multi-media content, provide
synched alternatives
–Distinguish content from presentation
–Make distinction between foreground
information and background obvious
WCAG 2.0 Principle 2
•Interface components in the content must be
operable
–Everything functional by keyboard
–Allow for user-controlled time limits
–If your content could cause a photosensitive
person to have a seizure, at least find a way to
guard them from it.
–Give the user easy ways to understand, navigate,
and orient themselves in the page
–Reduce ways users could make mistakes, and
make it easy for them to correct mistakes.
WCAG 2.0 Principles 3 & 4
•Content and controls must be understandable
–“Make text content readable and understandable”
–“Make the placement and functionality of content
predictable”
•Content should be robust enough to work with current
and future user agents (including assistive
technologies)
–Support compatibility with current and future user
agents (including assistive technologies)
–Ensure that content is accessible or provide an
accessible alternative
-Source: http://www.w3.org/TR/WCAG20/
WCAG 2.0 = POUR
Perceivable
Operable
Understandable
Robust
-Source: http://www.w3.org/TR/WCAG20/
What is accessible?
Transformability:
Presenting and structuring
information so that it can be
perceived in multiple ways
Small things = big difference
•Alt use – in moderation
•Skip navigation links
•Semantic structure
Best <alt> practices
•Accurately represent the same information
and function as the image
•If the image is decorative, or part of a link,
use alt=“”
•If image is within a form, use alt to describe
the function (ex. alt= “submit search”)
•Don’t use “image of” or “link to” when coding
makes this apparent
Skip navigation links
•Add a “skip navigation” link at the
top of the page
•Visible or invisible (with CSS keyboard focus)
Source:http://www.webaim.org/techniques/skipnav/
Semantic structure
•Convey meaning that doesn’t rely on context
of presentation
•Use hierarchical heading structure (ex. h1 is
most important)
•Use <strong> for bold and <em> for italics
•Use lists correctly
Semantic structure
•In non-layout tables, use <th> to define rows
and columns,plus “headers” and “ids” for
more complicated tables
•For layout tables, use CSS
•With forms, use <label> to describe the
information the user should enter
•Also use <label> in pull-down menu to
describe what user can choose to do
Other basic points
•Avoid pull-down menus for navigation,
provide alternative if needed.
•Make text of hyperlinks comprehensible on
their own, not just “click here”
•Use <acronym> and <abbr> when called for.
•If site has site map, have link on every page
Accessibility and Web 2.0
•User generated content and AJAX
complicate things.
•If use JavaScript/AJAX, do so with caution
Ways to check your website
•Turn off the images and sound
•Tab through site
•Use screen reader emulator like FANGS
•Use online tools like WAVE,
http://wave.webaim.org/index.jsp
Links to Resources
UT
Accessibility Institute
http://www.utexas.edu/research/accessibility/
Designing Accessible Websites
http://www.utexas.edu/learn/accessibility/
WCAG
Web Content Accessibility Guidelines
http://www.w3.org/TR/WAI-WEBCONTENT/
Links to Resources
TOOLS AND SAMPLE CODE
http://accessify.com/
http://webaim.org/
WAVE:
http://wave.webaim.org/index.jsp
Adobe Accessibility:
http://www.adobe.com/accessibility/index.html
W3C Accessibility Tools:
http://www.w3.org/WAI/ER/tools/
References
“Appropriate use of alternative text”.WebAIM
http://webaim.org/techniques/alttext
“Attractive, Accessible Websites”,
http://accessify.com/features/articles/good-lookers/
“Creating Semantic Structure”. WebAIM
http://www.webaim.org/techniques/semanticstructure/
“The future of web accessibility”,
http://www.webcredible.co.uk/user-friendlyresources/weaccessibility/future.shtml
References
“ ‘Skip navigation’ Links”, webAIM
http://www.webaim.org/techniques/skipnav/
Sutel, Seth. “Blind web surfers sue for accessibility”. AP.
Retrieved from:
http://biz.yahoo.com/ap/061024/business_of_life.html 10/24/06
UT Accessibility Institute,
http://www.utexas.edu/research/accessibility/resource
“Web Content Accessibility Guidelines 2.0 Checklist”, W3C,
http://www.w3.org/TR/2005/WD-WCAG20-20050630/checklistlinear.html