Download - Section 508 and WCAG

Transcript
Page 1: Section 508 and WCAG

Section 508 and WCAG

Accessibility Equality

Page 2: Section 508 and WCAG

Section 508Of the Rehabilitation Act (29 U.S.C. ‘794 d)

Page 3: Section 508 and WCAG

Section 508 Compliance Summary

•The Rehabilitation Act of 1973 was amended in to include Section 508 in 1998, in order to “eliminate barriers in information technology, open new opportunities for people with disabilities, and encourage development of technologies that will help achieve these goals.”▫ http://www.section508.gov/section508-laws

•All Federal Agencies are required to make any Electronic and Information Technology (E&IT) as readily accessible to people with disabilities as it is to people without disabilities

Page 4: Section 508 and WCAG

E&IT – Electronic & Information Technology(as defined by the U.S. Access Board)

•Definition:▫Includes information technology and any

equipment or interconnected system or subsystem of equipment, that is used in the creation, conversion, or duplication of data or information.

▫ http://www.access-board.gov/guidelines-and-standards/communications-and-it/about-the-section-508-standards/guide-to-the-section-508-standards/scope

Page 5: Section 508 and WCAG

E&IT – Electronic & Information Technology(as defined by the U.S. Access Board)

• Includes, but is not limited to:▫Telecommunications products (such as

telephones)▫Information kiosks and transaction machines▫World Wide Web sites▫Multimedia▫Office equipment such as copiers and fax

machines▫Computers (desktop and portable)▫Software applications and operating systems▫Self-contained, closed products▫Electronic documents and archives

Page 6: Section 508 and WCAG

Why 508 Matters

• Approximately 20% of Americans are considered disabled• Approximately 10% have severe disabilities• As of 1990, more than 13 million Americans use assistive

technology▫ The Center for Disease Control and Prevention conducted

the National Health Interview Survey on Disability, and provides comprehensive literature and visual data about the nature and depth of people with disabilities in the U.S. http://www.cdc.gov/nchs/nhis/nhis_disability.htm

• Search engines are more likely to find an accessible site since Search Engine Optimization and Accessibility have many similar requirements.

• It is beneficial to all users because accessible sites are typically easier to use

• It’s the right thing to do (seriously, it really is)

Page 7: Section 508 and WCAG

Types of Disabilities• There are hundreds of sources that discuss major and

specific types of disabilities. Not all of the sources agree, so here is a list of the 6 disability types covered by the 2008 American Community Survey (ACS) questionnaire: (https://www.census.gov/people/disability/methodology/acs.html) ▫ Hearing difficulty: deaf or having serious difficulty hearing▫ Vision difficulty: blind or having serious difficulty seeing, even when

wearing glasses▫ Cognitive difficulty: Because of a physical, mental, or emotional

problem, having difficulty remembering, concentrating, or making decisions

▫ Ambulatory difficulty: Having serious difficulty walking or climbing stairs

▫ Self-care difficulty: Having difficulty bathing or dressing▫ Independent living difficulty: Because of a physical, mental, or

emotional problem, having difficulty doing errands alone such as visiting a doctor’s office or shopping

Page 8: Section 508 and WCAG

Barriers and Assistive Technologies

•Visual Barriers: Images, navigation, scientific and mathematical notations, frames, forms, tables, multimedia, functional code like JavaScript, electronic documents…

•Visual Assistive Technology: Voice recognition software, braille displays, screen readers, screen magnification, keyboard controls…

Page 9: Section 508 and WCAG

Barriers and Assistive Technologies

•Auditory Barriers: Multimedia without captioning, system information and errors using only sound cues with no visual functionality…

•Auditory Assistive Technology: Telecommunications Device for the Deaf (TDD), Text captioning…

Page 10: Section 508 and WCAG

Barriers and Assistive Technologies

•Mobility Barriers: Use of computer hardware such as a mouse or keyboard, especially holding down more than one key at a time…

•Mobility Assistive Technology: Keyboard controls, breath or head tracking control devices, voice recognition software, alternative or on screen keyboards…

Page 11: Section 508 and WCAG

Barriers and Assistive Technologies

•Cognitive Barriers: Timeouts on features like forms or system information screens, concentrated text areas with few images or breaks, unintuitive tables, colors or information order…

•Cognitive Assistive Technology: Assistive hardware, like touch screens and picture keyboards. Best practices for information presentation and simplicity should be followed…

Page 12: Section 508 and WCAG

Section 508 Web-based Requirements

• § 1194.22 Web-based intranet and internet information and applications.▫ (a) A text equivalent for every non-text element shall be

provided (e.g., via "alt", "longdesc", or in element content).▫ (b) Equivalent alternatives for any multimedia presentation

shall be synchronized with the presentation.▫ (c) Web pages shall be designed so that all information

conveyed with color is also available without color, for example from context or markup.

▫ (d) Documents shall be organized so they are readable without requiring an associated style sheet.

▫ (e) Redundant text links shall be provided for each active region of a server-side image map.

Page 13: Section 508 and WCAG

Section 508 Web-based Requirements

▫ (f) Client-side image maps shall be provided instead of server-side image maps except where the regions cannot be defined with an available geometric shape.

▫ (g) Row and column headers shall be identified for data tables.▫ (h) Markup shall be used to associate data cells and header

cells for data tables that have two or more logical levels of row or column headers.

▫ (i) Frames shall be titled with text that facilitates frame identification and navigation.

▫ (j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.

▫ (k) A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of this part, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes.

Page 14: Section 508 and WCAG

Section 508 Web-based Requirements

▫ (l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.

▫ (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).

▫ (n) When electronic forms are designed to be completed on-line, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues.

▫ (o) A method shall be provided that permits users to skip repetitive navigation links.

▫ (p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required

Page 15: Section 508 and WCAG

WCAGWeb Content Accessibility Guidelines

Page 16: Section 508 and WCAG

Alignment of WCAG Checkpoints to 508 Policies(https://www.ssbbartgroup.com/reference/index.php/Section_508_versus_WCAG)

Section 508 Standards WCAG 1 WCAG 2

(a) Text equivalent of non-text items 1.1 1.1.1,1.4.5

(b) Provide synchronized alternatives for media 1.4 1.2.1

(c) Information should not be conveyed only with color

2.1 1.4.1

(d) Documents must be readable without style sheets 6.1 NA

(e) Redundant text link for server-side image maps 1.2 Multiple

(f) Client side images maps should be used 9.1 Multiple

(g) Identify table headers 5.1 1.3.1

(h) Associate table and header cells 5.2 1.3.1

(i) Properly title frames 12.1 4.1.2

(j) Avoid causing pages to flicker 7.1 2.3.1

(k) As a last resort provide a text-only page 11.4 NA

(l) Ensure scripts are accessible Multiple Multiple

(m) Provide a link to an accessible plug-in Multiple Multiple

(n) Ensure electronic forms are accessible Multiple Multiple

(o) Provide a method for skipping repetitive links 13.6 2.4.1

(p) Ensure user control over timed responses 7 2.2.1

Page 17: Section 508 and WCAG

WCAG – Web Content Accessibility Guidelines(http://www.w3.org/2004/10/wcag2-nav/wcag20.html)

• Published by World Wide Web Consortium’s Web Accessibility Initiative (WAI)

• Primarily geared toward users with disabilities (only major categories listed*)▫ Visual: blindness, low vision, color-blindness▫ Hearing: Deafness or hard-of-hearing▫ Motor: Inability to use a mouse, slow response time, limited fine motor

control.▫ Cognitive: Learning disabilities, distractibility, inability to remember or

focus on large amounts of information.

• Also concerned with ease-of-use with different technology:▫ Cell phone, tablets, various operating systems and browsers, assistive

technology software and hardware.

Page 18: Section 508 and WCAG

Principle 1 – Perceivable(WCAG 2.0 Guidelines)

• Information and user interface components must be presentable to users in ways they can perceive.▫ (1.1) Provide text alternatives for all non-text

equivalents▫ (1.2) Provide synchronized media equivalents for time-

dependent presentations▫ (1.3) Ensure that information, functionality and

structure are separable from presentation▫ (1.4) In visual presentations, make it easy to distinguish

foreground words and images from the background▫ (1.5) In auditory presentations, make it easy to

distinguish foreground speech and sounds from background sounds

Page 19: Section 508 and WCAG

Principle 2: Operable(WCAG 2.0 Guidelines)

• User interface components and navigation must be operable.▫ (2.1) Make all functionality operable via a keyboard

or a keyboard interface▫ (2.2) Allow users to control time limits on their

reading or interaction unless specific real-time events or rules of completion make such control impossible

▫ (2.3) Allow users to avoid content that could cause photosensitive epileptic seizures

▫ (2.4) Facilitate the ability of users to orient themselves and move within the content

▫ (2.5) Help users avoid mistakes and make it easy to correct them

Page 20: Section 508 and WCAG

Principle 3: Understandable(WCAG 2.0 Guidelines)

•Information and the operation of user interface must be understandable.▫(3.1) Ensure that the meaning of content

can be determined▫(3.2) Organize content consistently from

"page to page" and make interactive components behave in predictable ways

Page 21: Section 508 and WCAG

Principle 4: Robust(WCAG 2.0 Guidelines)

•Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.▫(4.1) Use technologies according to

specification▫(4.2) Ensure that user interfaces are

accessible or provide an accessible alternative(s)

Page 22: Section 508 and WCAG

General ToolsTesting Electronic Content for Accessibility Compliance

Page 23: Section 508 and WCAG

WAVE (by WebAIM)http://webaim.org/

•The WAVE tool was created to be as comprehensive as possible, integrating both 508 and WCAG web standard checks.▫http://wave.webaim.org/help

•WAVE is open source and offers no guarantee.•WAVE Accessibility Toolbar browser add-on.•WAVE site to input your page address:

▫http://wave.webaim.org/ •The browser toolbar not as updated as site, so

some errors using the toolbar aren’t really errors

Page 24: Section 508 and WCAG

Juicy Studio

• http://juicystudio.com/index.php ▫“The mission of this website is to promote best

practice for web developers in a fast moving industry. Whether you're a novice or a professional, there's something for you.”

• http://juicystudio.com/services/readability.php▫Readability Test

• http://juicystudio.com/services/luminositycontrastratio.php▫Luminosity Colour Contrast Ratio Analyser

• http://juicystudio.com/services/image.php ▫ Image Analyser

Page 25: Section 508 and WCAG

Screen Readers and Testing

•Highly inclusive list on Wikipedia▫http://

en.wikipedia.org/wiki/List_of_screen_readers

•There is a screen reader article and simulation tool at WebAIM.org▫http://webaim.org/techniques/screenreader

/ ▫http://

webaim.org/simulations/screenreader-sim.htm

Page 26: Section 508 and WCAG

Most Popular Screen Readers

1. Jaws (Freedom Scientific)2. Window-Eyes (GW Micro)3. Supernova (Dolphin)4. System Access (Serotek)5. ZommText (AiSquared)6. NVDA (opensource)

Page 27: Section 508 and WCAG

Section508.gov Technology Tools List•http://

www.section508.gov/technology-tools •Compilation of tools from private industry

and government agencies.

Page 28: Section 508 and WCAG

ResourcesArticles, references, checklists, compliance procedures, policies, business capture…

Page 29: Section 508 and WCAG

Section508.gov

• Section 508 of the Rehabilitation Act▫ (29 U.S.C. '794 d), as amended by the Workforce

Investment Act of 1998 (P.L. 105 - 220), August 7, 1998 (original source in uscode.house.gov)

• Summary of Section508 Standards▫http://www.section508.gov/summary-section508-

standards• Standards Checklist

▫http://www.section508.va.gov/Standards_Checklist.asp

• Best Practices▫http://www.section508.gov/best-practices

Page 30: Section 508 and WCAG

WebAIM.org

•http://webaim.org •Includes tons of free information about

accessibility and disabilities, as well as paid training.

•Provides tools to check your site’s accessibility compliance.

•The most popular resources on the site are conveniently listed in the footer.

•This is my absolute favorite resource for any general accessibility needs I have.

Page 31: Section 508 and WCAG

Knowability.org

•http://www.knowbility.org •About the organization:

▫“Knowbility is a 501(c)(3) nonprofit organization with the mission of improving technology access for millions of youth and adults with disabilities all over the world.”

Page 32: Section 508 and WCAG

BuyAccessible.gov

•http://www.buyaccessible.gov •“…intended to help you fulfill you Section

508 procurement roles & responsibilities by providing you with tools, guidance and resources.

•Information is organized according to audience, for example; executive, developer or contractor.

Page 33: Section 508 and WCAG

IMPACT

• http://www.state.gov/m/irm/impact/ • U.S. Dept. of State Information Resource

Management Program for Accessible computer/Communication Technology (IMPACT)

• “…serves as the Department's resource for achieving program, technology, and information accessibility for all employees, customers, and general public. This includes providing assistance to all bureaus in their implementation of Section 508 of the Rehabilitation Act as legislatively mandated.”

Page 34: Section 508 and WCAG

NetReach Article: “Section 508/WCAG”•http

://www.netreach.com/Section-508-WCAG/93/#.U-jXD2P5faI

•Discusses similarities and differences between 508 and WCAG

•Very helpful list of other accessibility references at the end of the article

Page 35: Section 508 and WCAG

Medium.com @jessebeach

•https://medium.com/@jessebeach/open-source-accessibility-testing-for-the-modern-web-c1a3a275fe1a

•Open-source accessibility testing for the modern web▫Collaborating to improve Quail, an open-

source web accessibility testing tool that will integrate with existing continuous integration processes and developer toolchains.

Page 36: Section 508 and WCAG

Voluntary Product Accessibility Template (VPAT)

•The VPAT is a form created by industry and can be requested as part of a solicitation making it mandatory for the vendor to submit with their bid.

•http://www.state.gov/m/irm/impact/126343.htm

Page 37: Section 508 and WCAG

Drupal Modules

• EIM (Extended Image Module)▫Option to make image alt and title required.▫https://www.drupal.org/project/eim

• Accessibility▫Provides list of accessibility tests.▫Still in Dev▫https://www.drupal.org/project/accessibility

• Web Experience Toolkit▫“…assists in building and maintaining innovative

Web sites that are accessible, usable, and interoperable”

▫https://www.drupal.org/project/wetkit

Page 38: Section 508 and WCAG

Drupal Community Documentation

•Accessibility tools and best practices for site builders▫https://www.drupal.org/node/394094 ▫First read the Drupal Accessibility

Statement https://www.drupal.org/about/accessibility

•Accessibility principles▫https://www.drupal.org/node/465106

•Accessibility Issues in Contributed Modules▫https://www.drupal.org/node/425494

Page 39: Section 508 and WCAG

Drupal Groups

•Accessibility▫“All you WCAG nuts this is the place for

you: how to make Drupal more accessible. Hints, tips, discussion and patch proposals.”

▫https://groups.drupal.org/accessibility

Page 40: Section 508 and WCAG

Issues

• Link images should show description of link location and not of the image itself.

• Views slideshow, tab index• Alternate navigation for image maps• Taxonomy term tree• Webforms:

▫Errors show at the top of the forms, and aren’t “viewable” by scree-reader users

• View filters and webforms have orphaned labels or are missing field element labels.

• Mini calendars