Chapter 2

How accessible is your website?

 

So how do we define an ADA-compliant website? In order to be compliant, schools must adhere to a very specific set of technical standards set forth by the international web community. Like other ADA requirements at school such as parking spaces, ramps, and interior finishings, websites must follow accessibility standards adopted by the U.S. Department of Education and Office for Civil Rights. Learn about WCAG and how to measure your web accessibility using these standards.

 

WCAG overview

So how do we define an ADA-compliant website? Until relatively recently, there has been no technical standard that has been adopted for schools.

School website accessibility rules are established by the World Wide Web Consortium (W3C), an international community that develops open standards for the internet. The W3C is comprised of people who pretty much invented the world wide web. They came up with like HTML, HTTP,  and URLs over 30 years ago and have since shepherded the technical growth of the internet.

The U.S. federal government adopted the W3C's Web Content Accessibility Guidelines (WCAG 2.1 AA) in 2017 as its standard for federal agency websites. Since then, the Department of Justice (DOJ) followed, adopting these guidelines for public and private school websites.

There are four driving principles to WCAG:

WCAG 2.1 is a standard made of twelve guidelines under four principles:

Frame (3)
Perceivable

Web content is made available to the senses - sight, hearing, and/or touch

Frame
Operable

Interface forms, controls, and navigation are operable

Frame (2)
Understandable

Content and interface are understandable

Frame (1)
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 into three levels with incremental enhancements for users with visual and hearing impairments. Schools are required to follow level AA.

WCAG 2.1 is a practical standard that not only makes your website information accessible for everyone, but also provides benefits in searchability, 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 simply 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.

iconfinder_lamp_idea_6014121 3
By the numbers

WCAG is a standard made of 15 guidelines under 4 principles: content and interface need to be made available to the senses, controllable, understandable, and functional with other systems (e.g., mobile and assistive technologies).

WCAG 2.1 website accessibility guidelines

The following 15 guidelines are spelled out in WCAG to make sure a website meets the four overarching principles of website accessibility. For a deeper dive, check out this resource from the WebAIM group for a WCAG 2.1 Checklist

gallery
Contrast and colors

Some people have difficulty seeing text in a color that does not have a great enough contrast with its background. Those who experience color-blindness 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

Group (1)-1
Using semantics to format your HTML pages

When web page codes are clearly described in easy-to-understand terms, it enables broader sharing across different browsers and applications. This ‘friendlier’ language not only helps users, but also 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 screen readers can better interpret content to the user.

Read more: Semantic Structure

Group (2)
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 more vivid for people with disabilities.

Read more: Alternative Text

Group (3)
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

Group (4)
Easy to navigate and find information

Finding relevant content via search and easy navigation is a universal need. Alt text, heading structure, page titles, and 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 your website such as a search, indexes, and site maps.

Read more: Site Searches, Indexes, and Site Maps

Group 82
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 needs to be correctly associated with the right header.

Read more: Creating Accessible Tables

Group (5)
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

Group 86
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

3447684 1
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 the form is laid out, the use of labels and the size of clickable areas should all be considered.

Read more: Creating Accessible Forms

Group 88
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 and/or technically) to modify certain content. Even if you have to recreate or duplicate a page in a different format to ensure it's truly accessible, it's still required. 

Group (6)
Feedback for users

To be fully interactive, your site needs to provide an easy way for someone to submit feedback about compliance issues they find on your site. In order to be truly accessible, there needs to be a way for your site to undergo an assessment by users. 

Group 92
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 components on your website.

1827534 1
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 their effort to use the site. In some cases (e.g., purchasing items), a timer may be required, but most content on a school's website does not need to be timed, so avoid using timers.

Group (7)
Fly-out menus

Menus that fly out or down when an item is clicked allow users to dig deeper into a site's content, but they present a challenge for some users with disabilities. To be accessible, fly-out menus should be available via keyboard navigation, and not immediately snap back, like when the mouse moves out of the hover-zone of the clickable area.

Group 95
No pop-ups

Pop-up windows present a serious obstacle for many users with disabilities, 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.

These 15 guidelines represent the current set of criteria established by the W3C to eliminate common website barriers. This list will evolve as web and assistive technologies advance.

Vector-(6)
A journey of compliance

“Compliance is a journey. It’s an ongoing process to make a website as compliant as possible. No site may ever be 100-percent compliant, but we must all work toward that.” – Jared Smith, associate director, WebAIM

Categories of web accessibility disabilities

Beyond the obstacles faced by individuals with sight and hearing impairments, website can be full of barriers for those with other physical and cognitive disabilities. People with compromised motor skills and learning issues, for example, face an array of challenges that make it difficult to navigate many school district websites.

When examining your school’s website accessibility, you must take into account the entire spectrum of disabilities. There are five main categories that factor into website accessibility.

Frame (4)
Visual (blindness, low-vision, color blindness)

Those who are visually impaired may struggle with variations in type fonts and sizes, color schemes, images, contrasts, and other visual elements.

Frame (5)
Hearing (partial or total hearing impairment)

START HERE The increasing use of multimedia on websites doesn’t register with someone suffering from hearing loss.

Frame (6)
Motor (impairments to physical movement)

The wide range of congenital conditions and even temporary mobility impairments may preclude users from using a mouse or keyboard.

Frame (7)
Cognitive (learning disorders)

Problem-solving, memory, ADD, Down’s, traumatic brain injuries and other learning disorders each present unique corresponding web access challenges.

Frame (8)
Speech (voice)

Websites with voice-based services present problems for some. Not everyone can produce speech that is recognized by others or by voice recognition software.

How to conduct a school website accessibility audit

The first thing you need to do to make and keep your website ADA-compliant is to conduct a school website accessibility audit. An audit demonstrates to your school community or the Office for Civil Rights (OCR) that your district is doing all it can meet the web needs of those with disabilities.

There are two major steps to conducting an audit: one requires online tools. The second step requires the personal touch. Follow these steps and you will be well on your way to gaining a better understanding of your website and its shortfalls, and and you're on the right path to ADA-compliance.

 

Scan your site using software

A web accessibility checker is software that scans each page on your website and flags your accessibility problem areas. Most of these tools – some of which are even do-it-yourself – will create a general report that covers common issues such as:

  • Alt tags on images
  • PDF linking
  • Table headers
  • Properly semantics (headings, navigations, etc.)

In some cases, all you need to do is plug in the URL to a form and the checker will take it from there.

There are many third-party companies (e.g., Siteimprove, Monsido, SortSite, PowerMapper) that perform accessibility evaluations, and know that the level of service and associated costs vary greatly. WebAIM, as well, is a non-profit that performs audits. Campus Suite conducts accessibility audits just for schools.

 

Conduct a 'human' review

The online tools go only so far though. Checking every website page for problems requires human experience. Color combinations and confusing alt text descriptions, for example, are just two examples of issues that would escape detection by many software scans.

Here are some of other common accessibility issues you should be on the lookout for when conducting a “human review” of each page.

  • checkmarkCan you navigate your website just using the keyboard?
  • checkmarkDoes link highlighting work properly when navigating with keyboard?
  • checkmarkDo buttons and links have descriptive names?
  • checkmarkIs there enough contrast in your website colors for visually impaired people?
  • checkmarkDo you have descriptive alt tags for every image on your site?
  • checkmarkDo you have transcripts and closed-captioning for videos, including YouTube videos?
  • checkmarkAre all linked PDF files optimized for ADA?
  • checkmarkAre fields in your online forms properly labeled?
  • checkmarkDo you have a website accessibility policy available?
  • checkmarkDo you provide alternative ways for people to access information

There are a few others accessibility red flags surrounding movement and timing. For a complete list of the WCAG website accessibility guidelines, refer here.

For more details on each of these key issues, check out Steve Williams' article on how to conduct a school website accessibility audit.

 

Seek help, with and after the audit

To do an audit right, you’re going to need help, but be aware that web accessibility services run the gamut. After conducting the audit, you should document your findings. List out all of the areas and errors, including all WCAG violations, outline and prioritize recommendations to resolve the issues you’ve discovered. Audits are one thing; you need to establish a plan of resolution.

Now comes the hard part – making the fixes. It’s important you understand how to become ADA compliant so you can have a website that’s accessible to your entire school community. What’s more, you need to know how to keep it compliant going forward.

There are many web accessibility specialists offering their audit services to corporations, government agencies and large universities, but those options may not be in the budget for many school districts. Consider reviewing your CMS provider’s technology to their knowledge and capabilities when it comes to ADA-compliance and web accessibility. It may be easier to create a new website with a provider that is capable of streamlining the management of ADA compliance.

Vector-(6)
More resources

The path to school website accessibility can be difficult for school administrators to navigate, so we've assembled this "4 Steps to School Website Accessibility" infographic that maps out the steps to creating an ADA-compliant school website.

New Call-to-action

When to conduct a school website accessibility audit

An audit accomplishes two major goals. First off, it gives you a full understanding of where your school or district websites stand when it comes to accessibility. You'll get the big picture, and uncover some alarming details. You might be surprised by how many barriers exist.

Secondly, an audit demonstrates to the community, government and disabilities advocacy groups that you’re taking the steps to become compliant. This is an important consideration in 'buying time' to meet rectify your website to meet federal regulations.

If, for example, you are responding to an OCR complaint or investigation (last we checked there are 350+ districts with web accessibility cases under review) you will be asked to conduct an audit so you can get a full understanding of how and where your site falls short.

The key point here is, it’s never too early conduct a website accessibility audit.

The audit step is very educational in and of itself, for in the process you’ll get a better idea of the requirements for website accessibility. Once your audit is complete, then the real work begins: how do you go about making – and keeping – your school website accessible for all?

An audit is not a one-time exercise. Keeping a website accessible requires vigilance, so you should really be auditing your site on a regular basis if not continually.

sm-image-accessbility-infographic-4
Busted!

"Monitoring a website for accessibility is like issuing 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." Jared Smith, associate director, WebAIM