An Example of Great Nonprofit Website Design

Great Nonprofit Website Design Example

By now you’ve likely heard from a bunch of people that having an up-to-date website is necessary to move your nonprofit forward and inspire your future supporters. You probably realize that having a user friendly, visually appealing design allows your website to work at its best.

You know that it needs to look good. But you don’t know what that looks like.

This post features an example of a nonprofit with a stunning website and points out what we can learn from it.

Dadaab Stories

www.dadaabstories.org

The Dadaab Stories website is a project of FilmAid, a nonprofit organization that uses film to document and build awareness of refugee camps and communities affected by disaster. The Dadaab Stories website shares stories from the half a million refugees of the Kenyan Dadaab camp. We know this because it is literally the biggest thing we see on the homepage and therefore the first.

Dadaab Stories Homepage

If You Want Me to See It, Make It Big

On the homepage, decide what you want your viewer to know right away and give that element its due attention. Don’t be shy when it comes to giving your key message prominence. Everything else will have its time in the spotlight later on.

Use Multimedia, Also Make It Big

Type laid out on top of photography has been established as a favorite practice of web designers. This is because, if well done, it’s practically foolproof. Nothing grabs a user’s eye like a compelling image (or in this case a moving one). Try using photography as a background to give your content a little visual boost.

I will warn you that using large multimedia can hurt the load time of your page. Studies have shown that extra seconds (and even milliseconds) of load time can frustrate your users and cause them to abandon your site. If you want to incorporate large multimedia, prepare to spend a good amount of time getting the file sizes down and optimizing your load time.

If you need a bit of help to determine how fast your website is loading, we have a blog post with some tools that can help.

Dadaab Stories Multimedia

Give Your Navigation Breathing Room

The navigation on the Dadaab Stories website has tons of space and is very user friendly. The light colors allow you to ignore the header when engaged with the page content but easily return to it when you need it. Also note how nicely that “donate” button stands out when it has lots of room.

Dadaab Stories Navigation

What You Can Do on Your Nonprofit’s Website

The Dadaab Stories website does a great job at getting the user to read and engage with its content. It does this in a few ways that you can easily use on your own site:

  • make your home page message big
  • use (awesome) multimedia
  • consider laying type over your large images for a visual boost
  • design the navigation to be spacious and user friendly

What Now?

This site is chock-full of design inspiration as well as some incredible stories from Kenyan refugees. I recommend taking some time to explore the site yourself and see what you notice. If you like something else about the Dadaab Stories design, I’d love to hear your observations in the comment section below.

Related Reads

4 Nonprofits Using Their Website Header to Inspire

Using Video for Your Nonprofit: Benefits and Drawbacks

One Question That Leads to Happier Website Visitors

3 Tips for a Better Donate Button on Your Website

6 Nonprofit-Specific Web Content Tips