The Complete Guide to Nonprofit Website User Experience (UX)

by

Let’s cut to the chase—you’re here to learn about user experience, and you work at a nonprofit.

It’s hard to find straightforward answers on the internet about UX, especially if you don’t have time to study it extensively.

That’s because UX doesn’t fit into a tidy checklist. (At least, beyond some general recommendations.)

It’s highly dependent on your audience and website goals.

That said, this guide will de-mystify nonprofit UX so you can determine whether or not your site may need it.

You’ll get the most out of this guide if you read it from start to finish (about 17 minutes), even if you already know a bit about UX. We’ve cut out the generic stuff you’ll find other places.

You can also skip straight to a section if you prefer:

Part 1: What is User Experience (UX)? (I Still Don’t Understand After The Last 3 Articles)

Let’s briefly touch on the fundamentals:

UX is a tech discipline that improves someone’s experience with a digital product (such as an app or website).

User experience professionals shape the prominent apps and sites you use every day. Their work is what makes something “intuitive” or “easy to use.”

UX broadly falls under the category of design, but it involves a significant amount of research and testing in practice.

In layman’s terms, if you apply the scientific method to visual design work, you get the discipline of user experience.

However, UX is not fundamentally about producing a more appealing visual design. (It’s possible to have a gorgeous design that’s unusable, after all.)

Visual changes to your website’s user interface are simply the final output of the UX process, which involves much more than design.

UX professionals consider, research, and test their visual changes beforehand, making the designs they produce more potent than traditional methods. 

Part 2: How Do I Know If My Site Has UX Problems?

UX issues often manifest themselves in the following areas:

A) Lackluster Engagement Metrics

Engagement metrics measure someone’s activity once they visit your website.

These metrics include:

  • Bounce Rate
  • Time on Page / Session Duration
  • Pages per Session
  • Return Traffic
  • Conversion Rate (i.e., form submissions to solicit donations, volunteers, program or newsletter signups, etc.)

There’s not a number that determines whether a specific metric is lackluster or not (sorry).

You can sometimes find general guidelines to determine if a particular metric is within an expected range. For example, a bounce rate above 90% is almost always a problem.

However, nonprofits who undertake UX work typically have a specific goal (e.g., 250,000 email subscribers) and recognize their numbers need to change to reach that goal.

The numbers are lackluster, therefore, because they prevent the goal from being reached.

B) Low Traffic To Key Pages

Certain pages on your site are more important than others.

Which pages are those? It depends on your organization. (Cliche answer, I know.)

However, typical candidates are:

  • Mission/vision overview
  • What you do
  • Capital campaign appeals
  • Key resource pages (e.g., if you’re a cancer organization, this is information for newly diagnosed patients)

Visiting important pages is typically a prerequisite for someone to engage further with your organization. (It’s hard to do that if I have no idea what you do or how you can help me.)

If your key pages are not consistently in your top pages in terms of traffic, you might have a UX issue.

C) Limited Interaction With Prominent Design Elements

Not all elements of your website design are created equal.

For example, anything on your home page that’s visible without scrolling down (“above the fold”) occupies the most valuable real estate on your website.

You can implement heat maps and click maps on your site to track how far visitors scroll on each page, where they move their mouse, and what design elements they interact with the most.

Reports from these maps reveal if prominent design elements on your website don’t see much interaction—a.k.a., wasted opportunity.

For example, one of Brooks Digital’s UX clients had a carousel/slider of featured content as the first element of their home page—prime real estate. 

The only problem was heat maps and click maps showed no one was interacting with it.

This discovery led them to redesign that main section of their home page to encourage more interaction with their featured content.

Hint: These Problems Are Actually Symptoms

The signs above point to a deeper problem, despite being significant issues. 

Fundamentally, the real issue is a disconnect between your users’ needs and how your site presents its design, information architecture, and resources to them.

It’s this gap the UX profession works to bridge.

UX problems are more likely to become acute the larger your site becomes and the more audience segments it serves. 

That’s because as your audience grows in size and scope, their needs become broader and more varied. It’s difficult for your site to meet these diverse needs without a strong strategy. 

Part of the issue is, at some point, no single person on your staff can understand the complete problems, desires, and motivations of every audience segment.

Most organizations are left to cobble together the experiences and opinions of multiple staff members into a website that loses some of its edge to compromise, committee-based decisions, and politics.

UX cuts through the noise to provide data from surveys, interviews, and testing. It presents your audience in a unified view and tells you how to best structure your website to meet their individual needs.

Part 3: What Should I Expect After My Website’s UX Improves?

Aside from fixing the problems above, there are other outcomes you should expect from the UX process. 

As mentioned previously, research-based UX gives you deeper insights into your audience and their needs, desires, and pain points. These insights are applied to improve your website, but they also have broader implications.

For example, your research may uncover a new marketing channel your audience frequently uses or partnership opportunities with organizations that share your audience.

UX can guide questions that are otherwise very subjective, such as:

  • How do I best organize my website content and navigation?
  • What topics should my website cover?
  • Which website features should I build or prioritize?
  • How should I structure my website page design?

The better you can answer these questions, the more your website will meet your user’s needs.

When you have an established web presence with a lot to lose, having a high degree of confidence in your decisions reduces the risk of failure. This confidence is vital when the alternative is relying on opinions or untested assumptions.

Informed decisions rooted in research will produce more of the metrics that matter (e.g., bounce rate, return traffic, conversions, or whatever KPIs are mission-critical to you).

Part 4: How Is UX Different For Nonprofits?

While the UX process is generally the same across industries, nonprofits have unique goals and constraints.

A nonprofit typically has a wide range of asks on its website, such as:

  • Donate
  • Volunteer
  • Register for a program
  • Spread the word on social
  • Sign up for our email list
  • Etc.

This range of actions makes the goals of nonprofit UX a lot different than your average business, which typically has a singular focus on getting users to buy something.

Unlike purchasing a toaster, giving time or money has less tangible, obvious benefits to a user. 

It’s not like they fill in their credit card information and get a package in the mail a few days later (unless you’re a public radio station).

UX research helps uncover the less-obvious benefits of engaging with your organization so you can communicate them on your website and other marketing materials.

This clarity increases the odds a user will take action.

Users typically also want to build more of a relationship with a nonprofit compared to a for-profit organization. 

The UX of a for-profit site focuses on a sale. However, a nonprofit site must balance the need for users to build a relationship with your organization by exploring your site against the visibility of conversion points such as donations.

Lastly, as alluded to previously, UX helps break up the committee-based decision process popular with nonprofits.

While this decision-making model produces a site that meets the committee’s needs (notably, the need to resolve conflicts of opinion), the needs of a committee are not the same as the needs of your audience.

UX brings objectivity and facts to the table on behalf of your users.

Part 5: How Does the UX Process Work?

We’ve been talking a lot about concepts and theory up to this point. Let’s get into the nuts and bolts of the UX process.

There are six stages of UX work:

Step 1: Stakeholder Discovery

The first step of the UX process is to agree on the goals to pursue. This process happens through conversations with major internal stakeholders of the website.

A discovery is useful not because most UX projects lack goals, but because each stakeholder group usually has different goals. 

If you don’t uncover and agree on where you’re going, the UX team gets pulled in multiple directions and loses focus. 

Typically, those stakeholders fall into rough groups of:

  • Board members
  • Executive/management team members
  • Website administrators and content authors

These groups represent a range of concerns from high-level strategy to day-to-day tactics.

Here are some examples of different goals across those groups:

  • The board will likely be concerned with high-level marketing metrics such as overall website traffic, bounce rate, and conversions.
  • Executive and management team members will also prioritize the high-level numbers (they are accountable for them), but with an eye toward practical concerns such as staff capacity and capabilities.
  • Website admins will be concerned with how the implementation of the UX changes will impact their day-to-day work.

It’s valuable to solicit feedback across the spectrum because each group has unique insights. 

Someone in a content author role may not own a KPI, but they contribute to it. And they understand important details not visible at the 40,000ft level.

Discovery typically takes the form of a high-level questionnaire followed by interviews with key stakeholders.

As those discovery conversations unfold, it’s wise to document the goals you hear and share them with the next group of stakeholders.

By doing this, you collect diverse perspectives and develop a holistic understanding of what your organization truly needs.

Ultimately, someone will need to make the yes/no decision on goals and metrics to pursue.

However, by undertaking a disciplined discovery, you make sure your decision is well-informed, and everyone is aligned moving forward.

Step 2: User Research

Talking to your users is the secret sauce of UX.

Think about it:

If you don’t talk to your potential users, you will make untested assumptions about what they want and need. These assumptions (good or bad) will be taken into the design process and reflected in your site’s final product.

Yes, you probably have a good understanding of your users. After all, it’s your job to serve them.

But have you ever got around to learning specifics such as:

  1. Where they were the first time they started looking for sites like yours?
  2. How they searched for answers? What specific search phrases they used?
  3. Whether the sites they visited (including yours) actually solved the problem for them?
  4. Who else was with them as they browsed?
  5. How they felt as they visited different sites?

In my experience, most nonprofits are not able to answer these questions. 

Furthermore, the people you talk to are probably already aware of your organization. 

But what about other potential audience members who have never visited your website? How do you understand how to reach them and what things they want out of your site?

Answers to these questions (and more) are what gets uncovered during user research.

Practically, user research happens via surveys and group or one-on-one interviews. The purpose and agenda of the sessions vary, but most user research happens inside them.

These surveys and interviews help produce one or more of the following “artifacts”:

A) Competitor Analysis

The word “competitor” is a bit of a misnomer in the nonprofit space. 

However, your organization likely exists as one of a handful of similar organizations that serve the same audience.

Competitor analysis outlines your audience’s perception of similar nonprofit websites in your space (including yours). It helps you learn from similar organizations and position your website to meet needs they don’t serve well.

Without competitor analysis, you risk investing a lot of time and money into a solution another organization has already created. 

B) Personas

Research sessions typically reveal the main audience segments visiting your website.

For example, health websites typically have one or more patient segments, in addition to medical professionals and caregivers. 

Each audience segment has unique needs, desires, and pain points. Personas clarify and document these findings to help you develop empathy for the people visiting your site.

Personas also give you multiple lenses through which to evaluate future decisions. Without them, organizations often tunnel-vision on one or two audience segments, neglecting the rest.

C) Job Cards

The Jobs To Be Done framework augments personas by uncovering specific circumstances that cause an individual to”hire” a website.

For example, a recently diagnosed patient may hire a website to help them make sense of a complex medical condition. Later, that same patient may hire another website to keep them informed on the latest treatments or medical advances. 

Each persona can have different jobs. For example, a healthcare professional may hire a website as a resource to recommend to patients. 

Understanding the unique circumstances of a persona helps you brainstorm practical solutions (e.g., a hub for newly diagnosed patients) while also accounting for that persona’s needs and preferences (such as skimmable content written to someone with no medical background).

D) Journey Maps

As alluded to above, a user needs different things from your site depending on the stage of their “journey.”

The exact stages of a user’s journey depend on your audience, but each persona has them.

For example: 

The medical journey has phases that include awareness of symptoms, diagnosis, and ongoing care (to name a few).

Without journey maps, a health organization will often focus on the ongoing care phase—it’s a perpetual need.

But they might underinvest in catching people when they’re newly diagnosed.

Journey maps help you see these different phases to serve your audience’s complete needs. 

Step 3: Content Strategy

Talking to your users will give you insight into what they want. 

Those insights typically translate into some form of changes to your content.

Content strategy guides how you produce, distribute, and maintain content that’s useful to your audience.

Typically, this will start with a content audit.

A content audit catalogs all the pages on your website and includes useful metadata such as links, topics, tags, authors, pageviews, and other factors relevant to your specific content.

This spreadsheet allows you to see your content at a glance.

Your audit will probably highlight issues with your content. 

For example, your research and audit might reveal: 

  • Your content skews toward a particular audience segment (persona).
  • You have gaps in specific topics that are important to your audience.
  • Your audience prefers a particular channel or medium (e.g., YouTube videos).
  • You’re stuffing your email newsletter with too much content.
  • Your articles are not skimmable enough.
  • A lot of your content is out-of-date.

If you need to make changes to how you create, distribute, or govern your content, you make decisions at this step.

Changes might include adding new topics to your content creation process, deciding to rework your newsletter, or even investing in a podcast or YouTube channel.

These decisions impact the remainder of the UX process, which gets increasingly solution-focused from here.

Step 4: Information Architecture

Your research likely gave you some ideas to better organize your site’s navigation and flow of information.

Information architecture is the process by which you create and test these changes. 

Practically, this takes the form of updating your navigation and testing wireframed ideas for design updates.

You don’t have to do one before the other, but we’ll start with navigation.

A) Navigation: Card Sorting

Have you ever struggled to decide how to organize your website’s navigation? 

There are infinite options and possibilities. It’s like you’re playing a blindfolded game of darts. 

Card sorting is an exercise that has participants group related words or phrases together in a way that makes sense to them.

You start by putting your potential navigation items onto cards. Then, participants either sort them into categories they label themselves or into categories you provide them.

If you do this with enough people (10-40, depending on your moderation approach), clear patterns emerge.

Using the results, you take the most common groupings and create a proposed navigation structure for tree testing.

B) Navigation: Tree Testing

Tree testing gives participants a proposed navigation structure and asks them to locate specific information using it.

It helps you fine-tune the content groupings uncovered during card sorting and verify they translate into usable navigation.

You give participants tasks such as:

  1. You have been newly diagnosed with Stage 3 Hodgkin’s Lymphoma. Find more information on what to expect next.
  2. Your doctor has prescribed you <medication X>. See if you can find the potential side-effects.
  3. You want to make a recurring donation. Find where to begin the process.

Participants use your proposed navigation structure to select the option they feel is most relevant.

The more people choose the correct option, the more usable your navigation is.

You may need to do one or more iterations on your navigation until you’re happy with the tree test results.

C) Wireframes: Low-Fidelity

Navigation isn’t the only component of information architecture.

The way you organize your page design also has an impact on the usability of your site.

“Low-fidelity” wireframes are like napkin sketches for a new website layout.

They can be tested by observing users completing assigned tasks, just like tree testing.

However, unlike tree testing, you observe how users interact with a proposed interface—not an abstract menu tree.

You test low-fidelity wireframes before jumping straight into high-fidelity design work. That’s because low-fidelity wireframes take much less time.

This approach validates whether your concept has any significant usability issues before you commit fully.

Step 5: Visual Design

Visual design is where you start to see all your research and concepts take a recognizable shape.

This guide won’t cover the intricate details of the visual design process that remain unchanged regardless of a UX approach. 

For example, regardless of whether UX is a precursor, the visual design process is usually accomplished via mood boards, wireframes, and high-fidelity design concepts.

However, a significant difference is all the research and testing that led to the visual design solutions you’re creating. You’re not starting from a blank canvas.

You may also perform testing during the visual design process to catch any issues introduced during the design process.

It’s common to use an interactive prototyping tool such as UXPin to build a no-code, clickable mockup to provide to users.

Then, you observe users attempting to complete tasks you give them using the interactive prototype. 

This type of testing verifies your design is intuitive and can be successfully navigated by users in the way you intend. 

Step 6: Implementation

The last step of the UX process is to bring your designs to life on the web.

Like the visual design section, we won’t cover the intricate implementation details that don’t pertain directly to UX.

In brief, the visual designs you tested will be handed over to a technical team and implemented on your website.

You’d think you’d be safe at this point, right?

However, even the best designs may not account for every visual detail (e.g., subtle animation details or uncommon screen sizes). 

Often, this level of detail is not practical from a timeline or budget perspective. 

In this case, developers must fill in the small gaps during implementation to the best of their ability.

Depending on how much license developers had to take, you may also solicit a final round of user testing on the live product. This testing will catch any issues introduced during implementation. 

Parting Thoughts On UX Process

As you might be able to tell, the UX rabbit hole goes as deep as you allow it to.

For nonprofits, the key is to choose how deep you need to go based on your budget, timeline, and expected value from the outcome of UX work.

Larger nonprofits spend more time and money on UX because they have a highly-visible online presence. They have a lot to lose if things go wrong and a lot to gain if they go right.

Smaller nonprofits may skip UX altogether or choose an abbreviated version that matches their budget.

Ultimately, the steps above follow a typical arc of a UX project, but it should be customized to fit your nonprofit’s unique needs. 

Part 6: How Long Does UX Take?

UX work is typically a multi-month process. On average, expect it to take between 2-6 months depending on the amount of work.

Factors that can influence the length of UX work include:

    • The number of stakeholders at your organization
    • How many personas you develop
    • Rounds of research
    • Number of participants
    • The scope of proposed solutions

Coordinating with research participants can also be a roadblock in your timetable. 

For each research session, you have to:

    • Recruit participants
    • Prepare surveys, tasks, or interview agendas
    • Schedule time with each participant (if the session needs a moderator)
    • Review and compile findings from the research
    • Disburse incentives to participants

You will need to solicit paid research participants from an outside vendor to complete the process with a predictable timetable in many cases.

Which leads to the next question:

Part 7: How Much Does UX Cost?

The cost of UX work breaks into three categories:

Category 1: Tools

You will need to purchase one or more subscription-based tools to facilitate user research.

For example:

You should expect the combined cost of these tools to run between $300-500/mo for the duration they’re needed.

While free options exist for some of these tools, cutting costs compromises research quality by limiting the available features. It’s better just to budget to do the research right. 

Category 2: Participant Recruitment & Incentives

It costs money to locate ideal users to participate in your research and pay them for their time.

Typically, you will pay a recruitment company such as UserTesting or User Interviews around $40-50 per person to get the name of someone willing to participate in your research.

Most recruitment tools include a free number of users in your monthly subscription, which helps offset the cost a bit.

You will then need to offer each person an incentive of somewhere between $40-75 to complete the tasks you give them.

Adding these costs together results in a range of $80-125 per user for each round of research you undertake.

It is possible to “recycle” users (e.g., use the same person more than once) to save on subsequent recruitment costs.

Depending on what type of research you are performing, you will need between 5-40 users per round of research.

For a lightweight research project, participant recruitment and incentives could cost around $1,000 for 1-2 rounds of research. More significant UX projects can weigh in at $8,000 to $12,000 in participant costs.

Category 3: Professional Fees

Lastly, you need to pay a UX practitioner or team for all the work outlined previously (unless you have the internal expertise to do it yourself).

Pricing for this varies dramatically from team to team, usually depending on how specialized they are.

Since I can only speak for Brooks Digital, here’s an idea of what we might charge for a UX project. Our pricing ranges from $15,000 to $20,000 at the low end and can exceed $​100,000 in fees for a more complex project.

(Please contact us for current pricing if you are interested, as these numbers are obviously for a made-up project.)

Part 8: So, Do You Need UX?

Hopefully, this guide has answered the question for you already.

If not, ask yourself the following questions:

  1. Does my nonprofit’s site exhibit one or more of the UX problems outlined?
  2. What do these issues cost your organization regarding public perception, fundraising, engagement, and awareness?
  3. Can I budget at least five figures to resolve these issues?
  4. Is the potential payoff from fixing these problems worth the cost?

Only you can answer these questions for your organization.

But if you’re ready to improve your UX (and you’re a good fit for the type of nonprofit we specialize in), please reach out to request a proposal.

Join 1,000+ health nonprofit professionals who receive regular insights and advice to improve their digital presence.

You have successfully subscribed! We deliver our insight pieces direct to your inbox every 2 weeks.

Pin It on Pinterest

Share This