Slide 1

Pat Burns VP for IT Nov. 11, 2013 MEETING WITH WEB DEVELOPERS: MAKING WEB PAGES ACCESSIBLE

Slide 2

I keep six honest- serving men (they taught me all I knew); Their names are What and Why and When and How and Where and Who. 11/11/13web accessibility 2 OUTLINE R. Kipling

Slide 3

US Department of Justice mandating that all on-line information be accessible Pending NPRM Other universities have had to settle with NFB But, nevertheless we should do this because it is the right thing to do 11/11/13web accessibility 3 BACKGROUND

Slide 4

WHAT Make web pages down through level 3 (department) accessible University VP/Dean Department (level 3) Others as you can, and deeper levels in the future 11/11/13web accessibility 4

Slide 5

Web developers Collaboration between ATRC (Marla Roll and Allison Kidd), and CSU Libraries (Greg Vogl) 11/11/13web accessibility 5 WHO

Slide 6

By spring break 2014 We will spot check a random sample of web pages then 11/11/13web accessibility 6 WHEN

Slide 7

Instructional materials, as they are developed, should also be made accessible Easy, but not part of what we will cover today See http://accessibility.colostate.edu/http://accessibility.colostate.edu/ Current initiative does not apply to videos, but if you can Current initiative should not deter innovation (e.g. Echo 360 etc.) 11/11/13web accessibility 7 CAVEATS

Slide 8

Charged by university with ensuring equal access to technology and information Determine, provide & train on appropriate assistive technology AT is only as good as the content it interacts with We need your help in creating the bridge between AT and the content! 11/11/13web accessibility 8 ASSISTIVE TECHNOLOGY RESOURCE CENTER

Slide 9

Students identifying with RDS Students identifying with ATRC 11/11/13web accessibility 9 RATIONALE BEYOND MANDATES 11% OF HIGHER EDUCATION STUDENTS HAVE DISABILITIES

Slide 10

DISABILITIES Apparent Non- apparent 11/11/13web accessibility 10

Slide 11

11/11/13web accessibility 11 DisabilityCognitiveVisualHearingMotorMental health ExamplesDyslexia; TBI; autism spectrum Low vision; blindness; color blind Hearing loss Arthritis; SCI; MS; other PTSD; anxiety; depression AT usedText to speech; visual display Screen mag software; screen reading software; keyboard navigation FM systemsHeadpointers; eye gaze; voice recognition; switches Visual adjustments; text to speech Access issues: Crowded, dense content; timed participation, non-intuitive navigation Images; graphs; videos; mouse requirement; color- dependent content Videos lack caption and/ or transcript Access to small buttons; timed tasks; cumbersome navigation Retaining information; cluttered or dense content; processing information quickly

Slide 12

Section 508 Guidelines Being updated to reflect WCAG 2.0 WCAG 2.0 3 Levels of Priority A: The Absolute Minimum, But Not Enough AA: Recommended Industry Standard AAA: Nitpicky Level for the Ambitious WCAG 2.0 Overview (w3.org/wai/intro/wcag) WCAG 2.0 Overview (w3.org/wai/intro/wcag) 11/11/13web accessibility 12 THE STANDARDS

Slide 13

1.Use the Automated WAVE Tool Based on WCAG 2.0 Standards 2.Manually Check Results of WAVE Automation only goes so far (only catches 25% of errors) 3.Navigate Using Keyboard and Screen Reader Compliant is not always usable 11/11/13web accessibility 13 BASIC PROCESS FOR TESTING

Slide 14

wave.webaim.org wave.webaim.org Enter a URL for summary of errors and alerts Click red flag for details of errors (red) and alerts (yellow) Click red/yellow icon to locate element in page Click blue icon for explanation Click outline button to check nesting of headings Click No Styles to view the page without CSS Click Contrast to find low-contrast elements wave.webaim.org/toolbar - install the WAVE toolbar (Firefox add- on) wave.webaim.org/toolbar 11/11/13web accessibility 14 WAVE - WEB ACCESSIBILITY EVALUATION TOOL

Slide 15

TESTING WITH SCREEN READERS Short Lists of Commands for Testing Websites: JAWS (Windows) Basic JAWS Commands (http://webaim.org/articles/jaws/) Basic JAWS Commands (http://webaim.org/articles/jaws/) NVDA (Windows Open-Source) Basic NVDA Commands (http://webaim.org/articles/nvda/) Basic NVDA Commands (http://webaim.org/articles/nvda/) VoiceOver (Mac Built-in) Testing With VoiceOver (http://webaim.org/articles/voiceover/) Testing With VoiceOver (http://webaim.org/articles/voiceover/) 11/11/13web accessibility 15

Slide 16

11/11/13web accessibility 16 INACCESSIBLE WEBSITE EXAMPLE

Slide 17

11/11/13web accessibility 17 ACCESSIBLE WEBSITE EXAMPLE

Slide 18

Purpose Produce an inventory of important sites, applications, pages, templates Provide evidence that accessibility is being assessed and improved Identify, summarize and prioritize accessibility problems Track progress over time Combine with assessment of content (usability, design, mobile,...) optional Share your processes and ideas with other web developers Suggestions Keep it simple Format and content should be useful for you 11/11/13web accessibility 18 ACCESSIBILITY ASSESSMENT

Slide 19

CSU Accessibility Guidelines: Accessibility Resources for Web Developers CSU Accessibility Guidelines: Accessibility Resources for Web Developers CSU Libraries: Website Accessibility CSU Libraries: Website Accessibility ACNS: Making Accessible Web Pages ACNS: Making Accessible Web Pages 11/11/13web accessibility 19 MORE INFORMATION AT CSU

Slide 20

Web accessibility takes a village Web site was built in response to guidelines Attempts to highlight most important points Springboards to other sources for more Work in progress Your feedback and resources are welcomed! Quick overview http://accessibility.colostate.edu/ http://accessibility.colostate.edu/ 11/11/13web accessibility 20 ACCESSIBILITY BY DESIGN