---
title: "Nonprofit Website Design That Works"
source: https://refact.co/insights/digital-product/nonprofit-website-design
author: "Saeedreza Abbaspour"
date: "2026-06-22"
---

# Nonprofit Website Design That Works

You won’t find most nonprofit websites failing on account of a dated look. The trouble is what happens after launch: there is no one to own the site, the donate button has to vie for attention with eight other things on the homepage, and an update to a plugin can slip by unnoticed and put a third of your monthly giving at risk. Then you have the 2026 WebAIM Million audit which turned up accessibility issues in over 95% of homepages, or M+R’s annual figures putting average donation conversion at 1.6%. These are not numbers to be ignored. They make it plain that website design is an operations issue for nonprofits these days, not merely a matter of graphics.

This guide is meant for the reality of leading a redesign. We get into how to pick technology your people can live with, where your donation flows are bleeding money, what to put in the budget for the two years down the road, and the decisions to be made before any layout work begins. We want a site that will keep up its end when the project email thread finally dries up.

## The Website Is Operating Infrastructure, Not a Brochure

In the old days a nonprofit site was a neat little summary of the organization. Not anymore. It is the front door for a host of different audiences. Eighty-eight per cent of donors do their homework here before they part with their money. Partners come to check program eligibility, volunteers for a form, funders to see if your reporting is up to date.

That is why a pretty face-lift from an agency can set you back. Retrospectives will tell you of 10 to 30% declines in online donations following a rebuild that has buried the path to donate or made the forms too long. You might be looking at 12 to 18 months to recover, and then a new leader comes in and wants “another redesign.” But the work was never in the design. It was in the structure.

### What the site has to do

Any worthwhile nonprofit website has to do four jobs:

-   **Build trust fast.** Your mission and proof of impact should be self-evident on the homepage and campaign pages.
-   **Direct people to act.** Whether it is to apply, register or donate, you need to design around the primary path for each audience.
-   **Cater to more than just donors.** Funder reviewers, media and implementing partners are on your site too. With only 23% of nonprofits providing content in multiple languages, you are limiting your reach.
-   **Be easy to keep current.** Your staff ought to be able to put up a program update or correct a typo without having to file a ticket.

If your site is lacking in these areas, do not blame a lack of effort. Chances are you have no one with the authority to make the necessary tradeoffs.

## Decide the Strategy Before You Decide the Design

We see projects go off the rails in the same way. Someone will open up Figma or start looking at themes before the team has decided what the site is for. When the mockups come in, every department is vying for a spot on the homepage, the navigation is as convoluted as an org chart and the donation page has put on three extra fields.

There is an unglamorous fix to this: answer four questions before you give the nod on a design comp.

1.  **Who is the main audience for the page?** You may have donors, funders and beneficiaries but the homepage can’t talk to them all on equal footing. Choose the one whose action is most important.
2.  **What is the measurable conversion?** One per page. A grant application, a recurring signup. Don’t call it “engagement.”
3.  **What has to be clear in three seconds?** Why we are credible, who we help and our mission.
4.  **How do you measure it after?** Put in place the instruments to track baseline rates and dropoff before you start, otherwise you will never know if the new site is doing any good.

A proper discovery phase should yield five concrete things, not a mood board.

| Output | Why it matters |
| --- | --- |
| **Audience priority** | Stops the site from trying to serve everyone equally |
| **Primary conversion path** | Gives the homepage and nav a clear job |
| **Page list with sunset decisions** | Prevents bulk migration of outdated pages and the content debt that follows |
| **CRM and integration map** | Forces field mappings to be decided before the build, not after |
| **Success metrics with current baselines** | Gives you a way to defend or fix the new site after launch |

If leadership can’t put the site’s goal in a sentence, you are not ready for design. That sentence is worth more than a finished mockup. Should you need an outside voice to make your case to the board, the Association of Fundraising Professionals has some [website refresh research](https://afpglobal.org/website-refresh-statistics) that is worth a look.

At Refact we have built our [product discovery process](https://refact.co/insights/digital-product/product-discovery-process) around this sort of thing, and we back the discovery phase with a money-back guarantee because that is where you stop the expensive mistakes.

## Map the Site Around How People Decide to Give

When the strategy is in place, the sitemap should reflect how people think, not your internal hierarchy. A sensible default would be:

-   _Home_ – state the mission and have one CTA
-   _About_ – for the financials and leadership
-   _Programs_ – arranged by who you serve
-   _Impact_ – with real outcomes
-   **Get Involved** – for signups and volunteers
-   _News_ – if you have someone to run it
-   _Donate_ – a repeated option on every page

Don’t let your donate button get lost in a submenu or at the foot of a long story page; that is the surest way to see your donations fall after a redesign. Have a look at Double the Donation’s list of [top nonprofit websites](https://doublethedonation.com/top-nonprofit-websites/). Not to copy them, but to see how the good ones make the right action obvious.

### Donation flow is product design

And then there is the donation page. It is the highest-leverage screen you have and most are broken in quiet ways. According to M+R, desktop is responsible for 72% of revenue and 57% of transactions, with an average gift running $168 compared to $88 on mobile. You will see more visits from mobile, but also smaller gifts and a higher rate of abandonment. The two are not the same thing, yet both flows are important to get right.

There is nothing subtle about what drives conversion:

-   **Keep the fields to a minimum.** Once you go beyond the essentials, you see completions drop. Let the receipt flow handle the address details.
-   **Make your suggested amounts mean something.** An input field left blank is no match for one that says “$50 funds one week of meals.”
-   **Put the recurring option front and center.** A monthly option that is pre-checked or on equal visual footing is the one revenue lever most nonprofits leave on the table.
-   **Allow guest checkout.** Requiring an account is the surest way to lose people.
-   **Trust has to be visible.** Don’t hide security badges or third-party ratings in the footer. Put them by the form where they can be seen.

The logic holds for campaign-style fundraising as well. Your page should operate like a Kickstarter: clear urgency, defined impact tiers, one path for the supporter. PledgeBox has a good model for how to put this together in their overview of [managing nonprofit Kickstarter projects](https://www.pledgebox.com/post/kickstarter-for-nonprofits).

## Pick Technology Your Team Can Maintain

Some 55 percent of nonprofits are on WordPress; the remainder is mostly Squarespace and Wix. But don’t let feature demos sway you. What matters is who is going to be maintaining the site once it is live.

| Option | Good fit for | Real tradeoff |
| --- | --- | --- |
| **WordPress** | Nonprofits with regular content, multiple editors, and integration needs (CRM, donation platform, email) | Plugin sprawl and security debt if no one owns updates |
| **Hosted builders (Squarespace, Wix)** | Small teams with limited capacity and simple content needs | Platform dependency, limited integration, and platform-level risk (we have seen sites refunded and shut down without warning) |
| **Nonprofit-specific platforms** | Organizations that want website, CRM, and fundraising bundled | Less flexibility, vendor lock-in, and migration pain later |
| **Headless CMS** | Larger nonprofits feeding content to a website, mobile app, and partner portals | Higher build cost and ongoing engineering need |

For the majority of nonprofits, WordPress is where you want to start. You have a large pool of maintainers, staff know the editorial side of things, and the integrations with your CRM and donation tools are well established. The danger is letting plugins run amok. Each one is a future security patch and a potential point of failure. We go into this at length in our [comparison of website builders for nonprofits](https://refact.co/insights/wordpress/best-website-builders-nonprofits-2026).

In the end, the CMS is less important than the integrations. Make your calls before you begin building:

-   Are you using Stripe, Donorbox, Classy or something native?
-   Which CRM is it, and what fields do your forms feed into?
-   How will marketing automation and email pick up new names?
-   In terms of analytics, how do you tie a page event to a donor record?

Too many stacks are cobbled together in the order vendors were approved. If you map the integrations in discovery rather than after launch, you have a system instead of a pile of tools.

## Treat Accessibility as Part of the Design System

Then there is the matter of accessibility. The WebAIM Million 2026 audit turned up WCAG failures on over 95% of homepages. Yet only 26% of nonprofits say they design for those with visual or hearing impairments. It is the biggest chasm between rhetoric and reality in the sector.

Overlay widgets that claim to fix compliance with a bit of script have done more harm than good. They are no solution and have been the subject of lawsuits for giving you a false sense of security while introducing new errors.

What works is unglamorous work built into the system:

-   **Color contrast** that is WCAG 2.1 AA compliant against your actual palette.
-   **A single H1** per page with a logical H2/H3 hierarchy for screen readers.
-   **Alt text** that is useful on the images that matter and empty on the decorative ones.
-   **Keyboard navigation** for modals and the donation form.
-   **Testing with real assistive technology**, not just a scanner.

This is where most fall short. The homepage may be fine, but the PDF program guides and campaign landing pages where the money is made are often not. If you are on WordPress, check our guide to [WordPress theme accessibility](https://refact.co/insights/wordpress/wordpress-theme-accessibility) so a theme doesn’t become an expensive headache.

## Plan for the Two Years After Launch

Count on a pro bono or “free” site having a life span of 18 to 24 months. Eventually a plugin update will break something, the volunteer who put it together will be gone and you are left with abandonware. Don’t turn down donated work, but do insist on a maintenance plan to back it.

A proper three to five year plan should cover:

-   Monthly security and plugin updates.
-   Quarterly content and analytics reviews with an owner for each section.
-   One big refresh a year to coincide with the annual report.
-   Redundant credentials and documentation so the site isn’t held hostage by one person’s password.

Look at Charity: Water for an example of continuous optimization. Their team treats the donation page like a product and runs A/B tests on everything from copy to imagery to grow recurring revenue. WWF and The Trevor Project do the same with their microsites and mobile performance. None of them build and walk away.

To put a number on the investment, our [website redesign process](https://refact.co/insights/digital-product/website-redesign-process) lays out the cost and timeline. And if you need to make the case internally, this [website ROI calculator](https://www.mailneo.co/calculators/website-roi) will show you the expected lift in donations and volunteers.

### What to test before you launch

Before you put the site out there, run a proper checklist. Not a polite one.

You need to put the site through its paces. That means end-to-end testing of every form you have: donation, contact, volunteer, newsletter. Verify it in the CRM. Put the donation flow to the test on three different devices, an older Android phone among them. Make sure your analytics are picking up on form submissions and not merely pageviews.

Then let a content editor who had no hand in the build try to update a page from the ground up. Do a keyboard-only run-through of the homepage, the donation and a program page. And see if staff can put things right after a plugin update goes south without having to ring the developer.

If any of that does not hold up, the site is not ready for prime time, launch calendar or not.

## The Mistakes That Make a Redesign More Expensive

There are a few patterns behind the costliest nonprofit web projects. We might as well be blunt about them.

**Board-driven aesthetics trumping user research.** A board member thinks the homepage “looks dated” and wants a re-do? Get the data before you do anything. **Lack of baseline KPIs.** You have no pre-launch metrics so you can’t say if the new site is of any use. It will be judged on taste alone. **Moving outdated pages in bulk.** An unchanged page is just a cleanup job down the road. It is cheaper to make a sunset decision than to do some digital archaeology later. **The CRM is an afterthought.** Wait until the forms are done to map them to the CRM and you will lose donor lifecycle data. **One person has all the logins.** You will find out how much of a single point of failure that is when they walk out the door. **Thinking the launch is the finish line.** The work really begins at launch when the site starts to put up evidence.

Should you be looking to put a project to market, our [request for proposal guide](https://refact.co/insights/digital-product/request-proposal-website-redesign) will show you how to scope it so these issues don’t make it into the contract.

In the end, the prettiest site is not the one that will perform over five years. What you want is a clear owner, an accessible underpinning, a donation process built for completion and a maintenance budget that can stand up to a change in leadership. If you need to get those decisions made before development gets underway, Refact’s [nonprofit web development](https://refact.co/industries/nonprofit) practice is there to handle it, with [ongoing maintenance](https://refact.co/services/website-maintenance) to ensure the result doesn’t slip.

## FAQ

### How much should a nonprofit budget for a website redesign?

Costs vary widely with scope, but the more useful framing is total cost over three years, not the build alone. A focused refresh runs in the low five figures and ships in one to two months. A custom WordPress build with CRM integration usually takes three to six months and runs mid-to-high five figures. Budget an additional 15 to 25% of build cost per year for maintenance, content, and optimization. Sites without that ongoing line item tend to degrade within 18 to 24 months.

### Should we use WordPress, Squarespace, or a nonprofit-specific platform?

Match the platform to who will maintain it. WordPress is the right default for nonprofits with regular content updates, multiple editors, or CRM integration needs, because it has the largest maintainer pool and the most integration options. Squarespace works for very small teams with simple content. Nonprofit-specific platforms (Firespring, NeonOne) are worth considering when you want website, CRM, and fundraising bundled, but you trade flexibility and accept migration friction later.

### What is the single biggest cause of donation drops after a redesign?

Buried or redesigned donate paths. When the donate button moves from a prominent header position into a 'Support Us' submenu, or when the donation form gains fields, requires account creation, or loads slowly, donations drop 10 to 30%. The fix is to instrument the donation funnel before launch, keep the new flow at least as short and visible as the old one, and run A/B tests on the donation page after launch rather than redesigning it again from scratch.

### Do we really need WCAG 2.1 AA compliance? We are a small nonprofit.

Yes, for two reasons. Accessibility lawsuits against small organizations have grown, and overlay widgets are not a defense — they have been named in cases themselves. More practically, accessibility improvements (color contrast, clear headings, keyboard navigation, plain language) improve usability for every visitor, including older donors and people in low-attention contexts. Build it into the design system from day one rather than treating it as a checklist at the end.

### How often should a nonprofit redesign its website?

Most nonprofits do not need a redesign as often as they think. About 25% plan one within two years, but the underlying issue is usually neglect, not design failure. A 3-to-5-year cycle for major redesigns, paired with quarterly content reviews and ongoing A/B testing on key pages, produces better outcomes than periodic large rebuilds. If your team is calling for 'another redesign,' the first question is what was tested and learned on the current site.