Optimizing Your Nonprofit Website for Usability

Teal Media
tealmedia
10 min readNov 9, 2017

--

As we celebrate World Usability Day, let’s first take a step back and think about why usability is something even worth commemorating. Why is usability important and how do you know if your website passes the test for usability?

What is usability?

Before we dig into why usability is important, we should define it, since it’s a broad term that can have different meanings to different people. The textbook definition is that usability is “a quality attribute that assesses how easy user interfaces are to use.” Put more simply, usability is the science of how we create technology that makes it easy for people to do what they want to get done.

Note that while the two often get conflated, usability is not the same thing as accessibility. Accessibility is about making your website available to as many people as possible, regardless of what device and web browser they use or disabilities they may have, whereas usability is about efficiency, effectiveness and satisfaction more broadly. Accessibility is a component of usability, but it’s possible for a website to comply with accessibility standards while still having usability issues.

Why does it matter?

While usability is important for all technology, it has particular implications for an organization’s digital presence — especially those in the nonprofit space.

If a user can’t quickly and easily get to your donate page, chances are slim that you’ll receive their contribution. If they can’t find where to sign up to join your email list, you’ve likely lost the opportunity to follow up with them down the road.

The internet is a crowded place these days — people have limitless choice about where to spend their time online, and they don’t have much time to do it. It’s hard for a nonprofit to rise above all the noise and get its message out there. If you’re lucky enough to figure out how to get people to visit your site, you’d better make sure they can get what they’re looking for quickly and easily — otherwise they’ll bounce, and you’ll miss out on what could be your one chance to turn that visitor into a supporter, advocate or donor. One of the best ways to do this is to create a site that is highly usable — one that is beautifully designed, not only visually, but structurally.

There’s a lot of research out there that bears this out:

  • 85% of people abandon a website due to poor design
  • Given 15 minutes to consume content, two-thirds of people would rather read something beautifully designed than something plain
  • 83% leave a website because it takes too many clicks to get what they want
  • 40% never return to a site because the content was hard to use

It’s not just that designing your website with the utmost usability is a good idea — it’s that failing to do so is a really bad idea. Remember — it’s the unhappy customers who complain the most frequently (and loudly) about their experiences. According to the White House Office of Consumer Affairs, a dissatisfied customer will tell between 9–15 people about their experience, while around 13% of dissatisfied customers tell more than 20 people. Multiply that 20 people by the number of followers the complainers have on Facebook and Twitter, and you can see the problem. It’s bad enough if one person has a bad experience on your website — but once they tell their friends about that bad experience, the damage to your brand can be strong and lasting. Above and beyond potential brand damage, we’re also increasingly seeing examples of organizations facing lawsuits when their websites don’t meet some basic minimums for a user’s ability to access and navigate the site — resulting in real financial consequences.

So how do you make sure your site is usable?

We’ve covered why it’s important to craft a well-designed website that puts your users first — it’s the only way to make sure your site is engaging your users, enabling them to get what they need as quickly and seamlessly as possible, thereby advancing your mission. So how do you make sure you’re doing it?

There are 5 key qualities to keep in mind as you think about how to make your website more usable:

  1. Learnability: Is it intuitive for your users to find what they are looking for the first time they are visiting your site? Is it a smooth process? Are they frustrated? Does it hinder the rest of their experience? Do you even know what they want to accomplish on your site? Talk with actual website users to learn more about why they are coming to your site, what’s working well, and where they are getting stuck.
  2. Efficiency: How quickly can your users perform a task once they’ve become familiar with your site? Are they stumbling over simple tasks, or are they able to get in and get out? Be sure to set up and review your Google Analytics on a regular, recurring basis to make sure you know which of your pages are best optimized for efficiency.
  3. Memorability: After being away from the site for some time, how quickly can a user reestablish their understanding of the site? Is the experience relatively intuitive?
  4. Course Corrections: If a user is having trouble accomplishing a particular task, are there tips or hints you can give them that would help them get back on track? Is it relatively easy to for them to recover and be on their way? What pain points exist within the design, and what pointers can you give your users that will help them accomplish their tasks?
  5. Satisfaction: How pleasant was the overall user experience? Are users likely to come back or recommend your site?

At the heart of all 5 of these qualities is the need to prioritize and learn from the people who are visiting your website. This might seem obvious, but we’ve seen a number of nonprofits get sidelined by opinions and assumptions of internal stakeholders (the board, leadership, comms team, program staff, etc.), which leaves very little wiggle room to consider the desires of your users — the very people the site is being built for.

Before you design (or redesign), it’s critical that you talk to your users and learn more about how they want to use your website to access and consume information and take action.

A site that has user feedback baked into it from the beginning will be more usable because you will be designing with them, not just for them.

Usability Checklist

We developed a brief checklist of must-haves for organizations that want to assess their current website or are planning for a redesign with an eye toward usability. A site that incorporates the following items is one that will have a high level of usability for all users who visit your site.

  • User Research: It’s crucial that you talk with your users before you start designing and building. It’s the only way to ensure that you’re building your new site together with them — taking their opinions and needs into consideration throughout the process.
  • Device Optimization: Between desktop, tablet, and mobile, and a range of operating systems and browsers, there’s a wide array of ways people will access your website. When building your site, be sure to test it across a variety of devices to ensure that regardless of how a user chooses to visit your site, the experience is consistent and positive.
Desktop and Mobile comps for the website Teal built for Rewire (https://rewire.news/)
  • Easily Scannable Calls to Action: A quick glance at any page on your website should make it easy for users to to know what it is you’re asking them to do on that page. Is your goal simply to educate them about your issue? To take an action? To make a donation? It’s important that you identify the primary call to action for each page, and make that call to action stand out. Don’t clutter the page with multiple asks, which could confuse users and cause them to abandon the site entirely. Use bold colors and easy-to-see buttons to make it clear to a user what their task should be on each page.
“Take Action” section Teal Media designed for Reproaction (https://reproaction.org/take-action/)
  • Content Presentation: Different people will opt for different levels of engagement with your content. To accommodate for this, smart organizations think ahead about how they want to “chunk” the content on their websites. We recommend taking a “Bite, Snack, Meal” approach. A bite, or headline, lets a user get a sense in a matter of seconds what kind of content will be on a page. That bite should be accompanied by a snack, or a brief 2–3 sentence synopsis of your larger piece of content. When possible, the snack should then link to the meal, meaning the full, original piece of content you developed. By following this approach, you can make sure you’re building a site that accommodates for a variety of user appetites when it comes to content consumption.
  • Privacy Policy: In addition to protecting you legally, a sound privacy policy demonstrates to your users that your organization values them and can be trusted with their information. Any organization that asks people for contact information or money needs to have a clear privacy policy that’s easy to find on their site.
  • Descriptive Links: Avoid using links and buttons that just say “click here” without telling the user more about what they can expect to see once they click. They should always know exactly where you are directing them to spend their time.
“Sign the Petition” link Teal developed with ActionAid (https://www.actionaidusa.org)
  • Regular Analysis and Testing: When an organization launches a new website, there can be a tendency to “set it and forget it,” letting the site run in the background. This can not only open up your site to grave security risks, but it’s also a missed opportunity to learn more about how your users are interacting with your site so you can iterate ind improve based on their feedback. You should be regularly “checking under the hood” of the site and talking to your users to make sure the site is still performing the way they want and expect it to. One way to do this is to implement regular usability testing into your process. When you conduct usability testing, you put your website into the hands of sample users and monitor how they’re using it. During a standard usability test, participants are asked to complete a number of tasks on your website while observers watch, listen and take notes on what’s going well and where people are getting stuck. A successful usability test will not only track quantitative data around task completion rate, but also qualitative data around efficiency and their satisfaction levels throughout the process.
  • Accessibility. As mentioned above, accessibility is a crucial component of a highly usable website — it ensures that anyone is able to access and engage with your content. There are several baseline accessibility standards that you should be paying attention to as you build your website. The first is 508 compliance. These compliance standards are set by Section 508 of the Rehabilitation Act of 1973 that requires federal agencies to provide software and website accessibility to people with disabilities. Websites that are 508 Compliant are considered accessible to all users, and are compatible with assistive technology, such as screen readers. 508 compliance is the baseline you should be aiming for if you want to build an accessible website. The other standard to keep in mind are WCAG 2.0 guidelines. The Web Content Accessibility Guidelines (WCAG) are published by the Web Accessibility Initiative of the World Wide Web Consortium, which is considered to the be main international standards organization of the Internet. The goal of these guidelines is to develop a single set of shared standards for developing online content that’s accessible to individuals across a wide range of abilities. WCAG 2.0 in particular is considered to be the gold standard in accessibility. It’s a stable, technical standard that’s widely used and accepted. If your new website adheres to WCAG 2.0 standards, you’ve taken a huge step toward building a site with a high level of usability.

Putting it all together

Usability is why we at Teal Media do what we do. We want to make the web a better place — for organizations that are trying to make a difference in the world, and for the people who support them. If a nonprofit is going to create a website that advances their mission and engages users, that website needs to be incredibly easy to use. Talk with your current and potential users throughout the process — don’t rely on internal assumptions about what your audiences want and where the pitfalls may lie. Test your assumptions along the way, and use existing standards and guidelines as a benchmark. A credible web design agency can help you set your site up for success, but there’s also a lot you can do on your own. We should all be celebrating #WorldUsabilityDay today because when the web is more usable, we all get one step closer to making the world a better place.

Katy Hinz is a Sr. Designer at Teal Media, a full-service creative agency with a conscience. We pour every ounce of our passion and skill toward your success, because we, too want the world to be a better place. We believe purposeful design can transform organizations, inspire action, and enable progress.

Learn more at TealMedia.com and find us on Facebook and Twitter.

--

--

Teal Media
tealmedia

Teal Media is a full-service digital design agency. We make the web a better place.