Embed Size (px)
Citation preview
1
Ensuring That Your Web Communications Are Usable By All Audiences
DBTAC – Northeast ADA Center
Sharon Trerise
Coordinator of Accessible IT
Employment and Disability Institute www.edi.cornell.edu
2
Northeast ADA & IT Center
• 10 regional centers in US• Funded by National Institute on Disability and
Rehabilitation Research, US Dept. of Education• Focus on 2 areas:
– Americans with Disabilities Act– Accessible Information Technology in Education
• 800-949-4232, [email protected]• www.northeastada.org
3
Topics
• Legislation effecting college web sites• How do people with disabilities access the web• Web Accessibility Project with Community Colleges• Web Access Toolkit
4
Your Web Audience
• Students• Faculty• Staff• Alumni• Parents• Community• World
5
Source: U.S. Census Bureau Report on Americans with Disabilities: 1994-95, P70-61 (August 1997)
Based on Survey of Income and Program Participation, Oct. 1994-Jan. 1995
Disability As a Function of AgeDisability As a Function of Age
6
© 2001 Trace R&D Center, University of Wisconsin
9.5%
7
© 2001 Trace R&D Center, University of Wisconsin
10%
8
© 2001 Trace R&D Center, University of Wisconsin
14%
9© 2001 Trace R&D Center, University of Wisconsin
21%
10
© 2001 Trace R&D Center, University of Wisconsin
34%
11
© 2001 Trace R&D Center, University of Wisconsin
42%
12© 2001 Trace R&D Center, University of Wisconsin
64%
13
Continuing Education & Our Aging Population
• In 2010, the majority of the US population will be 45 years and older
Brian Basset, Cartoonist and creator of syndicated cartoon Adam@Home
14
Students with Disabilities
• Increasing percent of students in K12 & postsecondary education are disabled (~11%, higher in Community Colleges)
• Students with cognitive (learning) disabilities makes up the largest percentage of students with disabilities
15
Accessible Web Design - Who benefits?
• People with disabilities• People with slow internet connection• People using PDAs, phones or other mobile
devices, • People using older equipment to view the web• People whose primary language is not English• Seniors• People who are color blind
16
Who benefits?
EVERYONE
17
Legal considerations – Federal*
• Americans with Disabilities Act (ADA) & Section 504 of Rehabilitation Act of 1973– Prohibit discriminating against individuals with disabilities
• Office for Civil Rights (OCR)– Institutions that use the internet for communication regarding
programs, goods and services must make that information accessible;
– must “effectively communicate” with individuals with disabilities including students, faculty, staff & the wider community
18
State Legislation
• New York State's Official Policy/Standards "Accessibility of State Agency Web-based Intranet and Internet Information and Applications" – NYS Statewide Technology Policy P04-002
http://www.oft.state.ny.us/policy/p04-002/index.htm
– NYS Mandatory Technology Standard S04-001http://www.oft.state.ny.us/policy/s04-001/index.htm
19
Standards / Guidelines
• Section 508 of the Rehabilitation Act– http://www.section508.gov/index.cfm?FuseAction=
Content&ID=12
• World Wide Web Consortium (W3C)– Version 1: http://www.w3.org/TR/WCAG10/– Version 2 draft released in March 2004: (
http://www.w3.org/TR/2004/WD-WCAG20-20040311/)
20
How do People with Disabilities Access the Web?
• Blind and visually impaired• Color blind• Deaf and hearing impaired• Mobility impairments• Learning disabilities
21
Blindness
• Do not use a mouse• May use a screen
reader to listen to the content
• May use a refreshable Braille display
Images, photos and graphics are unusable
Colors are unusable
Navigation may be difficult / confusing
All content must be accessible from the keyboard
22
Blindness: Simulation
• Completely inaccessible
• Less accessible
• More accessible
23
Blindness: Accessible Design Techniques
• Provide text description for all images & photos (“alt” tags)
• Provide an option to skip navigation• Ensure keyboard accessibility• Use meaningful links (“Class schedule” rather than
“click here”)• Use proper HTML (header tags, etc.)• Don’t write scripts that require mouse usage
24
Low Vision
• Use screen magnification software
Images, photos and graphics may become unusable when enlarged
Navigation may be difficult / confusing
25
Low Vision: Common causes
• Cataracts
• Glaucoma
26
Low Vision: Common causes
• Macular Degeneration
• Retinopathy
27
Low Vision: Simulation
28
Low Vision: Simulation
• Text in graphics– Less accessible– More accessible
• Poor contrast– Less accessible
29
Low Vision: Accessible Design Techniques
• Limit or eliminate text within graphics
• Have plenty of contrast• Use relative rather than
absolute font sizes
30
Color Blindness
• Approximately 8-10% of the male population and about 0.5% of the female population experiences some
form of color deficiency • Cell phone, PDA and
text browser users may not have color
Reds & greens are often indistinguishable
Other colors may be indistinguishable
31
Color Blindness: Simulation
Map of Hurricane Isabel (with color)
32
Color Blindness: Simulation
Map of Hurricane Isabel (with red/green colorblindness)
Simulated using Vischek (http://www.vischeck.com/vischeck/vischeckURL.php )
33
Color Blindness: Simulation
Subway map
34
Simulation
• Using color for important meaning– Less Accessible
35
Color Blindness: Accessible Design Techniques
• Do not use color alone to convey content– Use additional cues or information to convey
content
The flights listed below in RED have been cancelled. The flights in GREEN are departing on time.Delta 1342United 320American Airlines 787Southwest 2390
The flights listed below that have been cancelled are indicated in RED and by an asterisk. The flights in GREEN are departing on time.Delta 1342*United 320American Airlines 787Southwest 2390*
36
Mobility Impairments
• May use only the keyboard for navigation
• May tire quickly• May not have fine
motor control
All content must be accessible from the keyboard
Lengthy navigation may cause fatigue
Small links are difficult to select
37
Mobility Impairments: Assistive Technology
• Head wand
• Adaptive Keyboard
• Mouth stick
38
Simulation
• Navigation not accessible from keyboard– Less Accessible – More Accessible
• No way to skip over lengthy navigation– Less Accessible– More Accessible
39
Mobility Impairments: Accessible Design Techniques
• Ensure that the page is keyboard accessible• Do not require fine motor control (free of
moving links or very small links)• Provide a way to skip over long lists of links &
other lengthy content (visible skip navigation link)
40
Deaf and Hard of Hearing
• Audio is unusable Video clips that include audio are unusable
Audio clips are unusable
41
Simulation
• Not Accessible
• Accessible
42
Deafness: Accessible Design Techniques
• Provide transcripts for all audio content • Provide synchronized captions for all video
content– MAGpie – free captioning tool from WGBH– HiCaption from HiSoftware
43
Cognitive Disabilities
• Users may have difficulty focusing on or comprehending lengthy sections of text
• Complex layouts or inconsistent navigational schemes may be confusing
• May need content in >1 form
Animated images may be distracting
Complex layouts may lead to confusionText-only content may be limiting
44
Cognitive Impairments: Example
• Complex layouts: – http://www.ipc.at/– www.msnbc.com
• Moving content: http://www.ohsu.edu/• Too much text: http://www.pissd.com/ • Usability testing example:
http://www.gatewaycc.edu/
45
Cognitive Disability: Accessible Design Techniques
• Simplify the layout as much as possible• Provide clear and consistent site navigation• Organize information into manageable “chunks”• Logically organize your site and individual documents• Use icons, illustrations, arrows, audio, video or other
multimedia to enhance understanding
46
PowerPoint on the web
• PowerPoint is not a web-friendly format• How to convert to accessible HTML
– Copy the outline to an HTML page & format by hand– Use HTML slide program such as WimpyPoint or
Slidemaker or OperaShow– PowerPoint Add-on (Windows only)
• University of Illinois: Office Accessibility Wizard (www.rehab.uiuc.edu/office/download.html)
– Use LecShare, Inc. to convert slides to accessible web format
47
PDF (Portable Document Format)
• Adobe Acrobat Reader Full Version 6.0 or newer
• If document was not created with accessibility in mind, it will still pose significant accessibility challenges to blind users (images w/o alt text, no headings, etc.)
48
The most reliable way to make a PDF file accessible
is to convert it to
accessible HTML.
49
Accessible PDF
• PDF files must be created with accessibility in mind– Use heading styles– Add text description for all graphics– Use bulleted or numbered list feature
• Document must:– Contain real text (not scanned image)– Be in Tagged PDF format*– Be marked up for accessibility*
50
Web Accessibility in Community Colleges Project
• 3 Phases– Survey head of Student Services at CC’s– Evaluate a sample of CC websites– Develop a web accessibility toolkit
51
86.7
87.4
81
68.9
52.4
94.8
93.7
0 20 40 60 80 100
Admissions Application
Financial Aid
Course Registration
Bursar Billing
Course Catalog
Class Schedule
Online Classes
Percent Offering Online Services
52
Guidelines governing web design
Sample = 701 Community Colleges
Requirements regarding web accessibility
50%
29%
19%
0%
10%
20%
30%
40%
50%
60%
70%
80%
90%
100%
71%
14% 14%
0%
10%
20%
30%
40%
50%
60%
70%
80%
90%
100%
Yes No Don't know
53
What do the web accessibility requirements cover?
• Of the 50% who have web accessibility requirements,– 84% of policies cover student services pages– 66% of policies cover individual department/ faculty pages– 75% cover online course content including distance learning
courses– 82% cover ALL college web pages
• POINT: More directly under control of central administration (webmaster), more likely to be covered by web policy; as opposed to under control of departments or individual faculty
84%
82%
75%
66%
0% 10% 20% 30% 40% 50% 60% 70% 80% 90% 100%
Dept / FacultyPages
DistanceLearning
Student Services
All Web Pages
54
Website Evaluations
• 30 Community College sites• Range of size and location• 4 tasks + home page
– Home page– Disability services– Class schedules– Admissions application– Financial aid
55
Manual 508 Evaluation: Process
• Code-level evaluation• Each standard rated 1 through 3
Manual 508 Evaluation: Results
• <1% of pages met all Section 508 standards that were applicable to that page
56
508 Manual Check Results(% of all relevant sets of pages n=150)
100
97
91
100
87
4
100
100
1
4
35
4
5
20
2
42
3
5
8
80
96
97
96
23
0% 10% 20% 30% 40% 50% 60% 70% 80% 90% 100%
p) Timed Response (n=1)
o) Skip Nav Links (n=136)
n) Forms (n=78)
m) Scripts - Link to accessible version (n=11)
l) Scripts -- Asst. Tech Equivalent (n=60)
k) Text-Only (n=5)
j) Flickering (n=137)
i) Frames (n=4)
h) Logical Level Headers (n=0)
g) Data table Headers (n=6)
f) Client-side image maps provided (n=0)
e) Image maps: Redundant Links (n=0)
d) CSS (n=132)
c) Color (n=142)
b) Multimedia (n=0)
a) Images (n=136)
Checkpoint (# pages included)
No Implimentation - significant barrier Partial Implimentation Full Implimentation
NA
NA
NA
NA
57
Survey*: 50% of institutions with Web Accessibility Requirements
Website Evaluations**: <1% Web Pages metSection 508 Web Accessibility Standards
*N = 701 community colleges**N = 150 web pages from 30 community college websites
58
Barriers to implementation
Costs & Staffing
Lack of technical support
Lack of knowledge /
training
Lack of awareness
Attitude; Disregard
Lack of support
from administrati
on
Lack of Faculty
Involvement
• Costs• Staffing• Training• Technical support• Awareness• Attitude• Administrative
support• Faculty
Involvement
59
Toolkit: www.webaccesstoolkit.org
• Designed for administrators and department leaders
• Involve stakeholders from many areas of campus
• Make the standards “real” (user perspective)• Provide resources for technical knowledge
and training
60
Designing with Accessibility in Mind
Incorporate accessibility
considerations in design
rather than retrofit
– Less expensive– More accessible for everyone
61
Web Accessibility: Designing for Everyone
• People using different web browsers• People using different screen resolutions• People using phone web services• People using handheld display units• People using car computing systems• People using screen readers• People who are deaf or hard of hearing• People who can’t use a mouse• People who are color blind• People with differences in attention/perception
62
To Learn More (handout)
• WebAIM (Web Accessibility in Mind)– www.webaim.org
• EASI (Equal Access to Software and Information)– www.rit.edu/~easi
• NCAM (National Center for Accessible Media), WGBH– http://ncam.wgbh.org/index.html
• AccessIT (National Center on Accessible Information Technology in Education) – http://www.washington.edu/accessit
63
Sharon [email protected]
DBTAC – Northeast ADA CenterEmployment and Disability InstituteCornell UniversitySchool of Industrial and Labor Relations201 ILR Extension BuildingIthaca, New York 14853
tel. 607.255.6751
www.northeastada.org
