The goal of digital accessibility is to ensure that your school website supports each individual user’s needs and preferences. Web accessibility isn’t just the law—it’s also a human right. When we think of this in terms of your school website, it means that all visitors, regardless of physical or neurological ability, should be able to find and read its contents.

The law also plays a part in why you need to maintain an accessible website. The Americans with Disabilities Act (ADA) was passed back in 1990 but has recently gained a lot of traction in the digital world, and there are equivalent laws in many other countries that have sought to increase digital accessibility as well. 

If your site is found to be non-compliant, there can be some hefty consequences or it can leave you scrambling as you try to fix all of the issues you’ve been unaware of or ignoring. Some schools may already be familiar with the Office for Civil Rights (OCR) enforcing federal civil rights laws, such as the ADA.

It can be difficult to keep up with best practices regarding the Web Content Accessibility Guidelines (WCAG), so let’s start with some basic understanding and some of the tools you can use to ensure your school’s website and its content remains accessible.

What are the website accessibility guidelines?

Although many providers like Finalsite ensure an ADA-compliant school or district website upon its launch, it’s up to your school to maintain those standards. There are a variety of tools that you can use to make sure photos, text, and other content added to your website over time meet ADA requirements.

One of the most widely used standards used to measure accessibility is the WCAG. It covers a variety of types of content, has multiple levels of compliance, and each guideline has specific success criteria to show how to properly meet the requirements. All of the guidelines fall under one of the following POUR principles, and understanding these is key to starting your journey in making accessible content:

• Perceivable
  • Information and user interface components must be presentable to users in ways they can perceive.
• Operable
  • User interface components and navigation must be operable.
• Understandable
  • Information and the operation of the user interface must be understandable.
• Robust
  • Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

Your school’s accessibility statement

To start, every school or district website needs an accessibility statement that includes some way to contact you. A very common place to link to your accessibility statement is in the footer of your website so that it appears on every page. Adding an email address and/or phone number is all you’ll need, but you could also put a form on the page to submit accessibility concerns that way if you’d prefer to streamline the process.

Pomperaug Regional School District keeps a robust accessibility page and statement on its district and school pages to make sure people know the options that are available to them.

The reason this is so important is that you can’t fix the problems that you aren’t aware of! You can spend as much time as you want to resolve all of the issues that you have encountered, but a community member might bring to your attention an issue that isn't easily found. Empowering your users to identify the problems they’re encountering is key in your school’s accessibility journey, and helps to show your commitment to the cause.

Tools to find common website accessibility problems

There are many tools out there that “scan” your website for potential accessibility issues and bring them to your attention to manually correct. Some free tools like WAVE Accessibility Scanner Extension (available for Chrome, Firefox, and Edge) and Lighthouse, are built directly into the Chrome Developer Tool and give you a great idea of what areas of your website need attention.

These tools scan the code of your website and identify common problems that they are programmed to find. This is an important thing to remember when using these tools–they only find specific patterns in your code. 

In general, you should follow up these reports with manual audits to confirm that the problems actually exist. Remember: it’s essentially a robot looking over your code, so that inherently means some issues will be reported that are not actually indicative of a problem, while some valid issues will be missed. Use these scans to point you in the right direction as you are beginning to manually test things out on your site.

Keyboard testing

There are many reasons for a user to navigate your website with their keyboard or a screen reader, including instances when a user with dexterity issues may find holding a mouse difficult. You want to make sure that everyone can access all of your website content comfortably.

To get started with keyboard navigation testing, here are the keys that are the most important: 

• Tab
  • The tab key is used to jump through all of the actionable items on a page. These are primarily going to be all of the links and buttons.
• Space bar & enter
  • Both of these keys are used to activate links and buttons that are focused, however, the space bar will only activate buttons and not links. Because of this, we recommend sticking with the enter key as that should work for all elements that can be activated.
• Arrow keys
  • Scrolling the page vertically or horizontally is going to be done with the arrow keys. 

With the few keys listed above, you should be able to test any of the pages on your website to ensure you can reach all of the links and read all of your content!

Screen reader testing

Screen readers are very powerful programs that can read the text aloud in applications or websites, and similar to our keyboard users there are more people out there using screen readers than just visually impaired users.

On Apple devices, there is an application called VoiceOver that comes pre-installed on phones, tablets, and computers. On Windows, there is a screen reader called NVDA which you can download for free.

While there are a lot of customizable options in screen readers, getting started with them is as simple as opening the applications and using your mouse to point at content on your screen. However, one very helpful option I recommend is to enable the visual output of the text that’s read by the screen reader. 

Screen readers use a robotic voice that tends to speak very slowly, or extremely fast, which can be a difficult learning curve for some. One very helpful workaround I recommend is enabling the visual output of the text—this allows you to mute your computer and everything the screen reader would have read aloud will be speech-to-text'd.

On NVDA, this is an option called Speech Viewer, and on VoiceOver it is called the Caption Panel. With this option enabled, you no longer have to listen to the robotic voice of the screen reader; instead, users can just see the text in a little box on your screen. 

AudioEye

The service that AudioEye provides can be thought of as a mix between an automated scanning tool and a custom-developed solution for your site. The javascript widget that runs on your site provides some functionality that you can see, and some that is invisible. 

In the example above, Ossining Union Free School District uses AudioEye to offer an accessible experience across all its schools.

Clicking on the widget will reveal a number of buttons you can use that have different functions, like making your mouse cursor larger or increasing the font size on the page, but the real magic of their service is what’s happening behind the scenes. While the widget runs on your website, it is scanning the code and applies fixes to the issues it finds. If there are issues that still exist after it applies the out-of-the-box solutions, those problems are cataloged for the developers at AudioEye to take a look at later and apply custom solutions where they are able.

Finalsite has an integration with AudioEye that makes this process much easier for Composer users!

Key takeaway 

A lot goes into maintaining an accessible school website, but it doesn’t have to be a difficult task. Start by learning the POUR principles and lean on your website provider to learn what automation and tools are available to help you maintain your website accessibility for years to come.

ABOUT THE AUTHOR

Nicholas Ivanovich is the accessibility engineer at Finalsite, having joined the team from SchoolPointe in mid-2021. Nicholas has worked closely with the Office for Civil Rights under both companies and has personally coded and tested many accessible solutions.