Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Web Accessibility: A Shared Responsibility


Published on

This a presentation prepared for a Montana Web Developer's Meetup in December, 2011. The focus is on collaborating with content providers and employers to share the responsibility for web accessibility.

  • I have always found it hard to meet the requirements of being a student. Ever since my years of high school, I really have no idea what professors are looking for to give good grades. After some google searching, I found this service ⇒ ⇐ who helped me write my research paper.
    Are you sure you want to  Yes  No
    Your message goes here
  • Sex in your area is here: ❶❶❶ ❶❶❶
    Are you sure you want to  Yes  No
    Your message goes here
  • Dating direct: ♥♥♥ ♥♥♥
    Are you sure you want to  Yes  No
    Your message goes here
  • That may well be worth adding - thanks for the suggestion. I'm not sure there is a place for it in this slideshow, since it's intended more as a broad overview -- but it is an important issue to know the difference, so I'll see if I can find a good place for it.
    Are you sure you want to  Yes  No
    Your message goes here
  • You might want to consider adding a slide to clarify the difference between captions and audio description. It seems that some people don't understand what they are: I was watching a DVD recently with my partner and turned on the English subtitling option (because I'm deaf and I need those) but of course did not turn on the audio description because, what is a deaf person going to do with AUDIO description?! LOL! :-D But then I found I had to explain to my partner why I wasn't using audio description--she thought it was some kind of advanced captioning system! She had no idea that audio description was for blind people until I told her! AND, she does work on section 508 compliance for her organization's website, and also has been active in some on-line disability communities, so it's not like she has been hiding in a cave where disability issues are concerned. If she didn't know what audio description were, there must be many others who are clueless also.
    Are you sure you want to  Yes  No
    Your message goes here

Web Accessibility: A Shared Responsibility

  1. 1. Web Accessibility A SHARED RESPONSIBILITY
  2. 2. Who am I? - A web designer and programmer - An advocate for web accessibility - A writer on practical accessibility
  3. 3. What am I going to talk about? 1) Overview of web accessibility 2) Collaboration between developers and creators. 3) Tips to find obvious accessibility flaws 4) Tools and resources for further work.
  4. 4. Web Accessibility: An Overview
  5. 5. Fundamentals - Techniques : - Technology specific - Rapidly changing as technology shifts - Principles : - Technology independent - Change as research learns more about human cognition
  6. 6. Knowing principles helps you learn techniques
  7. 7. Web Content Accessibility Guidelines v.2 Principles: - P erceivable - O perable - U nderstandable - R obust
  8. 8. Technology independent & Accessibility Supported - Guidelines are based on principles, not technology - Guidelines require techniques be accessibility supported to be considered accessible What the heck is “accessibility supported” supposed to mean?
  9. 9. Can assistive technology see your data? - If assistive technology tools, such as screen readers, can retrieve the information you've placed on the page. - Combines multiple facets: - Developer provides information on the page - Browser reads it and communicates to the OS - OS passes information to assistive technology
  10. 10. All browsing tools are assistive technology - Tools which translate raw data into a mode you can perceive, whether that mode is - Visual, - Aural, or - Tactile. - Standard browsers assume the ability to see, hear, and operate controls.
  11. 11. Questions?
  12. 12. Accessibility: A Shared Responsibility
  13. 13. Accessibility is collaborative - Client: - generates content - guides shape of the overall site - Designer: - colors - fonts - layout - Developer: - structure - metadata - error management
  14. 14. Outline Structure Treats entire page (not just content) as an outlined document - Content creator : how do the parts (navigation, sidebars, header, footer, content) relate to each other? - Designer : Each section needs a heading; and this works into the design as structure - Developer : Uses information to provide a heading structure that assistive tech uses as navigational tool.
  15. 15. simple wireframe.
  16. 16. Reading Order - What order should the page be read in? - Independently, what order should the content be read in? - Content creator : complex articles include captioned images, diagrams, asides, and footnotes. When should this items be read? - Designer/Developer : Uses the above information to place content in a linear order for assistive technology
  17. 17. Sample reading order.
  18. 18. Font Selection Choose fonts which allow true text usage and which are easily readable - Content creator/Designer : Understand that your choices need to be limited; use standard web fonts or fonts licensed for web embedding. - Developer : Avoid font replacement techniques with poor accessibility: Cufon, sIFR, or image replacement. True text is faster, cheaper, and more flexible, as well!
  19. 19. Preparing Content Write content with linking text and outline structure in mind; use the simplest language appropriate to the topic. - Content creator : Will your audience understand this text? Do links use natural language and clearly define their targets? Is an article broken into discrete, scannable chunks? - Designer / Developer : Should be thinking about these issues while laying out content, and point out issues needing re-writes as they go.
  20. 20. Video. Audio. Animation. Require the most complex accessibility implementations. - Content creator : Provide transcripts, avoid strobing content – plan ahead so that developers have enough time - Designer/Developer : Implement captions, audio descriptions. Don't auto-start; make sure controls are keyboard accessible.
  21. 21. Questions?
  22. 22. Seeing with other eyes TESTING WITHOUT TOOLS
  23. 23. Testing doesn't always need special tools - Understanding how disabilities use a site - Learning how to see potential problems - Applying the principles of accessibility support
  24. 24. Think like assistive technology - Imaging you were blind isn't sufficient; you also have to think like a machine - You have to understand what information is available to the computer. This form of testing is only an overview: it can't detect every problem. It can forestall endemic issues, however.
  25. 25. The Blind Experience - Is keyboard dependent. - Uses complex keyboard commands - Gets information about visual objects from related text Can links be visited via keyboard? Form fields? Submit buttons? Are form responses announced when a form is submitted? Has the web site defined keyboard controls which may conflict with the assistive technology? Do images and videos have text equivalents?
  26. 26. Low vision or partial sight. - Use OS tools or assistive technology with screen magnification - May adjust browser settings to increase font size - May use alternate contrast schemes - May have narrow field of vision Is all text visible when the font size is enlarged? Are line lengths to long for lines to be followed using screen magnifiers? Is contrast sufficient for text to be legible with poor light perception or color blindness? Do instructions depend on color identification for success?
  27. 27. Reduced fine motor skills. - May use a mouse, but have difficulty controlling it with precision. - May be keyboard dependent. - May use special pointing devices such as a mouth stick, head wand, or eye tracker. Are clickable areas large enough to activate using less refined pointing devices such as a mouth stick or head wand? Is keyboard focus visible, so keyboard dependent users can tell what they are currently activating?
  28. 28. Cognitive Limitations. - May need extra time to complete time-based tasks. - May become confused if navigation or layout of site changes significantly from page to page - May need orientation tools to return to previous pages - May be highly distracted by motion or sound Concerns relating to learning disabilities range broadly across issues with recall, comprehension, reading skill, attention, and spatial cognition. Use of contrast, color coordination of related items, choice of fonts, and simplification of written text are among the rich variety of strategies for supporting these issues.
  29. 29. Questions?
  30. 30. Refining perceptions TOOLS AND RESOURCES
  31. 31. Overview of testing. The best testing is to put a group of assistive tech users in front of your site, and set them tasks to accomplish. This is, obviously, beyond the means of most developers and clients. The compromise is threefold: - Limit use of newer, less-tested technologies. - Keep up with those who are doing full-scale testing. - Research new features thoroughly.
  32. 32. General purpose tools (free!). - Firefox Accessibility Toolbar: - Internet Explorer Accessibility Toolbar: - WebAIM's WAVE tester: - Windows 'Ease of Access': - MacOS Accessibility:
  33. 33. Color contrast testing tools (free!). - Firefox ColorZilla extension: - - Color contrast comparison tool: - Color contrast exploration tool: - ColorPic eyedrop tool:
  34. 34. Screen reader tools (free). - WebAnywhere: (web) - NVDA: (Windows) - VoiceOver: (Mac) – it's built in! Screen reader tools (not at all free). - JAWS: - Window-Eyes: - Zoomtext: + many, many others.
  35. 35. Secondary Tools. - W3C HTML Validator: - W3C CSS Validator: - W3C Semantic Extractor: - HTML 5 Outline Generator:
  36. 36. Finding more information. - WCAG Recommended Techniques : highly technical, though simpler than the WCAG itself. - WebAIM: Simplified summaries, recommendations. Extensive documentation on almost every accessibility topic: - University of Minnesota, Duluth Web Design References: Extensive curated catalog of accessibility articles on the web: