As you perform these site checkups, you will likely notice the need to implement web accessibility best practices into your site. The most effective nonprofit websites are accessible to all users, which is why accessibility updates are critical. By prioritizing an accessible design, you’ll also be:
- Engaging more supporters
- Reaching new audiences
- Generating more virtual donations
- Advocating for and accepting all visitors
To help you get started, this guide to website accessibility compliance includes detailed tips on how to put best practices into action. Here’s what we’ll cover:
- Overview of Web Accessibility
- Top 3 Ways to Make Your Site More Accessible
- Next Steps
As an organization that relies on the generosity of your community, you owe it to your supporters to understand and embrace accessibility compliance so that as many people as possible can have a hand in moving your mission forward. Let’s dive in.
Overview of Web Accessibility
Web accessibility is the idea that the internet needs to be easily and equally accessible for all users. Accessible websites are inclusive to all visitors, allowing everyone to use the site as it was intended to be used. That means your website should be compatible with tools like browser magnifiers, braille readers, and screen readers. However, it’s only in recent years that website accessibility has begun to become more of a reality.
In terms of the legal context and compliance necessities of nonprofit web accessibility, here’s what you need to know:
- The Americans with Disabilities Act applies to many nonprofits. Any organization that offers “public accommodations” is required to provide equal access for visitors, constituents, and/or customers of all abilities.
- The definition of “public accommodations” has begun to expand to include websites in a number of cases over the past several years.
- While nonprofit websites aren’t technically required to comply with the ADA yet, your own site can be required to comply if ADA violations are ever filed against your organization.
While nonprofit website compliance is still somewhat of a legal gray area, your nonprofit should aim for higher accessibility. Since digital engagement has only become more and more critical to nonprofit organizations, inadvertently excluding any supporters or constituents from using your website should be avoided at all costs.
Besides, more accessible websites come with a few additional benefits—speed and a high-quality user experience. With a more organized, well-designed, and inclusive site, your pages will load faster and users can enjoy a more optimized experience. For example, some nonprofit website builders offer a widget to ensure your domain is accessible, according to Cornershop Creative.
Also, Google’s website crawlers will continue weighing these factors heavily as elements that determine how well websites can rank in search results, which is a critical foundation for building a solid web presence. Clearly, website accessibility and compliance are worth prioritizing!
Top 3 Ways to Make Your Site More Accessible
A wide range of technical and design factors contribute to a website’s accessibility. Here are three of the top elements to keep in mind when reviewing your own website, each with a few specific tips for strengthening your accessibility in that area:
1. Tidy, Bold Design
How you create a strong visual design on your site, especially when it comes to incorporating your organization’s visual brand, plays an important role in web accessibility in a number of ways. This includes layout, graphics and photos, text, colors, and any other elements that communicate information. Consider these tips:
- Stick with a simple design. Clear design will always serve your website more effectively than an overwhelming appearance. This gives every visitor a more positive experience, but it’s especially important for users who may be using screen reader devices that can get tripped up on jumbled layouts and unnecessary elements. Flashing images, illegible fonts, autoplay media, and unnecessary pop-ups should be avoided, as well.
- Use high-contrast colors. Colors that are too muted or similar can be difficult for vision-impaired or color-blind users to distinguish. This is particularly important when it comes to text and buttons. If the color of your website’s text doesn’t contrast enough with the background, some users may not be able to read it at all. Additionally, never use color as the only way to communicate information. For instance, color shouldn’t be the only way for users to tell that a field on your donation form is required. You should also indicate that the field is required with text or an asterisk.
- Give each page a clear purpose. A good rule of thumb to ensure that each page on your site is accessible is to give it a clear purpose. What information is the page providing or what will visitors use it for? Focus only on that core purpose and avoid unnecessary elements that could potentially make the purpose unclear.
When it comes to visual design, removing jumbled elements or anything irrelevant to what each page is trying to accomplish will be essential. These best practices should be incorporated into your long-term approach to maintaining your website and adding new content over time.
2. Organized Structures
While the design tips above help to keep the front-end of your website easy to use, you’ll also need to consider how it’s structured on the back-end. The code that makes up your website and the ways in which your pages are structured in relation to one another can have a significant impact on users’ ability to engage with it. Implementing these elements is also beneficial for SEO purposes so more users can reach your site.
- Always use heading tags. Heading tags (<h1>, <h2>, <h3> in HTML) are essential for structuring the content of each page on your website. These tags are used by search engine crawlers to determine what your pages are about. However, more importantly, they’re read by screen reader devices for visually-impaired users. Each page should have one title tag (<h1>) as well as subheading tags that clearly show the information covered in each section of the page.
- Ensure your site’s code is clean. The actual code that makes up your website should be clean—streamlined and without unnecessary or outdated bits. While this tip can be harder to implement on your own, particularly if your website was custom-built by a developer, using a modern content management system (CMS) or website builder can help circumvent this issue. These platforms make it easy to create and update content on your website that is then automatically structured with organized code.
- Provide skip links. For users accessing your website with screen readers, skip links allow them to jump over any parts of your pages that are necessary or useful but not immediately relevant to the page’s core purpose. Your navigation bar at the top of each page is the best example. Rather than forcing these users to navigate each link and label this recurring element on every page they visit, a skip link would allow them to bypass the navigation bar and get straight to the page’s main content.
- Hide decorative images from screen readers. As with the tip about skip links above, it’s important to remember that not every image or graphic on your site serves a core purpose. Some decorative graphics are fine to include and can help create a more positive, branded user experience. However, users accessing your site with screen readers shouldn’t have to navigate through all of them to reach a page’s main content. You can hide these images from screen readers in each page’s backend code.
Web developers and consultants are invaluable partners for ensuring website accessibility through backend elements, but there are plenty of steps you can take on your own, too. By ensuring that each page has a clear purpose and that that purpose is reflected in its heading tags, you’ll lay a solid foundation for accessibility.
3. Text Alternatives
As you clean up the front-end design and back-end structure of your website, remember to consider the content itself. Is your website’s content fully accessible to all users? The biggest culprit in this regard is visual- or audio-only content that can’t be easily accessed or understood by vision- or hearing-impaired users. Remember to:
- Provide alternative text for images. Alternative text, or alt text, is like an embedded caption attached to each image on your website. For users who can’t see the images, providing descriptive alt text allows them to still understand what each image conveys. This is particularly important for images communicating specific information, like text on infographics or event announcement graphics. Your CMS platform should make it easy to write descriptive alt text for each graphic you upload.
- Provide subtitles and transcriptions for videos and audio content. Make sure your nonprofit podcasts include dedicated transcripts that are easy to access and that videos include subtitles and transcripts.
These are among the most important and easiest to implement accessibility tips that you can tackle on your own. Always consider accessibility when creating new content on your website, and make it a habit to provide text alternatives for any content that might be inaccessible in one way or another.
Ensuring website accessibility might seem like a tall order. But, as outlined above, there are plenty of steps that you can take on your own. Building good habits into your long-term approach to content creation and site maintenance, for instance, can make a huge impact on your site’s overall accessibility over time.
This is particularly true if your site is built on an intuitive CMS platform. WordPress and Squarespace are popular examples. This not only ensures that your new content is tidy on the back-end and front-end, but also opens up easy ways to build new functionality. WordPress plugins for nonprofits can help you build out a complete web toolkit without needing to overhaul your site in ways that could negatively affect your accessibility efforts.
For a deep dive into web accessibility, explore the Web Content Accessibility Guidelines (WCAG), the official guidelines used by courts to define ADA compliance for websites. Additionally, try screening a few of your own site’s core pages through Google’s Lighthouse audit tool. This built-in tool audits your pages for core accessibility markers and can point you in the right direction for potential improvements.
For comprehensive accessibility audits and larger-scale design updates, a professional web design consultant will likely be your best choice. An ideal candidate will be able to serve as a long-term partner, fully explaining the improvements they make and offering ongoing maintenance help as needed.
Even as nonprofits explore new ways to shore up funding and engagement, you can’t afford to let your website fall too far behind. As the central location for your fundraising campaigns and outreach strategies, your site will have an increasingly critical role to play going forward! Accessibility is a key component of what it means to have a robust, fully functional, and truly useful website, so it’s a great place to start as you continue refining your website. Best of luck!
About the Author
With 15 years of experience, Ira is an expert in nonprofit online communications and online fundraising. His work has resulted in increased funds and resounding supporter engagement for hundreds of organizations.
Ira oversees Cornershop Creative's project management team and works with clients to provide their clients with the best possible final product. He also manages all of their strategic engagements and helps guide nonprofits to determine their long-term strategy goals for online communications.