The foundation of a charity’s online presence is its website.
You know that. It’s why you googled something like “how do I create a website for my nonprofit organization?” (we know you did – you’re here, aren’t you?).
Your website is the landing page for all your digital activities. It communicates:
So you don’t only need to know the basic technical stuff (domain name, hosting, platform, etc.), but you need to know what really works for nonprofit website design. The tips and tricks that other organizations have used successfully.
That’s what this blog is about.
Proven advice for creating engaging, concise nonprofit websites that clearly relay your mission and encourage action.
And we know what we’re talking about.
Oh, and if blog skimming’s your thing:
How Do I Create a Website for My Nonprofit Organization?
The Must-have Elements of a Good Nonprofit Website
Ease of navigation
Easy to read
Beautiful images
Clear mission statement
Eye-catching colors
Strong calls to action
Key pages
How To Create Websites for Nonprofits in 8 Steps
1. Select your objectives and goals
2. Storyboard your website (and StoryBrand your charity)
3. The technical things – choose a platform, register a domain name, pick a hosting plan
4. Design your website, prioritizing site speed and UX
5. Write and upload great content
6. Make sure your site is SEO-friendly and mobile-friendly
7. Plan on how you intend to get traffic
8. Analyze, optimize, and polish
Tips and Tricks on How To Build Great Nonprofit Websites
Commit to long term website maintenance
Engage visitors emotionally with meaningful images
Create a site that radiates “trustworthy” and “reputable”
A CTA for every page
Make your site as donor-friendly as possible
Build a mailing list of your supporters
Okay, let’s first go over the ABCs of nonprofit website design. The must-haves. The foundation.
There’s no point going over fine details and giving expert tips if you’re unaware of the basics of an awesome nonprofit website.
Sprinkles and chocolate shavings are great – but you need a cake to put them on, don’t you?
No one wants a jungle of a website that needs a machete to navigate.
A website should be clean, simple, and straight to the point.
Let’s use Generation Thrive’s website as an example.
It has a clear banner menu to navigate the site, so your audience can learn about you and your mission and easily make a donation to your cause.
And donations-made-simple are important enough to get their own point on this list.
The same idea as the last point. You want your message to be clearly communicated.
No confusion. Nothing complicated.
The Integrated Healthcare Association states their mission, their attitude, their drive, and slides two CTAs in, using simple phrases and short paragraphs.
Less is more.
There’s no need to reinvent the wheel when it comes to imagery. Simple images are powerful and can speak volumes for you.
Photos and graphics are powerful for communicating messages at a glance. In fact, the brain processes visuals 60,000X faster than text.
And we’re talking about beautiful, powerful images. Not stock.
We all know this guy, don’t we?
Your message suddenly seems less impactful when you use an image that’s on thousands of listicles across the web.
You want a straightforward explanation of what you do, how it impacts the community, and why the reader should care.
Don’t beat around the bush or use flowery language.
That way, your short, clear statement will work in tandem with the image to get your point across immediately.
Yes, we really put the “design” in “nonprofit website design”.
But seriously, striking colors make a website more visually appealing and impactful. They will engage visitors and prolong their stay on the site.
And make sure they match your logo to tie everything together nicely.
Here’s the separate point for CTAs we mentioned earlier.
Bold, noticeable calls to action are essential for getting your audience to learn more, join your mission, or make a donation.
Maybe all three.
Alluma here has three clear CTAs on their landing page:
There’s no way a visitor can miss these.
Lastly, we’ll go over a few basic pages most websites for nonprofits have.
Key pages include:
Good stuff, right? Although now we hear you saying:
Okay, yes – but you yourself said these are the basics. Give me the juicy stuff!
Your wish is our command.
And you’re done!
We had you for a second, didn’t we?
Let’s go in-depth into these 8 steps to create a solid foundation for nonprofit websites.
If you already have a website set up and are just looking for tasty nonprofit website redesign tips, go ahead and skip to tips and tricks.
Setting objectives should always be the first step in a process, don’t you think?
Laying out what you hope to accomplish, whether it be getting new members to join, bringing in more donations, or just keeping existing members updated with timely news will help you set up the entire site.
It’ll make choosing everything easier:
And it will make your message clear from page one. You don’t want people to have to spend more than a second on your website before they figure out what it is you even do. Recent studies show that it takes a mere 50 milliseconds (0.05 seconds!) to decide whether they like a site or not. Let that sink in.
You’ve heard of storyboarding. Some drawings that detail, in steps, what you plan to do, sometimes with directions or tips.
It allows you to do a rough draft of something before you pour your heart and soul into it.
And everything turns out a little cleaner.
A similar, but still very different, practice is StoryBranding (from Donald Miller’s book Building a StoryBrand).
StoryBranding is laying out your website’s message using the 7 main elements of storytelling, told in a single phrase:
“The character has a problem and meets a guide. Who gives them a plan and calls them to action that helps them avoid failure and ends in success.”
Let’s break it down:
Following this framework communicates your message in a way that people can hear loud and clear.
StoryBrand nonprofit websites to give your audience a narrative they can step into and you won’t just be speaking a language they can understand. You’ll be drawing them into your story.
You’ll be setting yourself up for success.
Ah, all the background cogs that are necessary to run the machine – they just aren’t as pretty and exciting.
Platforms come in several flavors, such as using a website builder like Wix and WordPress or developing your website from scratch.
Unless you have a talented web developer on board, it’s easiest to choose a builder like WordPress.
Your domain name is what will be used as your URL. So if your domain name is statecreative.com, your URL will be https://www.statecreative.com.
And if you want your website to be live (that might be a good idea), you’ll need to purchase a hosting plan. That’s essentially what’s powering your site and making it available to others. Without a hosting plan, you only have a domain name with no website – and that’s not what you want.
Which hosting company should you choose?
We suggest SiteGround because they’re our go-to platform and their plans include tons of free goodies like free WordPress installation and migration, SSL, daily backups, CDN, email, and unmetered traffic. Or in other less technical words, they’re not only reliable but also great bang for the buck.
The design of your website shouldn’t just be based on what looks cool.
A solid website is easy to navigate, provides a great experience, and loads each page fast. After all, 53% of mobile users abandon a website that doesn’t load within three seconds.
Here are a few examples of great web design with user experience (UX) and speed in mind:
| Web design element | Ideas |
| Site speed |
|
| UX |
|
For more on the topic, read our blog on user engagement metricsuser engagement metrics.
Great web content accomplishes a lot.
It builds trust, educates your audience, boosts your SEO, and increases your website’s overall impact.
Quality website content can be blog posts, photos, videos, success stories, and even third-party awards and merits.
Anything that’s relevant to your mission and your audience can be great content.
Two things that improve the overall quality of your website, though they might be overlooked by some: search engine optimization and mobile-friendly nonprofit website design.
SEO dictates how people will find your site through search engines, and optimizing your website SEO through various techniques will make your page rank higher.
This can include web content, keywords, backlinks, optimizing for speed, and making your site mobile-friendly.
Yes, being mobile-friendly isn’t just convenient for smartphone users – search engines also rank you higher when your website is mobile responsive.
You know it’s a little naive to just wait for people to show up. You need a plan on how to get supporters.
We just discussed SEO and content, which are both great ways to ensure more eyes on your website. Another great way is social media, where you can share success stories, ideas, schedules for events, or even just holiday greetings.
Actively engaging your target audience in an outbound way shouldn’t be overlooked, either. Newsletters and email marketing, outreach, and asking for referrals can really spread the word.
Take a step back.
Phew! That was a lot of work!
So take a quick break, grab a coffee, and breathe.
…
Back already? Great! Now that it’s been a minute, give your website a good once-over.
This last step is all about that last shiny varnish.
Tweak the wording in your “about us” section or move images around. Ask a friend to go there and see if they think it’s easy to navigate.
One last glance can really make a difference sometimes.
After learning the must-haves and the basics, you’re ready to dive into the tips, tricks, and life hacks (not sorry) of creating outstanding nonprofit websites.
And we aren’t just taking a shot in the dark.
Here at State Creative, we’re kind of the expert on nonprofit web design. We’ve built over 25 nonprofit websites and frankly, we’ve learned a lot along the way.
Now we’re passing those valuable tips on to you.
Regular website maintenance may not immediately seem like a priority. Until you’re really looking and then–
It hits you hard, right?
This isn’t just visually upsetting, either. Lethargic website maintenance could be an overall detriment because:
Monitor your website on a regular basis. Put it in the schedule so you do it about once a month.
Observe analytics to check how many visitors you get daily and your average bounce rate. Keep posting fresh, keyword-rich content to keep your SEO healthy. Check for broken links and old images.
You don’t set a pot of water on the stove and leave the house. So keep an eye on that boiling water.
One of the best ways to engage people is with imagery – doubly so if you’re a charity.
People like to see meaningful, striking photos.
Oakland Thrives wants to inform the reader about their Early Literacy mission – and they have a focus on Black and Hispanic children. So they display striking images such as:
And how about one more?
Real people. In their community. Doing the activity described (reading). And both images feature a person of color, which Oakland Thrives is emphasizing in their mission.
You can really strike someone’s heart and soul with a good image. They’re nearly more powerful than words.
Every website, company, and brand wants to be trustworthy – but websites for nonprofits need trust as a backbone more than any other.
You might buy a t-shirt from someone less-than-reputable, but you need to know that you’re supporting a solid not-for-profit.
This is where third-party proof comes in, such as:
Take Alluma for example. They have a rich case studies page detailing work they’ve done, the companies involved, and the results.
Case studies can be simple, but going all out is the way to go. Providing statistics of the results and related images are awesome ways to boost a case study.
You want a clear message:
We do good work. We do reliable work.
Every page? Isn’t that excessive?
Actually, you’re doing your visitors a favor.
Displaying a bold call to action on each and every page makes it simple and clear for your audience to support you.
Oakland Thrives here has two noticeable ones at the very top of the landing page.
“Partner with Us”
“Contact Us”
Go a little further down to the right and you’ll see “Get to know Oakland”. As you scroll through the homepage, you will see a “Learn more” CTA and a CTA for subscribing to their newsletter.
Let’s navigate to a new page…
This is their calendar page. And it only takes a moment before you hit an easy “Register” CTA.
Frequent, bold CTAs aren’t excessive, they aren’t pushy – they’re helpful.
Your visitors will appreciate it.
You want donations. Your supporters want to donate – that’s why they’re here (most likely).
So make it easy.
Great nonprofit websites do this with:
Generation Thrive gives you two options for donating, credit or debit and stock. They even let you know which is more tax-efficient.
It’s simply human nature that the easier it is to give, the more people will want to.
Email lists are an outstanding way to attract, maintain, and build relationships with supporters.
They’re cost-effective, reliable, and can be rich with educational information and schedules. Keep people in the know, at the same time leading them to your cause (and your website!).
A good mix of calls to action and pop-ups telling people about the newsletter are great. And offering people valuable free resources in exchange for an email address, also called a lead magnet, is incredibly effective.
The newsletter sign-up is on the left – but notice that you can also see the case studies and contact us CTA on the right.
Now that’s a solid design.
The steps needed to create websites for nonprofits are simple. Like making it easy to donate, having eye-catching CTAs, using beautiful imagery, and prioritizing site speed.
But giving your website the time it deserves to make it high-quality and chef’s kiss isn’t exactly a walk in the park.
It requires a lot of time, trial and error, and experience.
And guess what? State Creative has experience in spades.
After creating nonprofit websites for over 25 satisfied organizations, we’d love to put the knowledge to use and do the heavy lifting so that you can use your time helping the communities and causes you support.
So if you need some expert help and advice, contact us for a free 30-minute consultation about your website needs.
But if you aren’t ready for that, or you’re raring to go at it alone – we want to help anyway. Check out our other blog posts on the top Mistakes in Web Design and WordPress Website Maintenance to give your nonprofit website a fresh coat of paint.
