Why Should My Nonprofit Care About Website Accessibility Standards?

Have you thought about what it’s like for a person with a disability to use your website as it was intended to be used? You aren’t intentionally exclusive when it comes to who can join your community, so why wouldn’t you want a website that mirrors your organization’s inclusive values? Website accessibility standards help you create a truly user-friendly website that provides a positive experience for everyone who visits.

Web accessibility is a massive topic, and there’s a lot to cover. This post is not meant to be a comprehensive guide to creating an accessible nonprofit website, but rather we’ll dive into what website accessibility means and why it should be on your organization’s website wishlist. In fact, we’re still working to improve our own website to follow accessibility best practices.

What Are Website Accessibility Standards?

In short, following web accessibility best practice means that the website (or digital tool or online technology) was created so that those with disabilities can use it as it’s meant to be used. It takes a variety of disabilities into account, including auditory, visual, physical and cognitive. For example, those who are blind, color blind or unable to use their hands would all be included.

Designing and developing across such a wide range of abilities might seem a little overwhelming, but—lucky for us—a set of universal guidelines exists. The Web Content Accessibility Guidelines (WCAG) are the standard to follow to ensure a truly accessible website.

But My Nonprofit Doesn’t Serve People With Disabilities

Sorry, but that’s not a valid excuse. The guidelines do help users with disabilities, but they’re helpful for all of your users. Accessible design is now the best practice for website usability, no matter the audience. Plus, you wouldn’t want to turn away potential donors or volunteers by going against the best practices for nonprofit websites.

In case that’s not a good enough reason, web accessibility is especially helpful for people in the following situations:

• Using a small screen, such as a mobile phone
• Older supporters or clients with changing abilities
• Temporary disabilities, like a broken wrist or lost glasses
• Situational limitations, like too much sunlight or a quiet environment that prevents you from listening to audio
• Slow internet connections or limited bandwidth

The bottom line is that every nonprofit should be concerned with accessibility and strive to make their site welcoming to any user that should land on it.

Common Frustrations

Imagine that you have a vision impairment that requires you to use a screen reader to surf the web or you have a motor disability that prevents you from using a mouse or trackpad. Would you be able to navigate your nonprofit’s website? These frustrations are common for people with disabilities across the web:

• Having to listen to a screen reader repeat your entire navigation on every page they visit on your site before they can hear any of the actual content on the page
• Being excluded from helpful or key features of your site because they can’t be operated with a keyboard
• Not seeing links to helpful content because they are indistinguishable from other text
• Not being able to consume images, video or audio content because there are no transcripts or captions
• Not being able to focus on the content because there are too many animations or movements on the page
• Not being able to read or re-size small fonts
• CAPTCHAs that often exclude people with visual impairments and learning disabilities

Are you guilty of placing your visitors in any of these distressing situations? You’re certainly not alone. Being aware of the problem (and letting others in your organization know) is the first step toward a solution. Maybe you can’t get the buy-in or find the capacity for a big development project just yet (we feel you—we’re still working on our own site), but small steps like adding photo captions or turning off an image rotator can go a long way.

Web Accessibility in Practice

Let’s take a step back and look at the principles of accessibility standards. If you are new to accessibility, it’ll likely take some time and effort to learn the common issues and solutions. And that’s before you can go about implementing those solutions!

Let’s take a look at four of the main accessibility principles, along with key examples of ways that they can be applied to a website.

Variety of Ways to Consume Content

• Make sure to include text alternatives for any and all non-text content, like images, videos, icons and graphs
• There should be captions and other alternatives for multimedia, like text transcripts and sign language interpretations for audio files or audio descriptions of important visuals in video content

Easy to See and Hear

• Color should not be the only way to distinguish content (Check your links! Are they underlined as well as a different color?)
• Text should be re-sizeable up to 200%
• Users should be able to pause and adjust the volume for audio files

Easy to Use

The following usability principles center around “focus”. Focus is most helpful for people who aren’t able to use a mouse. As they move through a page with their keyboard, whatever is focused will change visually so that they can easily see which element on the page they are interacting with.

• Everything a user can do with a mouse can also be done with a keyboard
• There should be an indication of where the focus is on the screen (like a cursor, border or highlighting)
• Bypass blocks, hidden links that allow users to skip sections of repetitive content, can be used to ensure that focus doesn’t get trapped in any of the content when navigating using a keyboard (like getting caught in the navigation on each new page)

Easy to Understand

• Give enough time to read or use the content, meaning you remove interruptions unless necessary
• Users should be able to pause, stop or hide any moving content (like an image rotator)
• Users can easily navigate and find the content they need, meaning logical page names and website structures
• Users can determine where they are in the structure, and there is more than one way to find related pages within any section of your site (think the main navigation, sidebar and breadcrumbs)
• There should be ways to skip content (like the navigation) that are repeated on multiple pages, such as through the bypass blocks mentioned above

This list is not anywhere near comprehensive. And if you take a look at the guidelines, that will become clear very quickly. But it should give you a good idea of where the website accessibility standards come from and what you can review and adjust on your current site to get started on your journey to accessibility.

Some of these fixes are as simple as adding alt text to an image, whereas following other website accessibility standards may require a web developer to spend a few months re-coding a feature of your site.

Testing Your Website

So how do you know whether or not your nonprofit’s site follows website accessibility standards? Testing your website for WCAG 2.1 compliance will likely be an ongoing process as you work to improve specific features and functionality.

Even if you’re not a web developer or comfortable adjusting the code on your website, accessibility tests will show you how big the problem may be on your website. Seeing multiple errors and warnings is not great. It’s a good indication that it’s time to work with your developer to make some changes that set you on the path to complying with website accessibility standards.

The following tests should put you on the right track as you assess what work needs to be done.

Validation Tool

A Hypertext Markup Language (HTML) validator checks your code for syntax errors, in this case, errors relating to accessibility. Drop your URL into the World Wide Web Consortium’s HTML validation tool to test the code on your website for elements that go against best practices. It will return a list of errors and warnings for specific snippets of code on your site.

Testing With Chrome Browser Extensions

You can also use a browser extension to analyze the code for accessibility on specific pages or features on your site. We like the aXe accessibility test and WebAIM’s WAVE accessibility test. Each test will return a list of errors and warnings for you to consider as you improve your site. And, along with those errors and warnings, you’ll find helpful links to why a certain technique is considered a best practice.

Manual Tests

Because it’s tough to automate an accessibility test, we’d still recommend manually using your keyboard to navigate your site via Tab and Shift + Tab. You’ll want to ensure you can completely navigate your site, including any special features or functionality. And, if you want to get even more in-depth with your testing, you can try using your site with a screen reader. Our team uses Windows computers and likes the NVDA screen reader.

Accessible Website Options

Moving to more accessible web design doesn’t need to cost a fortune, but it is much easier to implement as you’re building a new website than it is to retroactively improve your current website. Because accessibility is important to us at Wired Impact, we made sure that our platform could support nonprofits interested in building a website that’s welcoming for all.

It meant a lot for us to create a design option for our platform that was compatible with website accessibility standards. Our newest website design option, Pioneer, was designed to be compatible with the Web Content Accessibility Guidelines (WCAG 2.1) and is an excellent jumping off point for nonprofits without the budget or development know-how to build an accessible website from scratch.

Helpful Resources

If you’re interested in learning more about website accessibility standards and how you can improve your nonprofit’s website, the following resources and online courses are great places to start:

• WCAG 2.1 Guidelines
• Google Accessibility Fundamentals
• Mozilla Developer Network Accessibility Documentation
• The A11Y Project
• WebAIM
• Tuts+ Accessibility Course
• Web Accessibility two-week course by Google
• Accessible Content: 7 Tips for Inclusive Web Pages [Checklist]

Aside from a welcoming online presence, creating an accessible website will be integral for your organization keeping up with technology trends and best practices moving forward.

What accessibility issues does your nonprofit’s website have? Have you dealt with a common standard or frustration related to accessibility that didn’t make it onto our list? We’d love to hear about your experiences with website accessibility standards in the comments.