1. Web Accessibility IS 373—Web Standards Todd Will

2. CIS 373---Web Standards-Accessibility 2 of 42 Topics Overview Web Accessibility Guidelines Authoring Tool Accessibility Guidelines User Agent Accessibility Guidelines How the different guidelines fit together For next week

3. CIS 373---Web Standards-Accessibility 3 of 42 What is web accessibility? Web accessibility means quite simply that those with disabilities can browse the web People with disabilities can navigate, understand, and interact with websites People with different disabilities –Visual –Auditory –Speech –Cognitive –Neurological Remember different people perceive information differently –Different disabilities affect the ability o the user to access your site

4. CIS 373---Web Standards-Accessibility 4 of 42 What is web accessibility (cont) Most sites in existence today pose some type of accessibility problem to those with a certain disability Web accessibility also benefits those with disabilities –Not limited to visual and audio browsers –Can also benefit those with slower internet connections –Also help those with temporary disabilities (broken arm, finger), only can use one hand to type –Also good PR for your organization to take those less fortunate into account Take all potential users into account when designing your site

5. CIS 373---Web Standards-Accessibility 5 of 42 Why is it important? The web is becoming an increasingly important part of everyday life –Health care –Nutrition –News –Recreation –Vacation Planning –Entertainment People with disabilities need to perform many of this items People want access to information, easiest and cheapest way to access information is on the Web Those that are paralyzed or blind that cannot read newspapers or books can use the web to access information Required by some laws that you provide access to all users –Remember, everyone should have access to the information you would like to present

6. CIS 373---Web Standards-Accessibility 6 of 42 Making the web accessible Traditional focus has been on web developers to design accessible sites However, different users require different designs to be able to effectively understand the site The Web Accessibility Initiative (WAI) is considered the international standard for Web Developed by the W3C Think about all the different disabilities that your user base could be experiencing Making Your Web Site Accessible –Developing an accessible site could be easier than you think –Depends on what type of technologies you used to develop the site –Many accessible sites must be developed from the start as sites that are not coded with standard html can be difficult to change –Videos, fancy animations cannot be seen by those with visual impairments

7. CIS 373---Web Standards-Accessibility 7 of 42 Checking your site Should check site to conform to guidelines Mostly done through human checking but some software exists to help –Access Color –Accessibility Check –Accessibility Wizard Should run a number of different scenarios to see how the site works

8. CIS 373---Web Standards-Accessibility 8 of 42 Content Accessibility Web Content Guidelines –What the user sees Authoring Tool Accessibility –Developing content for web pages User Agent Accessibility –Broader scope than just web pages Of these, Web Content Accessibility is most important –Specialized tools exist for other applications

9. CIS 373---Web Standards-Accessibility 9 of 42 Web Content Accessibility Guidelines Web Content Accessibility Guidelines (WCAG) –Explain how to make content accessibility to everyone, including those with disabilities and impairments –Web content refers to anything you see on the Web including images, text, html –Should design your pages to be accessible to those with impairments –Bring your content to a much wider audience

10. CIS 373---Web Standards-Accessibility 10 of 42 Who is it for? WCAG is intended for: –Web content developers (page authors, site designers, etc.) –Web authoring tool developers –Web accessibility evaluation tool developers –Policy makers, managers, etc. Developed by W3C

11. CIS 373---Web Standards-Accessibility 11 of 42 Quick Tips Quick tips to make the web accessible to all users – Images & animations: Use the alt attribute to describe the function of each visual. Images & animations – Image maps. Use the client-side map and text for hotspots.client-side maptext for hotspots – Multimedia. Provide captioning and transcripts of audio, and descriptions of video.captioning and transcripts of audiodescriptions of video – Hypertext links. Use text that makes sense when read out of context. For example, avoid "click here." Hypertext links

12. CIS 373---Web Standards-Accessibility 12 of 42 Quick Tips Quick Tips continued – Page organization. Use headings, lists, and consistent structure. Use CSS for layout and style where possible. Page organizationheadingslists CSS – Graphs & charts. Summarize or use the longdesc attribute. longdesc – Scripts, applets, & plug-ins. Provide alternative content in case active features are inaccessible or unsupported.alternative content – Frames. Use the noframes element and meaningful titles.titles – Tables. Make line-by-line reading sensible. Summarize. Tables – Check your work. Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG Check your workValidatehttp://www.w3.org/TR/WCAG See the WCAG checklist on the course website

13. CIS 373---Web Standards-Accessibility 13 of 42 Web Content Basic Guidelines 1. Provide equivalent alternatives to auditory and visual content –Use the “alt” tag in images –Identify applets, images, sound, video descriptively Text can be easily converted to audio Also good design when maintaining your html code –Using video may help some users process information instead of text

14. CIS 373---Web Standards-Accessibility 14 of 42 Web Content Basic Guidelines 2. Don't rely on color alone –Remember those with visual impairments cannot see color –Do not use color to highlight important text or headings –Remember text is better to get your point across than a flashy page design

15. CIS 373---Web Standards-Accessibility 15 of 42 Web Content Basic Guidelines 3. Use markup and style sheets and do so properly –Always identify important text –Do not use a header information to change a font size when the information is not a header –If you are using a table, do not use tabs to separate the elements –Use style sheets to control formatting (keep formatting changes out of the page) –Makes it easier to make site wide changes without changing every page

16. CIS 373---Web Standards-Accessibility 16 of 42 Web Content Basic Guidelines 4. Clarify natural language usage –Speech synthesizers and Braille devices should be automatically able to switch to the new language Provide explanations of acronyms the first time they are used Identify the language that is used on the page If the language changes, clearly state the change –Identify key words and headings on the page (also helps search engines to catalog your content) –Improves readability of pages for all users, including those that can access the site normally –Can also aid in the translation of pages to other languages –When abbreviations and natural language changes are not identified, they may be indecipherable when machine-spoken or brailled

17. CIS 373---Web Standards-Accessibility 17 of 42 Web Content Basic Guidelines 5. Create tables that transform gracefully –Use descriptive headings in all tables –Try to avoid using tables whenever possible Help those that only access part of the page at a time Use tables when displaying data in a tabular form, not for layout

18. CIS 373---Web Standards-Accessibility 18 of 42 Web Content Basic Guidelines 6. Ensure that pages featuring new technologies transform gracefully –Try out your pages using several common accessibility technologies –Authoring tools can help you develop accessible pages –New technologies like Flash may not be screen reader friendly

19. CIS 373---Web Standards-Accessibility 19 of 42 Web Content Basic Guidelines 7. Ensure user control of time-sensitive content changes –Think of moving text or JavaScript that redirects you to a page after a certain time Those with cognitive disabilities may not be able to comprehend fast moving text or images Audio browsers may not be able to keep up with fast moving text

20. CIS 373---Web Standards-Accessibility 20 of 42 Web Content Basic Guidelines 8. Ensure direct accessibility of embedded user interfaces –Think of putting flash on your site –Must allow the user to find the hyperlinks and select them in your flash applications –Better to use html to hold link information and flash to display video

21. CIS 373---Web Standards-Accessibility 21 of 42 Web Content Basic Guidelines 9. Design for device-independence –Think of all the different devices that can access the web today PDA’s Phones Laptops Desktops –Style sheets can help with this! –Try different items, screen sizes, resolutions to make sure your content is accessible

22. CIS 373---Web Standards-Accessibility 22 of 42 Web Content Basic Guidelines 10. Use interim solutions –Ensure that older versions of browsers can understand and access your content –May need to design different sites for different versions of browsers CSS’s come in handy for doing this –Older browsers read lists of links as a single link –Test, test, test

23. CIS 373---Web Standards-Accessibility 23 of 42 Web Content Basic Guidelines 11. Use W3C technologies and guidelines –Use the checklist that is on the course website to ensure that your site can be more accessible to those with disabilities –Priority 3 is the highest and most accessible level, Priority 1 allows for much greater access and requires the least amount of work

24. CIS 373---Web Standards-Accessibility 24 of 42 Web Content Basic Guidelines 12. Provide context and orientation information –Try to show where they are on the page –The user should be able to determine where to click to access important information –The user should not get “lost” browsing through your site

25. CIS 373---Web Standards-Accessibility 25 of 42 Web Content Basic Guidelines 13. Provide clear navigation mechanisms –Use links that are descriptive –Do not use a name like “click here”, rather use “CIS373 course website” –The urls will be read to those with visual impairments –Highlight more important links –Use actual html for links, not flash

26. CIS 373---Web Standards-Accessibility 26 of 42 Web Content Basic Guidelines 14. Ensure that documents are clear and simple –Use descriptive and simple headings –Do not use large rambling text Remember, those who are blind need to access the site using sound –Highlight the most important links and information so the user can jump directly to the relevant items

27. CIS 373---Web Standards-Accessibility 27 of 42 Authoring Tool Accessibility Guidelines Authoring tools are used by those that develop websites and related applications The Authoring Tool Accessibility Guidelines (ATAG) define how authoring tools should developed so that everyone, including those with disabilities, can have access to and use websites developed using these tools Part of the Web Content Accessibility guidelines Just need to know they exist

28. CIS 373---Web Standards-Accessibility 28 of 42 What does ATAG do? Authoring Tool Accessibility Guidelines (ATAG) Overview –Authoring tools are software and services that people use to produce Web pages and Web contentcontent –Aid web developers in making compliant websites that are accessible to all –Provides a series of guidelines for those that develop compliant software

29. CIS 373---Web Standards-Accessibility 29 of 42 ATAG is useful to… Editing tools specifically designed to produce Web content, (Frontpage) Tools that can save content to web pages (Save as Web Page) Transform documents into web formatTools that produce multimedia, especially where it is intended for use on the Web, for example, video production and editing suites, SMIL authoring packages Video editing tools to describe to the user what is going on the page Content Management System software CSS formatting tools Sites that allow for user content (blogs)

30. CIS 373---Web Standards-Accessibility 30 of 42 What is in ATAG? 28 Checkpoints that provide guidelines to –Produce accessible output (that is, Web pages) –Prompt the content author to make their addition accessible –Provide suggestions as to improve the current web content to make it complaint –Integrate accessibility into the look and feel of the site, not just content –Designing the authoring tool to be accessible to those with disabilities

31. CIS 373---Web Standards-Accessibility 31 of 42 User Agent Accessibility The User Agent Accessibility Guidelines (UAAG) describe how to make user agents accessible to everyone Broader scope than just web accessibility Include media players, operating systems, etc. We are mainly concerned with web content

32. CIS 373---Web Standards-Accessibility 32 of 42 Who is it for? UAAG is primarily for developers of Web browsers, media players, assistive technologies, and other user agents. UAAG and supporting resources are also intended to meet the needs of many different audiences, including policy makers, managers, and others. People who want to choose user agents that are more accessible can use UAAG to evaluate user agentsevaluate user agents People who want to encourage their existing user agent developer to improve accessibility in future versions can refer the user agent vendor to UAAG

33. CIS 373---Web Standards-Accessibility 33 of 42 What can it do? User Agent Accessibility Guidelines explain how to make user agents accessible to those with disabilities Include web browsers, media players, and assistive technologies Checkpoints to cover –Access to all content, including content tied to events triggered by the mouse or keyboard –User control over how content is rendered –User control over the user interface, with documentation of accessibility features –Standard programming interfaces, to enable interaction with assistive technologies

34. CIS 373---Web Standards-Accessibility 34 of 42 How different guidelines work together Different components of web development must work together – content - the information in a Web page or Web application, including: natural information such as text, images, and sounds code or markup that defines structure, presentation, etc. – Web browsers, media players, and other "user agents" – assistive technology, in some cases - screen readers, alternative keyboards, switches, scanning software, etc. – users ' knowledge, experiences, and in some cases, adaptive strategies using the Web – developers - designers, coders, authors, etc., including developers with disabilities and users who contribute content – authoring tools - software that creates Web sites – evaluation tools - Web accessibility evaluation tools, HTML validators, CSS validators, etc.

35. CIS 373---Web Standards-Accessibility 35 of 42 How different technologies work together

36. CIS 373---Web Standards-Accessibility 36 of 42 How technologies work Web developers will use authoring tools The user will use accessibility aids geared to the particular disability Requires a combination of all of these features in order to work effectively If one component is weak, then workarounds will need to be developed for other components as well

37. CIS 373---Web Standards-Accessibility 37 of 42 Developing workarounds Use different pages for different disabilities

38. CIS 373---Web Standards-Accessibility 38 of 42 Generally a circle As assistive technologies become more effective, browsers and authoring tools will incorporate those changes Leads to Greater Accessibility for all

39. CIS 373---Web Standards-Accessibility 39 of 42 Fitting it all together

40. CIS 373---Web Standards-Accessibility 40 of 42 Conclusion Design your sites to be accessible to a wide audience Some laws govern the ability to bring your site to your users –Target sued because site not designed well to allow access to blind users –Use the checklist for web accessibility to ensure your website is most available to all users

41. CIS 373---Web Standards-Accessibility 41 of 42 For Next Week Read about Cool URI’s Read the WCAG Priority Guidelines Papers and presentations due in 2 weeks Next week will be available to meet with those that may have questions about the paper / presentations

42. CIS 373---Web Standards-Accessibility 42 of 42 In Class Exercise Split into groups of 2 Take a copy of the Web Accessibility Guidelines Select a website Go through the guidelines to see which ones are met and which items need to be improved State whether the site conforms or not Brief presentation at end of class