Web Accessibility: What Your Nonprofit Needs to Know
As a nonprofit leader, you know that your organization’s website is responsible for sharing core information about your work, impact, and fundraising needs. To raise awareness and support for your cause, your website must successfully disseminate information and boost giving.
Any list of the best nonprofit websites reveals that successful sites are accessible to everyone, meaning your nonprofit needs to pay special attention to accessibility in order to reach as many people as possible. In this guide, we’ll cover everything you need to know about web accessibility, starting with how to define it and why you should prioritize it.
What is web accessibility?
Web Content Accessibility Guidelines (WCAG) are a set of criteria for making web content more accessible to a wider range of internet users. Overall, the goal of the criteria is to ensure that everyone can access and use your website as it’s intended to be used.
These criteria are organized under four principles of accessibility:
Perceivable: Content should be easy to see and hear for all users. Make it flexible so that it can be presented in several ways, including text alternatives, captions, and other assistive technologies. For example, when hosting an auction fundraiser, add alt text for images of auction items so that visitors using screen readers can search your item catalog.
Operable: Users should be able to interact with your website and all of its features via any device and navigate your website with plenty of time to read and engage with content.
Understandable: Make your content easy to read and understand. You can also add extra context, like spelled-out abbreviations, to provide clarification.
Robust: Make sure your website is compatible with assistive technologies and user tools. For example, your form elements might be programmatically set so that users can answer prompts using dropdown boxes.
Each guideline provides success criteria, against which you can test your website to determine its accessibility. There are three levels of success criteria (A, AA, and AAA) and your nonprofit’s website must adhere at least to the second level (AA) of the WCAG to be considered legally compliant.
Why make your nonprofit’s website accessible?
Web accessibility improves everyone’s experience on your nonprofit’s website, not just those using assistive technologies to access the internet. It offers convenience and visual appeal to every visitor, making your website more enjoyable to use for all.
With an accessible website, your nonprofit can:
Be inclusive with the opportunities you provide. First and foremost, accessibility means making your website available to anyone who wishes to visit it. This allows everyone an equal opportunity to engage with your donation page, volunteer registration forms, and other interactive elements.
Reach the maximum number of potential supporters. You’re likely looking for ways to maximize visibility through your nonprofit’s online channels, such as social media or email blasts. Web accessibility puts your website in front of a larger audience, making it more likely to reach new visitors.
Streamline your website’s promotion. According to Cornershop Creative’s Google Ad Grant guide, your nonprofit’s website must be high quality and provide a good user experience to be eligible for the grant. Whether leveraging the grant or simply sharing the link on other platforms, following web accessibility guidelines helps you create a more shareable website. This allows you to maximize the impact your website makes by reaching a broader audience.
Comply with the ADA. The Americans with Disabilities Act (ADA) provides protections for people with disabilities, and courts are increasingly considering websites to be public spaces that need accommodation. Thus, nonprofits need to prioritize accessibility to avoid potential legal pitfalls in the future.
Does your website reflect your nonprofit’s dedication to inclusivity? Your nonprofit has more incentive than any organization to prioritize web accessibility because of your mission to serve others. In the same way that you address the needs of your beneficiaries, consideration for your visitors’ web experience is a reflection of your nonprofit and the ways in which you operate.
5 ways to achieve web accessibility
If you’re ready to improve your website’s accessibility, you’ll need to evaluate everything from visual elements to HTML code. Before this turns into an exhaustive redesign of your entire website, start by using the following five improvements as a checklist to guide your adjustments.
1. Readable font
While you may spend time crafting compelling appeals for support, your text won’t mobilize supporters if it isn’t readable. Use a simple font, like one with a SansSerif style, across your website to ensure it can easily be read by anyone on any device.
Also, pay close attention to the size of your font. Most web design guides recommend a font size of 16 to make sure your content is manageable for the page. Get rid of any special formatting, like italics or all caps, to make it even more readable and less confusing.
2. HTML headings
According to Getting Attention’s digital marketing guide, your nonprofit’s website is the primary resource for anyone engaging with your cause online. To make this resource easy to follow, use HTML headings.
There are six levels of defined HTML headings: H1, H2, H3, H4, H5, and H6, which range in importance from the highest level (H1) to the lowest (H6). These elements are used to designate sections with paragraph breaks and white space, and using them in sequentially descending order is vital to help users understand your content. For example, H6 should be a subsection of H5, and so on.
Consider how The Lymphoma Research Foundation website uses headings to organize information on their About Us page.
This page uses the HTML headings “About Us,” “Our Focus,” and “Our Initiatives” to organize content on the page into easy-to-scan sections. This allows users to find the information they’re looking for quickly, such as general information about the foundation or examples of the foundation’s work.
3. Simplified forms
It’s no mystery that your nonprofit can connect with donors better when you have detailed information about them, but you might be surprised to learn that donation forms are not the place to collect this information.
If you successfully engage and retain donors, you’ll have plenty of opportunities to learn more about them. Forms on your nonprofit’s website should be reserved for simple activities, like submitting a donation or signing up for an email newsletter.
Make forms short and easy to understand and complete, with clear prompts and prominent indicators for required fields. This way, donors will be more inclined to follow through and submit the form.
If you do want to capture additional information on these forms, make sure to mark questions or fields as “required” or “optional” to clarify what users do and do not need to fill out. This is especially important for form fields requesting a phone number.
4. High color contrast
Low color contrast can make it difficult to distinguish different elements on a page. At the very least, this forces website visitors to strain their eyes. However, low color contrast can make your content virtually unreadable for people with visual impairments or color blindness.
Incorporate a color scheme with high contrast into your web design. Using a high color contrast doesn’t mean you have to stick to a black-and-white color scheme, though! According to WCAG, a sufficient color contrast ratio is 4.5:1 for text and images of text. Try running your website’s colors through WebAIM’s Contrast Checker to see what changes you may need to make.
When you balance branding and accessibility, you’ll create a visually appealing and readable website, not one or the other.
5. Image alt text
Alternative text, also known as alt text, provides a text description of an image on your nonprofit’s website. This text is read by screen readers, allowing people with visual impairments to understand the context of an image when exploring your page. Alt text is also helpful for website visitors with poor Internet connection, who are unable to load images on the page.
If there is text in an image on your website, include it in the alt text so that people using screen readers can read the image. However, avoid using images to communicate text whenever possible—there should always be a text element to convey your content.
Test your website’s accessibility to ensure it follows these guidelines. Your nonprofit can leverage manual tests or accessibility tools, such as WebAIM’s WAVE or W3C’s markup validation. To save your team even more time and confusion, you can also connect with a web design company to pinpoint and fix accessibility issues for you.
Test your site regularly to ensure your website’s changes over time don’t interfere with its accessibility. When you stay up to date with the latest accessibility compliance standards and monitor your website’s performance, you’ll consistently provide a welcoming experience for all visitors.