Designing a Nonprofit Website in Six Steps

In this day and age, an organization without a website is like a fisherman without a hook… patiently waiting to catch a big fish with no bait. This goes for both profitable businesses and nonprofit organizations alike.

Often times, nonprofit organizations are tight on resources and their websites may be (unintentionally) swept under the rug. This can lead to outdated or even nonexistent websites.

But, don’t let that discourage you!

There are many ways to build your online presence. But you must first understand everything that goes into creating a successful website. To help smooth out the process, here are six key factors to consider when creating/revamping your nonprofit website.

1. Decide How to Build Your Website

First thing’s first, you need to decide how you will be building your website. You must review your options and figure out whether you, yourself, will be responsible for your site… or if you would rather have a professional do it for you.

Here is a breakdown of the various methods:

  • Seeking professional help from a web developer. This option almost always guarantees a successful website that has been fine-tuned to represent the uniqueness of your organization.

    A good web developer will dive headfirst into your organization’s “mind” and take the necessary time to understand its cause and problems you are facing (see: the Discovery phase in our creative approach). Using what they’ve learned, they can build a website that embodies exactly what your organization is all about.
  • Using a website builder. This method is much more personal and saves you from having to pay for a web developer. There is a wide variety of website builders and content management systems (CMS’) to choose from—like WordPress (with a Visual Builder or Reusable Blocks), Wix, Webflow, and Cosmic JS.

    Many of these website builders offer a selection of templates that are prebuilt. All you have to do is choose your look and layout and plugin your organization’s information.

For a reasonable price, these website builders allow you to easily create a website – without requiring you to do much of any manual code editing (aka a ‘low-code’ or ‘no-code’ environment). You can choose from countless themes and install helpful plugins that make running your website a breeze. At Key Medium, WordPress with a Visual Builder is our go-to suggestion and we have over a dozen happy clients in the past year alone.

Consideration should be given, however, should you require customization and specific functionality that won’t be available out of the box. Some examples include a resource locator to support homeless services such as where to find food pantries or hygiene locations, for example. For these custom applications and extensions of functionalities, you can always get in touch for a fifteen-minute consultation. It may be as simple as installing and configuring a WordPress plugin, or it may require a completely new web application buildout—depending.

2. Know When to Redesign

There comes a time when every website needs some tweaking or revamping. Knowing when to redesign your site is key to keeping it from falling off the deep end. Technology is constantly advancing; it is wise to keep your website on the same path.

Let’s check out some of the indicators that let you know it’s time for a revamp:

  • Is your site mobile-friendly? You don’t want your website to be difficult for mobile users to navigate. A reported 46% of consumers won’t revisit a mobile site if they had issues with their first visit. Read: Why Mobile-first is a Necessity.
  • How is your bounce rate? Your bounce rate is the percentage of viewers that visit your site and end the session without leaving your homepage. A high bounce rate indicates a failure to captivate your visitors. Check your mobile site speed here.

How is your user experience, or UX? If your site is easily navigated, lacking bugs, and visually appealing then you’ve got it down! A reported 53% of viewers will leave a site if it takes too long to load, and 38% will leave if it’s not aesthetically pleasing. Read: User Experience Design Trends in 2020.

3. Top Performing Website Pattern Guidelines

Your website’s structure is how your homepage and web pages are organized. Your website’s structure should make navigation simple for your visitors.

Here are the various structures we’ve assembled specifically for nonprofits through our experience over the past decade in developing sites that work well:

  • Classic – focuses on a tried and tested sitemap design
  • Program-Driven – focuses on conveying multiple initiatives and is driven by programs
  • Direct Service Provider – driven by direct service providers to the community
  • Research/Policy-Driven – focus on educating and driving engagement

You want every visitor to have a seamless experience that entices them to donate to your cause and advocates on your behalf—and this starts with clear information architecture—so that you can in just a few short seconds give users an idea of your organization. Read more: nonprofit sitemap design.

4. Don’t Make it All About You

Too often do you see the common mistake of nonprofit websites centering all focus on their organization and what it’s all about. This often creates distance between potential supporters and the organization.

Balancing your organization’s cause with the voices and stories of the people you’re aiming to help is of utmost importance. If your goal is to raise funds for social service, then the best way to convince visitors to donate to a cause is by sharing real-life stories from the very people they will be helping. This quickly enables the persuasive design principle of ‘Social Proof’.

Another method, if your primary goal is program-driven and/or requires membership, then leading with benefits will be key. One thing with benefit-led messaging and design patterns– it highlights immediate benefits to your users and potential new members. See: BicycleCoalition.org for an example of this, and note the 3 benefits immediately displayed—based on a data-informed (aka A/B tested) design pattern called a ‘Benefits Bar’.

5. What is SEO and Why Does it Matter for Nonprofits?

SEO, or Search Engine Optimization, is how you get more traffic to your site through search engine results. While this can be paid for, SEO is more about increasing traffic organically – without having to pay for it.

SEO is important for EVERY website – it’s the best way to help people (potential donators) find your organization online! Ranking high organically helps direct high-quality traffic to your organization’s website.

Some of the best practices for SEO include:

  • Paying attention to and utilizing keywords – be sure to use these in titles, headlines, and within your content (overusing keywords can sometimes make your website/content seem generic)
  • Following an SEO checklist – optimize your site by using tags and meta descriptions
  • Utilizing Links – use backlinks to link your content to outside sites

Your SEO strategy should hold high priority on your list for creating a successful website. If executed properly, it will enable you to gain visibility and effectively increase brand awareness. It will also allow you to hone your messaging and improve your user’s journey when they are searching for you, your programming, or a specific value-add resource that your organization may want to share.

6. Why Web Design Matters

When creating a website for a nonprofit organization, follow these steps:

  1. Decide how to build your site
  2. Revamp your site when necessary
  3. Understand your website’s structure
  4. Balance your site’s focus between your organization and the people it’s helping
  5. Stay on the ball with your SEO strategy
  6. Captivate your visitors with aesthetically pleasing web design

If you’d like to collaborate, please get in touch here, explore our digital services, see more of our recent nonprofit website designs, and find free growth tips and insights in our Growth Library.


Web Developer, UX Designer, Communicator, Brand Strategist and Search and Conversion Optimization Expert in Philadelphia

Ali Jaffar has been building dazzling websites and creating amazing online experiences for over a decade. His mastery of the latest innovations in web development results in world-class website experiences set apart by show-stopping style and seamless functionality. A sought-after consultant and 50-time award-winning storyteller, UX expert, and web developer — Ali lends his talents to build and bolster digital experiences for a wide array of clients — with a keen focus on web design for nonprofit organizations, B2B, and government agencies. When Ali’s not helping his clients grow or providing pro bono services via his Coding For Causes program, you can find him exploring beautiful open spaces with his dog, working on digital solutions like the Good Jobs Search Engine software, or doing yoga.

Connect with Ali on LinkedIn to continue the conversation, or follow him on Threads.