I had hoped here to showcase some of the best small charity websites, but unfortunately it’s pretty hard to find many good examples. If you know of any great ones that are built on a small budget then let me know in the comments below and I’ll maybe feature them in future posts in this series.
Money isn’t the only factor in determining how good your charity website is though. A £1,000 website with some great stories, regular content and compelling calls to action is always going to be better than a £20,000 one that isn’t supporting the charity’s fundraising, communications and advocacy goals.
With that in mind, let’s have a look at some great charity websites and see what’s nice about them. More importantly, let’s see what we can learn, and in some cases steal borrow from them!
Many of these sites will have cost well over £30,000 to make (and some will have been a LOT more) – but I honestly believe that we can build something 80% as good for only 10% of the price. In the main, the technology and the functionality isn’t prohibitive to those on a shoestring budget. The sites listed here are great because they have great content. Yes, they probably have digital and communications departments to create that content – but great content is all about telling your charity’s story well – and anyone can learn to do that.
CAMFED
It’s customary in these web design galleries to link to the beautiful charity:water site – so instead I’ll showcase another great example of high quality graphic design and gorgeous attention to detail.
The Camfed site has a great use of white space and lovely typography. You can donate to a particular appeal and they have nice little thermometers to show how close they are to their goal. There’s also a nice ‘social proof’ area on the homepage where you can see recent donations made by people just like you.
What can you learn/copy/steal?
The beautiful graphic design attention to detail on all the site’s elements really sets this site apart from many others. That’s the kind of thing that takes time and money to build and finesse. Have a look at the lovely photography and the nice slider at the top. And it makes great use of something that’s free (and not even there!) – from a graphic design point of view, the use of ‘white space’ is fantastic.
Macmillan Cancer
Macmillan are a huge charity with a friendly, non-corporate look and feel. Their website clearly has to cater for a wide range of users – including people living with cancer, their families, campaigners, fundraisers, donors and medical professionals. Because of that, their site looks quite busy as there’s lots of things competing for attention on the home page. That’s a price you pay for being so popular!
What can you learn/copy/steal?
I really like their ‘How can we help you today?’ navigation aid on the homepage. We often tend to divide up the content in our websites into sections based on our internal departments or functions – so the membership, services and fundraising teams all get their own section of the site for example. But your site is built for your users, not your staff – and putting those users first is always the best approach. Instead of talking about ‘we’ (e.g. ‘what we do’, ‘where we work’) this section is written from the perspective of the user, and in plain English.
‘I’m worried about cancer’ is likely to resonate with people’s mindset much more than something like ‘see our facts about cancer here’.
If your website is trying to be all things to all people, and especially if you are providing services directly to some of them, then try looking at it through a lens of ‘what do they want to know’ rather than ‘what each of our departments want to tell them’.
Oxfam
The Oxfam site, like Macmillan’s one, has a lot happening on the homepage. I can imagine there are lots of departments that want their content featured on there! That’s what leads many charity sites to having a similar, modular design with a sliding image carousel at the top.
What I’ve picked out here though is their online donation page as it’s quite simple but elegantly designed. It fits in well with the rest of the site’s look and feel and has clever ‘conditional’ fields in the form itself. So far example it won’t show the Gift Aid section until it knows that your donation is eligible for it (i.e. it’s a personal donation, not a company one or someone paying in sponsorship money). This keeps the donation form looking quite short and simple – and therefore much more appealing to prospective donors.
What you can learn/copy/steal?
I spend a lot of time looking a charity donation pages and I think this is one of the better ones. The data it is capturing about the type of donation is really useful for your fundraising team and enabling you to segment your supporters better.
The nice clean layout (that’s also mobile responsive) and conditional fields display are actually not that hard to replicate. You might want to put some different fields in there, but using the Gravity Forms plugin for WordPress I was able to knock up a very similar form (with payment processor and email newsletter functionality) in about 30 minutes. Gravity Forms integrates well with Paypal, Stripe and Worldpay so it’s a simple but powerful donations platform if you’ve got a WordPress website. If you don’t, then you can achieve something similar with Drupal’s webform module, it just requires more wrangling.
Hosting your own donation form is easy, and preferable to sending your visitors elsewhere or embedding one that you have no control of the style and content. You don’t necessarily need an SSL certificate – you can collect the donors’ basic information on your site, then send them away to Paypal/Worldpay etc to enter their card details. That’s a very common choice for many small charities and businesses.
War Child
I’m terribly British when it comes to self-promotion, but since my livelihood depends on it these days, I’m including some of my own work here too.
The War Child UK site has a poster-style graphic design (by a very talented chap called Mike). It’s the site I wrote and built when I worked there.
Here I’m including an example of one of the ‘Feature Articles’ – each of which has a unique design and layout. They’re all relatively light on text and strong on images and white space. The idea behind them is that they’re bite-sized articles that you can browse through, and the titles are hopefully intriguing enough to entice the visitor to read another one when you’re finished.
What can you learn/copy/steal?
I’m putting this in here to show that your content doesn’t need to be constrained by your website’s structure or sections. If you have an interesting story to tell, then find a way of telling it. Even if it’s more of an anecdote and doesn’t fit in properly with the rest of your ‘what we do’, ‘get involved’ etc. pages. If it’s interesting then find a way of highlighting it. It’s often these anecdotal stories we use when speaking face to face with supporters and funders as they really help to bring our work to life.
The examples here require a level of Photoshop/HTML/CSS skills you might not have – but there’s a challenge for you!
It’s good to think outside the box sometimes. Literally – because if you let your CMS determine all of your pages’ style and layout then all your content and sidebars and titles end up looking the same. And furthermore, they end up looking the same as pretty much every other charity website. You want the consistency and usability that a good CMS setup will give you… but a pattern is much more interesting if you break out of it occasionally. Don’t let your CMS curtail your creativity!
Inside Disaster
Let’s face it. You’re never going to be able to copy or steal anything from this site unless your office lottery syndicate picks the lucky numbers. This immersive, multimedia ‘choose your own adventure’ experience is more akin to a Hollywood film than a charity website. If you’ve never seen it before then go and have a look now. I bet you won’t be back within five minutes!
What can you learn/copy/steal?
This site is great at demolishing the wall between ‘you’ and ‘us’ that exists on most of our charity websites. Imagine how many more donations and passionate supporters you’d get if you took each one of your web visitors to personally see for themselves what you do, and to meet some of the people their donation helps. Instead of a 2% donation conversion rate you’d probably have a 75% one. The challenge for us all is that we can’t take all our potential supporters to see our work, so we have to bring our work to them.
We try and make our web content as compelling and interesting as possible, but it’s still usually quite a ’passive’ process – it’s all about what we do with your money. I love this site because it’s such an ‘active’ experience. It puts the user directly in our shoes and asks them directly – what would you do? That’s a great journey to take people on.
Video can be a good tool for this (this anti-knife campaign on YouTube is a similar example). These usually involve a big budget – but you could try something similar in your next newsletter of Facebook post. Set the scene of a typical scenario your charity deals with – and ask people what they’d do next. This lends itself better to emergency humanitarian aid or animal charities than medical research ones for example, but whatever your charity does, try to show not tell, and you’ll reap the rewards.
Any suggestions?
If you know of any great charity/nonprofit (especially small ones) websites that you’d like to see featured in future parts of this blog series then leave a link in the comments below.
