Web Accessibility Trerise

Views:
 
Category: Entertainment
     
 

Presentation Description

No description available.

Comments

Presentation Transcript

Slide 1: 

Web Accessibility What is it? Why is it important? Sharon Trerise Coordinator of Accessible IT Northeast ADA & IT Center

Resources : 

Resources AccessIT (National Center on Accessible Information Technology in Education) www.washington.edu/accessit ITTATC (Information Technology Technical Assistance and Training Center) www.ittatc.org WebAIM (Web Accessibility in Mind) www.webaim.org

Topics : 

Topics What is an accessible web page? What does accessibility mean to a person with a disability? Why should you care?

Who defines accessibility? : 

Who defines accessibility? World Wide Web Consortium Web Content Accessibility Guidelines (WCAG) version 1 (current) & version 2 (draft) 14 Guidelines: Priority Levels 1, 2 & 3 (1: must do, 2: should do, 3: may do to improve accessibility) Federal Government Section 508 of the Rehabilitation Act - § 1194.22 Web-based intranet and internet information and applications 16 Standards

Who defines accessibility? : 

Who defines accessibility? New York State New York State's Official Policy/Standards "Accessibility of State Agency Web-based Intranet and Internet Information and Applications" NYS Statewide Technology Policy P04-002http://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

Who defines accessibility? : 

Who defines accessibility? Your college or department?

What does an accessible web page mean to a person with a disability? : 

What does an accessible web page mean to a person with a disability? People who are blind or visually impaired People who are color blind People who are deaf or hearing impaired People with mobility impairments People with cognitive impairments

People who are blind : 

People who are blind Do not use a mouse May use a screen reader to listen to the content May use a refreshable Braille display All content must be accessible from the keyboard only Images, photos and graphics are unusable Colors are unusable Navigation may be difficult / confusing

Blindness: Simulation : 

Blindness: Simulation Using JAWS screen reader Accessible web page Inaccessible web page

Blindness: Accessible Design Techniques : 

Blindness: Accessible Design Techniques Provide text description for all images & photos (“alt” attribute / alt text) Provide an option to skip navigation Ensure keyboard accessibility Use meaningful links (“Class schedule” rather than “click here”) Use proper HTML (header tags, etc.) *Ins F6 Don’t write scripts that require mouse usage Do not rely on color alone to convey important information

WCAG 1.1: Text Equivalents (Priority 1) : 

WCAG 1.1: Text Equivalents (Priority 1) Provide a text equivalent for every non-text element (e.g. via “alt”, “longdesc” or in element content).

WCAG 2.1: Use of Color (Priority 1) : 

WCAG 2.1: Use of Color (Priority 1) Ensure that all information conveyed with color is also available without color, for example from context or markup WCAG 8.1: Scripts & applets (Priority 1) Make programmatic elements such as scripts and applets directly accessible or compatible with assistive technologies

WCAG 3.5: Document Structure (Priority 2) : 

WCAG 3.5: Document Structure (Priority 2) Use header elements to convey document structure and use them according to specification

People with Low Vision : 

People with Low Vision May use screen magnification software Images, photos and graphics may become unusable when enlarged Navigation may be difficult / confusing

Low Vision: Common causes : 

Low Vision: Common causes Cataracts Glaucoma

Low Vision: Common causes : 

Low Vision: Common causes Macular Degeneration Retinopathy

Low Vision: Simulation : 

Low Vision: Simulation

Low Vision: Simulation : 

Low Vision: Simulation Magnification Accessible example Less accessible example IE v. 6.0 Enlarge fonts

Low Vision: Accessible Design Techniques : 

Low Vision: Accessible Design Techniques Limit or eliminate text within graphics Have plenty of contrast Use relative rather than absolute font sizes

Slide 20: 

WCAG 2.2: Color contrast (Priority 2 & 3) Ensure that foreground & background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black & white screen WCAG 3.4: Relative sizing (Priority 2) Use relative rather than absolute units in markup language attribute values and style sheet property values

Color Blindness : 

Color Blindness Approximately 8-10% of the male population and about 0.5% of the female population experience some form of color deficiency May change color settings in browser Cell phone, PDA and text browser users may not have color Reds & greens are often indistinguishable Other colors may be indistinguishable

Color Blindness: Simulation : 

Color Blindness: Simulation Map of Hurricane Isabel (with color)

Color Blindness: Simulation : 

Color Blindness: Simulation Map of Hurricane Isabel (with red/green colorblindness) Simulated using Vischek (http://www.vischeck.com/vischeck/vischeckURL.php )

Color Blindness: Accessible Design Techniques : 

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*

Slide 26: 

WCAG 2.1: Use of Color (Priority 1) Ensure that all information conveyed with color is also available without color, for example from context or markup

People with mobility impairments : 

People with 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 or moving links are difficult to select

Mobility Impairments: Assistive Technology : 

Mobility Impairments: Assistive Technology Head wand Adaptive Keyboard Mouth stick

Mobility Impairment: Simulation : 

Mobility Impairment: Simulation Provide a way to skip over lengthy lists of navigation Inaccessible example Accessible example Ensure the page can be navigated using the keyboard only Inaccessible example

Mobility Impairments: Accessible Design Techniques : 

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 to main content” link)

Slide 31: 

WCAG 6.3: Scripts & Applets (Priority 1) Ensure that pages are usable when scripts, applets and other programmatic objects are turned off or not supported. If this is not possible, provide equivalent information on an alternative accessible page. WCAG 6.4: Device Independence (Priority 2) For scripts and applets, ensure that event handlers are input device-independent.

Slide 32: 

WCAG 7.3: Moving Content (Priority 2) Until user agents allow users to freeze moving content, avoid movement in pages. Section 508, Standard (o): Skip navigation A method shall be provided that permits users to skip repetitive navigation links.

People who are deaf or hearing impaired : 

People who are deaf or hearing impaired Audio is unusable Video clips that include audio are unusable Audio clips are unusable

Deafness: Accessible Design Techniques : 

Deafness: Accessible Design Techniques Provide transcripts for all audio content Provide synchronized captions for all video content Many people benefit Students in library w/o headset People with learning disabilities People for whom English is not their primary language People in a noisy environment Everyone (content is presented in >1 medium)

Slide 35: 

WCAG 1.4: (Priority 1) For any time-based multimedia presentation (e.g. movie or animation), synchronize equivalent alternatives (e.g. captions or auditory descriptions of the visual track) with the presentation

People with cognitive impairments : 

People with cognitive impairments 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 confusion Text-only content may be limiting

Cognitive Impairments: Example : 

Cognitive Impairments: Example Complex layouts: www.msnbc.com www.cnn.com

Cognitive Impairment: Accessible Design Techniques : 

Cognitive Impairment: 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

Slide 39: 

WCAG 14.1: Language (Priority 1) Use the clearest and simplest language appropriate for a site’s content. WCAG 7.2: Use of Blinking (Priority 2) Until user agents allow users to control blinking, avoid causing content to blink

Slide 40: 

WCAG 12.3: Large block of text (Priority 2) Divide large blocks of information into more manageable groups where natural and appropriate

Why make your web pages accessible? : 

Why make your web pages accessible? Who does your audience consist of? Students (current and prospective) Faculty Staff Alumni Parents Community World EVERYONE

Disability as a Function of Age : 

Disability as a Function of Age 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

Why make web pages accessible? : 

Why make web pages accessible? 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 http://www.microsoft.com/enable/aging/default.aspx

Web Accessibility: Designing for Everyone : 

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

authorStream Live Help