420 likes | 436 Views
Learn about web accessibility guidelines for creating inclusive websites that cater to users with various disabilities. Understand the importance, benefits, and tips for making your web content accessible to a wider audience.
E N D
Web Accessibility IS 373—Web Standards Todd Will
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
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
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
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
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
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
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
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
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
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. • Image maps. Use the client-side map and text for hotspots. • Multimedia. Provide captioning and transcripts of audio, and descriptions of video. • Hypertext links. Use text that makes sense when read out of context. For example, avoid "click here." CIS 373---Web Standards-Accessibility
Quick Tips • Quick Tips continued • Page organization. Use headings, lists, and consistent structure. Use CSS for layout and style where possible. • Graphs & charts. Summarize or use the longdesc attribute. • Scripts, applets, & plug-ins. Provide alternative content in case active features are inaccessible or unsupported. • Frames. Use the noframes element and meaningful titles. • Tables. Make line-by-line reading sensible. Summarize. • Check your work.Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG • See the WCAG checklist on the course website CIS 373---Web Standards-Accessibility
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
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
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
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
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
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
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
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
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 CIS 373---Web Standards-Accessibility
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 CIS 373---Web Standards-Accessibility
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
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
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
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
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
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 content • 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
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
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
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
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 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
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
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
How different technologies work together CIS 373---Web Standards-Accessibility
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
Developing workarounds • Use different pages for different disabilities CIS 373---Web Standards-Accessibility
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
Fitting it all together CIS 373---Web Standards-Accessibility
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
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 CIS 373---Web Standards-Accessibility
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 CIS 373---Web Standards-Accessibility