How to Create a Nonprofit Website That Inspires People to Action

Website & Technology November 15, 2019

Tatiana Morand

By Tatiana Morand

This is a guest post from Sarah Henry, Content Marketing Growth Manager at Elevation

Your nonprofit website is the digital home of your organization, meaning it’s one of the most important ways that new supporters, donors and members can learn about your mission. 

So, how do you create a website that acts powerfully as a communication hub to draw your members together and help stakeholders affect positive change? 

It begins with creating an online experience that is cohesive and coherent for all visitors to your website. 

Here are seven ways to create a captivating experience on your nonprofit website, as well as an example of each to show best practices in action.

1. Step Into the Mind of Your Visitor 

When creating a nonprofit website, you’re really creating an online experience of your organization for the individuals using your site. 

How visitors interact with and experience your website is impacted by many elements, such as:

  • How easy it is to find the information they seek

  • How quickly they can complete their desired tasks

  • What additional content they discover

  • How the design and interactions make them feel

These factors dictate how your users identify with your messaging, build trust in your organization, and take action. Through website components such as content copy, visual elements, and call-to-actions (CTAs), your design will guide your users through your site to help them to accomplish all of their goals. 

To create a nonprofit website that best assists and engages your website’s users, you must have an in-depth knowledge of what motivates them. Beyond job roles or general demographics, user experience design (UX design) builds on elements such as: 

  1. An understanding of your members’ desires

  2. What their expectations are

  3. How and why they connected with your organization

  4. What their preferences are for things like communication or payment. 

abta homepage nonprofit website

The American Brain Tumor Association’s website does a great job of taking their primary user groups exactly where they want to go through the strategic placement of two bold CTAs. 

2. Tell Your Story Through Visuals

Your website will be many visitors’ first introduction to your organization. The content you include on your website sets the stage for how users understand your nonprofit. Photos and videos have been confirmed by eye-tracking tests to be more engaging for audiences, and visual cues also help communicate your mission, values, and culture. 

For example, using colors and styles that are appropriate to your audience and purpose, such as bright colors and illustrations for a children’s site or pastels and images for compassionate, end-of-life care. 

Your care and professionalism in choosing the design conveys your passion and trustworthiness, as well as communicates the tone of your organization. One thing to always keep in mind is to ensure a balance between high-quality image resolutions and small file sizes so that your site loads quickly.

 choice in aging how to create a nonprofit website

From first glance, Choice in Aging’s website illustrates compassion for real people through their subdued color choices and high quality images. 

Read More: The 22 Features Every Top Nonprofit Website Has

3. Make Every Second Count With This Hack

Preloaders, also called loading animations, are a small logo or other image that appears while a webpage is loading. They can reassure the user that even though the page isn’t visible yet, it is working, and it won’t be long until the content is at hand. 

This small visual cue makes a huge difference in encouraging people to stay on the page rather than abandoning it and has further ramifications such as helping your website to be more visible in internet searches. 

Preloaders also give a taste of your website to your viewers: beyond serving a branding purpose, they can remind users of your mission or encourage them to take a certain action.

 Action Ministries Preloader how to create a nonprofit website 

Action Ministries’ simple preloader gives a quick introduction to their branding and mission: to end hunger. 

4. Use This Design Strategy Wisely

From studying your user groups, you should have a pretty good understanding of what they want to know first. Leaving space around the most important information, such as a CTA for a donation ask, helps your users locate that information. 

Simple designs that employ a balance of content and white space act to draw your visitor’s eyes to what you want them to see. Measured use of white space helps to communicate to your users what you would like them to do so that you, in a sense, are navigating the website together.  

american indian services how to create a nonprofit website

American Indian Services makes a creative use of white space atop the blue skies of this powerful image to draw your eyes to their main CTA. 

5. Don’t Let Your Visitors Stray

As you’re creating your nonprofit website, keep all content and interactions, from the donation page to the member portal, hosted on the same web address. Great web design achieves this with integrations so that visitors never leave your site. By keeping a consistent URL for all activities and information, visitors are more confident that their personal and financial information is being shared with your organization only for the intended purpose. 

It also makes it easier for visitors to navigate back to other portions of your site, should they want to check additional details or investigate other options. Maintaining the same URL also helps to increase traffic to your website, because it will both increase your site’s ranking in search results and make it easier for visitors to remember and search for your website. 

dreamscape how to create a nonprofit website

Dreamscape’s donation experience is a perfect example of a seamless user experience. From deciding the amount to putting in your credit card information, you never leave the site. 

Read More: 11 Best Website Builders for Nonprofits, Reviewed & Compared

6. Don’t Bury Your Lead

Do you have a moving video or emotional story to share? 

Focus on why members join your organization, both what their drives and desires are as well as what made them decide to choose you over another organization. That’s because online memberships and donations never start on the actual membership or subscription pages — they begin on your homepage and other related landing pages. 

Whether your main desired outcome is for people to join your organization or donate, you’ll always want to keep that CTA button visible in the same part of your site. However, you can also be strategic about other places you include the option to join or donate. Maybe your site visitor is browsing your “impact” or “activities” page and is inspired by all that you do and then makes the decision to take action — by making this as easy as possible for them, they’ll be more likely to do it.  

Action Ministries how to create a nonprofit website

Action Ministries’ homepage uses a video banner with footage of their organization in action. Right off the bat you see what their organization does, the community they serve, and how they’re making a difference. 

7. Learn the Rules Before Breaking Them

Like with social interactions or the written word, users have expectations about how websites operate and how content is organized. Vary from these expectations too much, and your users will get lost within your pages or accidentally complete unintended tasks. 

How can you make it as easy as possible for users to stay on track? 

Make sure to highlight the most important content on the left of the screen, and make sure the user can always navigate back to other parts of the site and never encounters a dead end. 

However, following conventions like the F layout doesn’t mean you sacrifice creativity. Opportunities for creativity abound in the choice of elements like color, branding, voice, tone, and overall look. 

how to create a nonprofit website Burroughs Center

The Burroughs Center makes creative use of the F layout. Not only do they ensure the most important information is on the left side of the page, they also use their imagery to guide your focus as well. Naturally, we follow the gaze of the people in the image down to the information on their community garden, making great use of color and images to motivate engagement. 


sarah henrySarah Henry is the Content Marketing Growth Manager at Elevation, a full-service nonprofit web design agency. Sarah began in the nonprofit world in 2009 and has worked with organizations supporting education and digital and performing arts ever since. Sarah works to empower nonprofits to maintain relevance in our increasingly tech-focused world by combining her nonprofit experience with her passion for psychology and digital media.

The Membership Growth Report:

Benchmarks & Insights for Growing Revenue and Constituents

Get the report now!

Sorry, this blog post is closed for further comments.


About results ( seconds) Sort by: 
Sorry, an error occured when performing search.