1 / 24

Is Your Website Accessible?

Is Your Website Accessible? . Stephanie M. Brown School of Health, Physical Education, and Recreation Indiana University. Session Outline. What is web accessibility? Web accessibility guidelines Evaluating your own website Resources. Web Accessibility - What it is.

arch
Télécharger la présentation

Is Your Website Accessible?

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. Is Your Website Accessible? Stephanie M. Brown School of Health, Physical Education, and Recreation Indiana University

  2. Session Outline • What is web accessibility? • Web accessibility guidelines • Evaluating your own website • Resources

  3. Web Accessibility - What it is • Everyone, regardless of ability, can use the web • Navigate • Understand • Interact • Contribute • If you are conveying information, everybody should have equal access to it

  4. Disabilities to Keep In Mind • Visual • Blindness • Low vision • Color blindness • Auditory • Deafness • Hard of hearing • Physical • Motor disabilities • Speech • Speech disabilities • Cognitive/neurological • Dyslexia/dyscalculia • Attention deficit • Intellectual disabilities • Memory impairments • Seizure disorders

  5. Web Accessibility - Why is it so Important? • It’s the right thing to do • It’s easy to do • It’s the law • Section 508 • ADA • It can increase your market • It can improve the experience for those without disabilities

  6. What are the guidelines for evaluating accessibility? • World Wide Web Consortium (W3C) Web Accessibility Initiative (WAI). • Web Content Accessibility Guidelines • Current version 1.0 • 2.0 due out soon • WCAG 1.0 versus WCAG 2.0 • Applies more broadly to different technologies • More comprehensive • Testable • Organized differently (guidelines and checkpoints versus principles and success criteria) • If you conform to 1.0, you will probably conform to 2.0

  7. Alternative Text “Provide equivalent alternatives to auditory and visual content” • Be as descriptive but succinct as possible • Use longdesc="my_description.txt“ if necessary • Caption video and multi-media (http://www.hper.indiana.edu/advancement/Carlson%20Lecture%20February%202008.qt.smil) • Alt Text turned off (http://www.brucelawson.co.uk/2008/is-alt-text-necessary-for-photo-sharing-sites) Not So Good – wedding photo Good – a bride feeds wedding cake to the groom

  8. Color “Don’t rely on color alone” • Information conveyed in color should also be available without color • Provide sufficient color contrast • http://www.angelfire.com/super/badwebs/

  9. Style Sheets “Use markup and style sheets and do so properly” • Pages should be readable without a style sheet • Separate structure from presentation • HTML and CSS (http://www.brucelawson.co.uk/2008/is-alt-text-necessary-for-photo-sharing-sites/) • Use the right DOCTYPE • HTML 4.01 Transitional

  10. Natural Language “Clarify natural language usage” • Identify primary language – EN • Avoid abbreviations and acronyms or write them out the first time

  11. Tables “Create tables that transform gracefully” • Avoid using tables for layouts • Use CSS for style AND positioning • Identify row and column headers • <TH id="header1"> and <TD headers="header1">

  12. Newer Technologies “Ensure that pages featuring new technologies transform gracefully” • Check to make sure that pages which use scripts work when scripts are turned off (http://www.w3schools.com/js/tryit.asp?filename=tryjs_text) • NOSCRIPT elements <script type="text/javascript"> <!-- document.write("Hello World!") //--> </script> <noscript>Your browser does not support JavaScript!</noscript>

  13. Time-Sensitive Content Changes “Ensure user control of time-sensitive content changes” • Avoid screen flicker, scrolling and text blink (http://www.angelfire.com/super/badwebs/)

  14. Embedded User Interfaces “Ensure direct accessibility of embedded user interfaces” • Javascripts, applets, embedded video • Event-handlers • Use onmousedown with onkeydown

  15. Device Independence “Design for device-independence” • Input/output devices • Mouse, keyboard, voice, head wand • Tab indexes and access keys • (http://www.ncaonline.org/) • (http://www.alistapart.com/articles/accesskeys/)

  16. Interim Solutions “Use interim accessibility solutions” • No pop-ups or new windows without alerting user • Don’t use auto refresh

  17. Accessible Technologies “Use W3C technologies and guidelines” • HTML, XHTML and XML for structure • CSS and XSL for style • Avoid deprecated tags • Provide alternatives to non-accessible technologies (PDF’s, etc.)

  18. Context and Orientation Info “Provide context and orientation information” • Helps users understand complex pages • Group blocks of information appropriately

  19. Navigation “Provide clear navigation mechanisms” • Site map, understandable navigation, skip over navigation • <a href="#content" accesskey="2" title="Skip to content">content</a> • http://www.w3.org/WAI/ Not So Good – for a description of our program, click here Good – for a description of our program, please visit our program info page.

  20. Clear and Simple “Ensure that documents are clear and simple” • Use simple language and grammar

  21. How Do I Evaluate My Website? • Review guidelines and plan ahead! • Examine pages using graphical browsers • Use different types and versions • Turn off style sheets, images, etc. • Examine pages using specialized browsers • Text-only • Screen readers • Screen Reader Simulator (http://www.webaim.org/simulations/screenreader.php) • Check PDF’s and other technologies • PDF Read Out Loud Feature (http://www.webaim.org/resources/reader/#outloud) • Validate site for accessibility when doing other validation checks • Have actual users test it out • http://www.indiana.edu/~iuadapts/index.html

  22. Browser Checks

  23. Resources • Web Accessibility • Web Accessibility Initiative (http://www.w3.org/WAI/) • WebAIM (http://www.webaim.org/) • Dive Into Accessibility (http://diveintoaccessibility.org/) • Web Axe (http://webaxe.blogspot.com/) • IU Standards (http://visualidentity.iu.edu/media/standards.shtml) • Section 508 • Section508.gov (http://www.section508.gov) • Validation Tools • Accessify.com (http://accessify.com/tools-and-wizards/) • ATRC Web Accessibility Checker (http://checker.atrc.utoronto.ca/index.html) • Hermish (http://www.hermish.com/) • Cynthia Says (http://www.cynthiasays.com/)

  24. Resources • Browsers • Lynx (http://www.vordweb.co.uk/standards/download_lynx.htm) • JAWS (http://www.freedomscientific.com/fs_products/software_jaws.asp) • Screen Reader Simulator (http://www.webaim.org/simulations/screenreader.php) • Opera (http://www.opera.com/) • Firefox Add-ons (https://addons.mozilla.org/en-US/firefox/) • Other • Colorblind Web Page Filter (http://colorfilter.wickline.org/) • Anybrowser.com (http://www.anybrowser.com/siteviewer.html) • Using Opera to check accessibility (http://www.webaim.org/resources/opera/) • Magpie (http://ncam.wgbh.org/webaccess/magpie/) • Adobe Accessibility Resource Center (http://www.adobe.com/accessibility/) • Flash (http://www.webaim.org/techniques/flash/) • RIA (http://webaim.org/techniques/aria/) • PDF Read Out Loud (http://www.webaim.org/resources/reader/#outloud)

More Related