1 / 55

Creating Accessible Educational Web Media

Creating Accessible Educational Web Media. Accessing Higher Ground November 2012 Suzanne Taylor, Director, Accessibility Solutions, Pearson Kathleen Wahlbin, Senior Accessibility Specialist, Pearson. Contents. Pearson Guidelines Guidelines that require functionality

dai
Download Presentation

Creating Accessible Educational Web Media

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Creating Accessible Educational Web Media • Accessing Higher Ground • November 2012 • Suzanne Taylor, Director, Accessibility Solutions, Pearson • Kathleen Wahlbin, Senior Accessibility Specialist, Pearson

  2. Contents • Pearson Guidelines • Guidelines that require functionality • Guidelines that impact the visual design • Guidelines that focus on coding standards

  3. 1 The Pearson Guidelines Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  4. Pearson GuidelinesFor Digital Learning Products & Services • Section 508 (current & refresh) • WCAG 2.0 Level AA • Customized for Education • Important information for our products bubbled up to the surface • http://wps.pearsoned.com/accessibility Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  5. Pearson Guidelines - GoalsFor Digital Learning Products & Services • Time to work with the material • Not missing anything • Confident not missing anything • Everyone can discuss the material & work together • http://wps.pearsoned.com/accessibility Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  6. Pearson Guidelines - Resources Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  7. 36. TranscriptsResources inside the Guidelines Site Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  8. Breakdown of Guidelines into Three Categories. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  9. Guidelines that require functionality Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  10. Guideline 2: Time limitsAllow users to adjust short-term (20 hours or less) time limits to at least ten times the default. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  11. Guideline 3: Timed TestsIf Pearson Guideline 2 would invalidate a timed activity: • Allow instructors to adjust time limits for particular students • OR, Allow students to adjust the time or just complete the activity after the time limit is reached. And, record the time spent with the results. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  12. Guideline 24: Ability to Stop MotionAllow users to stop any content that moves for more than five seconds or that updates automatically. http://abc.go.com/watch/the-neighbors/SH55199654/VD55243605/larry-bird-and-the-iron-throne Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  13. What if you pause a show? http://abc.go.com/watch/the-neighbors/SH55199654/VD55243605/larry-bird-and-the-iron-throne Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  14. What if you pause a show? http://abc.go.com/watch/the-neighbors/SH55199654/VD55243605/larry-bird-and-the-iron-throne Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  15. Guideline 25: Still View of Moving ContentAllow the user to read text, equations & diagrams while they are not moving, autoscrolling or being automatically changed/replaced. • Mobile device – can only see a portion of screen at once • Magnifier – can only see a portion of screen at once Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  16. Complete Narration • Audio Description Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  17. Guideline 31: Complete Narration Avoiding need for Audio Description • “Look what happens. Explain the reason for this in the space provided.” Image from Mehran Moghtadai and Wikipedia Commons Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  18. Guideline 31: Complete Narration Avoiding need for Audio Description • “We can see that where the green tube enters either glass, the tube appears to be broken, starting over again from a point a little ways away. The same thing happens again as the green tube enters either liquid. • Explain the reason for • this in the space • provided.” Image from Mehran Moghtadai and Wikipedia Commons Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  19. Guideline 31: Complete Narration Helpful to draw student attention Image from Mehran Moghtadai and Wikipedia Commons Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  20. Guideline 31: Complete Narration or Audio DescriptionExplain Confusing Sounds • Only need to describe visual elements necessary to understand • But what if a Lion keep growling while the speaker speaks over it? Pretty confusing! • Try to work the information in in a natural way, "Professor Smith of the Smith Zoo speaks to a small crowd at the zoo's lion exhibit." Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  21. Guideline 37: CaptionsWhen movies, animations, slideshows or games use synchronized visuals and sound to provide information, use captions to provide all important auditory information. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  22. Guideline 37: CaptionsWhen movies, animations, slideshows or games use synchronized visuals and sound to provide information, use captions to provide all important auditory information. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  23. [Angrily] [Amused] [Laughing] [With Surprise] 36. Transcripts - SpeakersWhen audio provides information, provide the same information in a text transcript Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  24. 38. Mirroring Source Materials Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  25. 36. TranscriptsWhen audio provides information, provide the same information in a text transcript Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  26. 36. TranscriptsWhen audio provides information, provide the same information in a text transcript Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  27. 38. Mirroring Source MaterialsAnother key example is when a PDF or eBook is used by some students while others use a printed book. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  28. Guideline 39: User ContentWhen end users (e.g. students, instructors) can upload or create content, allow and facilitate alternatives for non-text content (e.g. alt-text for images, captions and audio descriptions for video, transcripts for audio) and, where significant text editing is possible, semantic markup (e.g. headings, data tables and lists). Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  29. Guidelines that Apply to the Default AppearanceA few standards apply to the default appearance Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  30. Guideline 26: Contrast for Text ReadabilityUsing a contrast ratio tool, choose text color and text background color so that the contrast ratio between the colors is at least: • 4.5:1 for small text • 3:1 for text that is at least 18 points or bold 14 points • 7:1 when one of the colors is red (or nearly red) and other color is black (or nearly black) Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  31. Guideline 26: Contrast for Text Readability7:1 when one of the colors is red (or nearly red) and other color is black (or nearly black) Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  32. Guideline 26: Contrast for Text ReadabilityPixel Selection Recommendations Most-favorable Pixel Inside Least-favorable Pixel Outside Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  33. Guideline 27 Guideline 28 Guideline 26 Average Protanope Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  34. Demos Adjusted for Users with Colorblindness Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  35. Guidelines about following coding standardsMost of the Requirements are Invisible Coding Practices • No way to tell from the screen shots! Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  36. Communication between students • Communication between instructors • Communication between students and instructors • Communication with Customer Support Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  37. Users with low vision • Users with learning disabilities • Dragon users Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  38. 30. Image Buttons & LinksIf an image represents a control or a link, provide text that can serve the same purpose when images are not available. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  39. 30. Image Buttons & LinksIf an image represents a control or a link, provide text that can serve the same purpose when images are not available. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  40. Guideline 11: Semantic MarkupIdentify roles (e.g. heading, numbered list, data table) of page elements using conventions for the media type. (And do not misidentify roles by using those conventions solely for their visual effects.) Example of mismatched semantics Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  41. Guideline 11: Semantic MarkupIdentify roles (e.g. heading, numbered list, data table) of page elements using conventions for the media type. (And do not misidentify roles by using those conventions solely for their visual effects.) Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  42. Guideline 11: Semantic MarkupIdentify roles (e.g. heading, numbered list, data table) of page elements using conventions for the media type. (And do not misidentify roles by using those conventions solely for their visual effects.) Example of matched semantics Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  43. Guideline 11: Semantic MarkupIdentify roles (e.g. heading, numbered list, data table) of page elements using conventions for the media type. (And do not misidentify roles by using those conventions solely for their visual effects.) Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  44. Reading Order Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  45. ARIA & Controlling Focus • ARIA Alert from Example Site Test Page Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  46. News Updated Hourly • Let the user know the area is dynamic • Additional: Provide options if notifications might be disruptive • Messages from Your Classmates Read headline when updated Read headline when updated Play Beep when updated Play Beep when updated Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  47. Using formatting for emphasis is just fine! Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  48. Error Example • Fix Example Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

  49. Staying on Task • Write text alternatives that serve the same purpose as the image, do not just label the image. • Do not use alt-text to provide new information that is not in the image. • Do not write text alternatives for images that are merely decorative. (See Pearson Guideline 38) • Do not provide more than brief labels for images that only repeat information that is already present in the text. Accessible Educational Web Media | AHG 2012 | Kathy Wahlbin & Suzanne Taylor

More Related