Web Accessibility IS 373—Web Standards Todd Will

Web Accessibility IS 373Web Standards Todd Will

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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 PDAs Phones Laptops Desktops Style sheets can help with this! Try different items, screen sizes, resolutions to make sure your content is accessible

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 CSSs come in handy for doing this Older browsers read lists of links as a single link Test, test, test

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

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

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

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

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

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

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)

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

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

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

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

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.

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

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

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

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

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

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

CIS 373---Web Standards-Accessibility 41 of 42 For Next Week Read about Cool URIs 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

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

Documents

Web Accessibility IS 373—Web Standards Todd Will