<img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=6017841059527&amp;cd[value]=0.01&amp;cd[currency]=USD&amp;noscript=1">
Campus Suite Blog

WCAG 2.0 and What it Means for School Website ADA Compliance

Posted by Steve Williams
Feb 6, 2017 8:25:26 PM

If you are like most public schools across the country, website accessibility and ADA compliance has become a focus due to an increase in the Office for Civil Rights (OCR) complaints, investigations and even lawsuits. Schools can no longer just have a website that serves common computers and browsers, but now has to ensure all online information is accessible for everyone – including those with disabilities.

Public school websites are required to be ADA compliant through Section 504 of the Rehabilitation Act of 1973 and Title II of the Americans with Disabilities Act.

Trying to figure out what constitutes an ADA compliance website can be difficult leaving most schools not knowing where to start. Well, it's starts with understanding where your website falls short, and the best place to start is with an audit. Here's an article addresses how to conduct a school website accessibility audit.

So what defines an ADA compliant website? Currently, there is no technical standard that has been adopted for schools. Our good friend Jared Smith of WebAIM often compares this situation to being given a speeding ticket on a road that has no speed limit signs – the enforcer can determine if you’re going too fast, without a specific measurement.


Download your free 'Guide to School Website Accessibility'.


This is predicted to change soon, in January of 2017 the federal government has adopted the Web Content Accessibility Guidelines 2.0 (WCAG 2.0 AA) as its standard for federal agency websites. Industry experts all agree it is very likely that the Department of Justice (DOJ) will also adopt this standard for public and private school websites in its forthcoming rule-making. Despite the fact there is no standard adopted for schools yet, WCAG 2.0 AA is used in the court of law for the website accessibility standard.

Introducing WCAG 2.0

WCAG 2.0 is a technical standard created by the World Wide Web Consortium (W3C) which is an international community that develops open standards for the internet. WCAG 2.0 is a standard made of twelve guidelines under four principles:

  • Perceivable - Web content is made available to the senses - sight, hearing, and/or touch
  • Operable - Interface forms, controls, and navigation are operable
  • Understandable - Content and interface are understandable
  • Robust - Content can be used reliably by a wide variety of user agents, including assistive technologies

For each guideline, there are testable success criteria, which are categorized in three levels: A, AA, and AAA. Level A is the minimum, with AA and AAA adding additional enhancements for hearing and visually-impaired users.

WCAG 2.0 in simple terms

We've put together a simple list that attempts to make the WCAG 2.0 specification a little easier to understand its guidelines and principles. Check out this resource from the WebAIM group for a WCAG 2.0 Checklist.

 

ADA colors and contract

Contrast and colors

Some people have difficulty seeing text and colors that do not have a great enough contrast with its background. Those who are color-blind especially need to be able to distinguish text over background color. This applies to buttons, links, text on images – everything. Consideration to contrast and color choice is also important for extreme lighting conditions.

Read more: Color Contrast Checker

 

Semantics mark-up

Using semantics to format your HTML pages

When web page codes are clearly described in easy-to-understand terms, it enables broader sharing across all browsers and apps. This ‘friendlier’ language not only helps all the users, but developers who are striving to make content more universal on more devices. Content should be properly labeled. All pages should have a headline using 'Heading 1' or <h1>. Subheads like H2, H3 and H4 establish a hierarchy so readers can better interpret content to the user.

Read more: Semantic Structure

 

Text alternatives

Text alternatives for non-text content

Written replacements for images, audio and video should provide all the same descriptors that the non-text content conveys. Besides helping with searching, clear, concise word choice can make non-text content for the disabled more vivid.

Read more: Alternative Text

 

Navigate with keyboard

Ability to navigate with the keyboard

Not everyone can use a mouse. Those with motor disabilities have to use a keyboard to make their way around a website. Users need to be able to interact fully with your website by navigating using the tab, arrows and return keys. A “skip navigation” option is also required. Consider using WAI-ARIA for improved accessibility, and properly highlight the links as you use the tab key to make selections.

Read more: Keyboard-Only Navigation for Improved Accessibility
Read more: "Skip Navigation" Links

 

Easy to navigate

Easy to navigate and find information

Finding relevant content via search and easy navigation is a universal need. Alt text, heading structure, page titles, descriptive link text (no ‘click here’ please) are just some ways to help everyone find what they’re searching for. You must also provide multiple ways to navigate such as a search, indexes and site maps.

Read more: Site Searches, Indexes, and Site Maps

 

Accessible tables

Properly formatting tables

Tables are hard for screen readers to decipher. Users need to be able to navigate through a table one cell at a time. In addition to the table itself needing a caption, row and column headers need to be labeled and data correctly associated with the right header.

Read more: Creating Accessible Tables

 

ADA compliant PDFs

Making PDFs accessible

PDF files must be tagged properly to be accessible, and unfortunately many are not. Images and other non-text elements within that PDF also need to be ADA-compliant. Creating a new PDF is often easier than converting an old one.

Read more: PDF Accessibility

 

Video ADA accessibility

Making videos accessible

Simply adding a transcript isn’t enough. Videos require closed-captioning and detailed descriptions (e.g., who’s on screen, where they are, what they’re doing, even facial expressions) to be fully accessible and ADA compliant.

Read more: Captions, Transcripts, and Audio Descriptions

 

Form accessibility

Making forms accessible

Forms are common tools for gathering info and interacting with site visitors. Login forms and online registrations can be challenging if not designed to be web accessible. How it’s laid out, use of labels and the size of clickable areas should all be considered.

Read more: Creating Accessible Forms

 

Alternate website versions

Alternate versions

Attempts to be fully accessible sometimes fall short, and in those cases, alternate versions of key pages must be created. That is, it is sometimes not feasible (legally, technically) to modify some content. These are the ‘exceptions’, but still must be accommodated.

 

Accessibilty feedback from users

Feedback for users

To be fully interactive, your site needs to be able to provide and easy way for someone to submit feedback of compliance issues they find on your site. Clarity is key for confirmations or errors that occurs while engaging each page.

 

No flashing

No flashing

Blinking and flashing are not only bothersome, but can be disorienting and even dangerous for many users. Seizures can be triggered by flashing content, so avoid using any flashing or flickering content.

 

Miscellaneous WCAG 2.0 standards

Miscellaneous

Timers

Timed connections can create difficulties for the disabled. They may not know a timer is running, or perhaps it could create additional stress. In some cases (e.g., purchasing items), a timer may be required, but most content on a school's website does not need them. Avoid using timers.

Fly-out menus

Menus that fly out or down when an item is clicked are helpful to dig deeper into sites content, but they need to be available via keyboard navigation, and not immediately snap back, like when the mouse moves out of the hover-zone of the clickable area.

No pop-ups

Pop-up windows present a range of obstacles for many disabled users, so it’s best to avoid using them altogether. If you must, be sure to alert the user that a pop-up is about to be launched.

Conclusion

Whether you are just sharpening your web accessibility skills to update your website or gaining a better understanding so you can better manage your website, WCAG 2.0 is here to stay. WCAG 2.0 is a practical standard that not only makes your website information accessible for everyone, it provides benefits in search-ability, mobile compatibility and other areas related to usability.

If you can provide a better experience for one more person with a disability, it is worth all the effort and is just the right thing to do. Your website is the hub of your school's communication so it should provide an equal opportunity for each unique visitor.

New Call-to-action

 

 

 

Posted by Steve Williams

As co-founder of Campus Suite, Steve believes behind every great school is great communication. His tech savvy and passion for design fuel his desire to help administrators understand, embrace and seize the power of web communications.

Topics: Website accessibility School Districts Communication

Subscribe to Email Updates

About this blog

This blog and other Campus Suite Academy resources are part of our commitment to professional development for school communicators. Please join our forum for sharing the latest technology and communication trends to help schools better engage and improve education outcomes.

Campus-Suite-Academy

    Recent Posts

    New Call-to-action

    Start engaging today.

    If you want to talk, get pricing, or see Campus Suite in action, we're ready whenever you are.

    contact-man-cta-1
    cta-speak

    Speak to a specialist

    Contact us
    cta-pricing

    Request pricing

    Get a quote
    cta-demo

    See a demo

    Watch video