WCA
Download as PPTX, PDF•1 like•165 views
The document discusses guidelines for making web content accessible to people with disabilities. It covers principles of accessibility, including making content perceivable, operable, understandable and robust. Specific guidelines are provided for meeting Level A, AA and AAA of the Web Content Accessibility Guidelines (WCAG) 2.0. Meeting these standards helps ensure universal access to information on the web for all users regardless of ability or disability. Laws requiring accessibility are also mentioned for the US, Canada and internationally.
WCA
- 1. Accessibility For Web Web design accessible for all.
- 2. Designing for Accessibility The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.
- 3. What is Disability? Sight disability – for example, blind, partially sighted or color blind Hearing disability – for example, deaf or hard of hearing Motor disability – for example, problems with motor skills or slow movement Cognitive disability – for example, learning difficulties or problems with concentration or reading
- 4. It’s the law. - USA Designing accessible websites is not just a good thing to do – it’s the law. Section 508 Sections 501 and 505 Section 503 Section 504
- 5. It’s the law. - Canada Organizations with 50 or more employees in Ontario have to meet web accessibility standards Any content published after January 1, 2012, must conform to the WCAG 2.0 Level A Beginning January 1, 2021, all public websites must conform to WCAG 2.0 Level AA Organizations don’t have to modify content posted before 2012 unless they are asked.
- 7. Principles of web Accessibility When websites are properly designed, written and programmed using WCAG 2.0 principles, they offer universal access to information.
- 8. The Web Content Accessibility Guidelines 2.0 are organised into three levels of conformance: Level A – the most basic web accessibility features Level AA – deals with the biggest and most common barriers for disabled users Level AAA – the highest (and most complex) level of web accessibility WCAG 2.0 Levels
- 9. Principle #1: Perceivable People with visual impairments often require text alternatives A user with significant visual impairment may also use a screen reader The key to ensuring readability for users with low vision is contrast Difficulty distinguishing between red and green, or yellow and blue (Make sure that colors are not your only method of conveying important information) Use a contrast analyzer to ensure there is enough differentiation between text and background colours
- 10. Principle #1: Perceivable - Tools A few popular assistive technologies that you might want to research are: BrowseAloud JAWS (Job Access With Speech) Lynx Microsoft Magnifier Window-Eyes
- 11. Principle #1: Perceivable - Examples (A) Text Alternatives Audio-only and Video-only (Pre-recorded) Captions (Pre-recorded) Audio Description or Media Alternative (Pre-recorded) Provide a link to a full text transcript or Make an alternative version of the video where the regular soundtrack is replaced by one with audio description and link to this from near the regular content Use of Color
- 12. Principle #1: Perceivable - Examples (AA) Captions (Live) Audio Description for video content (Pre-recorded) - Alternative version of your video with an audio description soundtrack and link to it from near the original content. Contrast (Minimum) - Color Contrast Checker Resize Text - up to 200% without losing content or functions Images of Text - (quotes as text, do not use an image of text)
- 13. Principle #1: Perceivable - Examples (AAA) Sign Language (Pre-recorded) Extended Audio Description (Pre-recorded) Media Alternative (Pre-recorded) - Media without audio (Provide a link to a full text transcript for all video, media content and animation, whether it has audio or not) Audio-only (Live) - All live content with an audio element is captioned by a professional subtitler and displayed near the original content Contrast (Enhanced)
- 14. Principle #1: Perceivable - Examples (AAA) Visual Presentation Enable the user to select from a number of background and foreground colours Text blocks must be no wider than 80 characters Text is not justified to both sides of the webpage Enable the user to select from a number of line and paragraph spacing options Text can be resized in a browser up to 200% without requiring the user to scroll horizontally on an average monitor or laptop screen
- 15. Principle #2: Operable All functionality fully accessible from a keyboard Create large, clickable targets for those using a mouse If there are tables, include a text-format alternative http://www.w3.org/WAI/demos/bad/
- 16. Principle #2: Operable - Examples (A) Keyboard Accessible Keyboard Trap Timing Adjustable Pause, Stop, Hide (Moving, blinking, scrolling and auto-updating information) Three Flashes or Below(“The combined area of flashes occurring concurrently occupies no more than a total of .006 steradians within any 10 degree visual field on the screen (25% of any 10 degree visual field on the screen) at typical viewing distance”) Bypass Blocks
- 17. Principle #2: Operable - Examples (AA) Multiple Ways Headings and Labels Focus Visible
- 18. Principle #2: Operable - Examples (AAA) Keyboard (No Exception) - Pointer-controlled content No Timing Interruptions Re-authenticating Three Flashes Location
- 19. The information and the operation of user interface must be understandable. The W3C says: Make text readable and understandable. Make content appear and operate in predictable ways. Help users avoid and correct mistakes Principle #3: Understandable
- 20. Language of Page On Focus On Input Error Identification Labels or Instructions Principle #3: Understandable - Examples (A)
- 21. Language of Parts Consistent Navigation Consistent Identification Error Suggestion Error Prevention (Legal, Financial Data) Principle #3: Understandable - Examples (AA)
- 22. Unusual Words Abbreviations Reading Level Pronunciation Change on Request Help Principle #3: Understandable - Examples (AAA)
- 23. “Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.” ● The foundation for any website should be semantic HTML, with CSS recommended for the presentation layer and JavaScript deployed to guide and support user behaviour. ● With functional HTML as a base, website content should be accessible through all browsers, regardless of what tools are deployed by individual users. Principle #4: Robust
- 24. ● Parsing - Assistive technology may encounter issues that regular browsers can ignore. HTML must be checked for errors ● Name, Role, Value Principle #4: Robust - Examples (A)