Your website lets your supporters donate, support, and interact with your nonprofit. Ensuring your website is accessible is a must if you want to engage with all of your supporters. If your website’s out of date or not optimized for accessibility, you are losing important members of your audience and potentially breaking ADA (Americans with Disabilities Act) best practices.
Nonprofits are required to follow ADA guidelines in their physical premises, but your nonprofit’s website should aim to be compliant, as well.
While there are no concrete rules around ADA compliance for websites (yet), courts are increasingly ruling that organizations should treat their websites as “public accommodations” that meet ADA standards. If your nonprofit is ever charged with violating the ADA, your website will likely be scrutinized and required to follow the WCAG Guidelines that define compliance.
But even aside from compliance concerns, having an accessible website offers a better user experience, helps promote inclusivity at your nonprofit, and has the potential to raise your website’s search engine rankings. Most of the best nonprofit websites are already fully accessible, but it’s never too late to start if yours isn’t.
To improve your website’s accessibility, this guide will walk through six best practices for these key elements of your website:
Each section will discuss common pitfalls and how to fix them as well as the added benefits they’ll bring for all of your website’s users. Remember, most strategies that improve accessibility make your website better as a whole, meaning implementing any improvements is definitely a worthwhile endeavor.
Your website’s design should be modern, representative of your brand, and clutter free. Most nonprofits are not run by web design experts, and feeling pressured to create a website quickly and on a budget can lead to design choices that harm your users’ experience. A few design choices that can hamper your website’s accessibility are:
If your nonprofit needs help brainstorming initial designs that will look good on the web while also being accessible, consider hiring a design consultant. Professional web designers are invaluable partners when it comes to creating well-designed websites that your nonprofit can continue to maintain long after they’re created.
Images attract attention and can be used strategically to direct visitors to important items and pages on your website. However, images can also slow down your website and cause frustration for visitors using screen readers. For each image on your website:
All images and graphics should also be tested with colorblind filters, as well. Make sure anything on your website indicated by color has a second visual indicator to help your users complete forms, navigate your website, and find the information they need. For example, required fields on your donation form should be indicated with an asterisk or other marker aside from just text color.
Visitors come to your website with expectations about how a website should look and be navigated. While you may be tempted to give your visitors a unique experience, your navigation bar is not the place to do it, as unorthodox navigation leads to a frustrating browsing experience.
For example, consider your nonprofit’s donation form. You want to make the donation process as easy for these supporters as possible to avoid donor abandonment, wherein donors leave your website without completing their gift. You can accomplish this by:
Conduct user testing by having people unfamiliar with your website attempt to complete tasks like making a donation. By doing so, you can get data on how new visitors are navigating your website and interpreting your navigation labels.
You likely have a lot to say about your nonprofit, but your website only has so much space. Overloading your website with information is a common mistake in web design often committed by younger nonprofits that don’t have as many high quality images to break up blocks of text.
In addition to what your text says, how you present your text can determine whether or not your page is actually readable. As you configure how text displays on your site, consider:
Text hierarchy can also improve your navigation by giving readers ordered headers and bulleted and numbered lists. The labels and white space created by these text elements helps readers skim long documents to find the information most pertinent to their needs.
Videos and interactive media can say a lot about your nonprofit and give supporters a unique experience when they visit your website. However, these items are often the first thing to cause trouble with accessibility.
Similar to alt text for images, your videos and interactive media should have transcripts and/or subtitles available for visitors using screen readers to engage with your content. Provide alternative ways to obtain the information present in these features, as well, for your visitors with slow internet connections that may fail to load bandwidth-heavy media.
Regularly check up on your website’s media when you perform website maintenance. Cornershop Creative’s guide to nonprofit website maintenance recommends setting automatic tests to regularly check that all video features are working. Hosting your videos on a third party website like Youtube is another option, but proactively check how the dimensions of the video appear on your website to ensure there is no distortion.
Many of your visitors will view your website on their phones, and nonprofits of all sizes are increasingly tapping into these opportunities with mobile-optimization strategies and apps.
As you optimize your website for mobile use, pay special attention to media, images, and design elements on your website. The mobile version of your website will likely need to exclude some images in order to remove clutter and increase load speeds. Consider what design elements of your website most effectively get your brand message across in a small space. Then adapt your mobile page layout around your logo and brand colors, identifying your nonprofit quickly and without distracting from your website’s content.
If your nonprofit is interested in launching a mobile app, review how your nonprofit’s images and branding appear on the app before pushing the service live. Mobile apps have different requirements than website design, so consider using third-party services to expand onto users’ phones. For example, this guide from Pathable has several options to consider when improving the mobile experience for attendees at your physical or virtual events.
Even without a dedicated mobile app, though, mobile accessibility needs to be a top priority for your website as a whole. Check your website builder’s or CMS’s (content management system) theme to ensure new web pages automatically adapt to mobile. Most modern CMSs already come with mobile optimization features, but be sure to ask your web designer for details when needed.
Web accessibility makes your website usable for a larger audience, and many accessibility practices such as clutter-free designs, easy navigation, and mobile optimization make your website better for everyone.
If your nonprofit needs additional help designing an accessible website, consider reaching out to nonprofit web design consultants, who have years of experience helping similar organizations build their websites.