Facebook Tag

019 – How To Design A Donation Form That Gets Results

Audio recording

When you’re redesigning your website or building a new one, your donation form is the first thing visitors see

If it doesn’t offer the best experience, they may leave before they even check out the rest of the website, and if you make things too difficult for your donors, they may get frustrated and never want to donate again.

Mentioned Resources

Listen and Subscribe
Podcast Logos Itunes
Podcast Logos Google Podcasts White
Podcast Logos Spotify
Amazon Logo
Post Circlea Img
Post Circleb Img
Post Circlec Img

Episode Transcription

If you’ve ever tried to donate to a charity or foundation in the past, you’ll know that the donation form is often one of the most frustrating parts of the process.

It can be hard to find your information, it might not let you use a credit card, or it might ask for too many details. If you make things too difficult for your donors, they may get frustrated and never want to donate again.

In this podcast episode, I’m going to talk about how you can get more donations from people who are already donating, by implementing some design strategies that will help you create an easy-to-use website that will increase conversions and keep donors coming back and attract new donors to grow your base with.


Why does it matter?

When you’re redesigning your website or building a new one, your donation form is the first thing visitors see.

If it doesn’t offer the best experience, they may leave before they even check out the rest of the website.

This happens all the time with charities that use copywriting that makes people feel bad, and it also happens with some people who create these forms themselves.

In order to solve this problem, you need to be aware of what makes people feel good and what makes people feel bad when they’re in a place and mindset of giving.

So what does that mean for your donation form? It means that it needs to be both clear and positive. Clear in terms of what it’s asking you to do, and positive because it makes donors feel good when they donate. This isn’t always easy to do, especially when you’re just starting out.


What to avoid

Donating and reading your page at the same time is like reading War and Peace and trying to watch a YouTube video at the same time. You’re not going to get much done. So don’t design your website with people who haven’t donated in mind, because you’re going to alienate your current donors if you do. We designed a recent client site to include the very basic details that we knew our donors would want to know – what the foundation is, who they are, and what their motivations are for giving.

Instead of focusing on the form that drives people to your website, focus on creating a piece of content that will attract them to your site, because the form isn’t going to convert people unless you’re offering them a compelling reason to donate.


Designing for donations

The most successful charity donation sites are based on the philosophy that getting the most information to your donors and making them feel like their information is safe and secure is the most important aspect of the donation process. They also understand that getting information is not enough. If you only tell people what to do, then they will never donate to your cause again.

The first thing you should do is be very upfront about what you do and who you help. You can do this in your name as a charity or through an affiliate nonprofit, but you have to be honest with donors. Also, be honest with people who donate to you. Don’t sell something that doesn’t exist. Don’t use terms that make your cause sound ridiculous. And don’t pretend to have a massive budget. These are all turn-offs and won’t help your cause.

Along the same idea, I recently presented my webinar to a group of 93 non-profit digital marketers. About a week later, I had someone reach out to me for some advice. We had a lovely conversation, and she asked me to complete an audit of their website. Why? Well, they had recently launched a new design, and they were getting less donations than in the past, with the only change being the look.

I completed the audit for her organization. I hadn’t looked at their site prior, so it was with completely fresh eyes, and I recorded my screen as I did this so she and their digital team could see what I was experiencing.

As I went through the audit, I noticed that there wasn’t a clear visual hierarchy. There was lots of clear space, also known as white space, and although it looked good on desktop and tablet, it wasn’t mobile optimized. So when I opened the site up on my phone, I saw their logo, hamburger navigation menu, and then a mostly white graphic. I had to scroll down to see the page title, a bit more content, and then a “Donate Now” button.

I clicked on it. I was taken to another page, again lots of white space at the top. I had to scroll to see the page title, then there was some copy some images, more copy, more images, and then a button.

The button was labeled “Read More”. What? All of that, but no way to give you my money?

What did the button do? It took you to another page, full of content. That page had a few “Donate Now” buttons within the content. Yay. When I clicked on it, it just went back to the page I was on. Still, no donation form. And yes, this was the donation page itself!

It was a big red flag. It was hard for donors to get to the donation form, and that was the key takeaway for them. It really opened their eyes to a fix that was within their ability to do in-house.

Consider this a…

Pro tip: Have a committee of people from your organization willing to test drive the website before launch. Giving them specific tasks, such as “make a donation” or “contact volunteer services” are great ways to test the user experience (UX).”


Make the donation process easier

Consider using a free donation platform that will allow you to create an intuitive donation form that attracts users and makes them want to donate. Many donation form generators use drag-and-drop tools that make the process super easy. You can easily tune your fundraising site to include a donation form, and visitors will be automatically prompted to donate.

By using a drag-and-drop method, you’re able to add fields to your donation form that allow donors to input their personal information, a brief description, and even their payment information. And if you have a budget, consider hiring an agency partner with a great designer to help you create an eye-catching donation form.

At Wow Digital, we partner with Keela, SimplyK, and variety of other donation and CRM platforms. I mention Keela and SimplyK because both have amazing free tiers. If you’re interested in testing them out, just drop me a line – [email protected].


Credit card and PayPal compatibility

Before you start designing, check the credit card and PayPal compatibility of your website.

Having a higher percentage of your visitors using credit cards and online payment services will help boost conversions.

Many merchants offer free sign-up for a 30-day trial for online payment services, or will have one of their donors complete the payment on their behalf. If you’re a nonprofit, you can offer additional features, such as extended payment terms. Avoid “tabs” and click-through form fields – instead, create clear tabbed fields where people can fill in their personal information and the charitable amount. Doing so will give them fewer choices to choose from, and it will eliminate the need for additional fields.


Reduce the number of fields

The fewer fields you have on a donation form, the higher your conversion rate will be. To make your form really appealing, focus on the most relevant fields, rather than on the unimportant ones. If you’re having trouble determining which fields you need, consider taking a look at what you need to bill them – it’s likely just their name, address, email address, and credit card.

With today’s sophisticated CRM platforms, it’s easy to be caught up in filling out all the fields to create a robust profile.

I say build the profile out over time. Sure, the donation form on the website is a quick way to get all kinds of details, but I would say that you should ask yourself these questions: Do I need more details? When will I communicate with this person again? Can I ask for 2 or 3 more bits of profile-rich data on that next exchange?

By letting your donors fill out just the minimal information you need, you’ll improve the conversion rate and make the form easier to read and navigate.

One last field I might suggest is a security captcha at the end of the form, to check that the donation form is really submitted by a human being.


Less is more with graphics

Studies have shown that using too many graphics or images can be off-putting and unappealing to potential donors.


Design for mobile devices

Websites that are designed with mobile-device users in mind work best. People browse on mobile devices all day long, so make your web design easy to navigate and to read on a small screen. You’ll also want to optimize your mobile site for large screens and high-resolution mobile screens so that they’re easy to read on a desktop or laptop.

Take a look at your donation form on a mobile device, and make sure that it renders properly and is easy to see. Depending on the number of fields you want to have, you may want to break the donation form into 2 or 3 screens so that there isn’t a need for mobile users to scroll – instead, they can simply click a “next” button.



The problem with many donation forms is that they’re overly complicated. By using these design strategies, you can make your donation forms more accessible and more valuable to your organization. The last thing you want to do is make it cumbersome or frustrating for existing and new donors.

When people donate, they’re usually already doing it for a good reason, so make sure to find ways to make it easier for them to get their donation to you.

I hope you’ve enjoyed this episode and I’m looking forward to having you listen to the next ones that we’ve got coming up. If you’ve enjoyed this episode please leave feedback on iTunes or wherever you listen to this podcast, I’d love to hear your feedback and it would also help others find the show.

Be sure to check out the show notes for the episode, head over to wowdigital.com, click on podcast, and search for this episode number and you’ll find all the links, details, and other information that has been discussed in this episode.

Are there any other topics that you would like to hear about? Just send an email to [email protected]. Thanks for listening to the Non-profit Digital Success Podcast!

We know
that your time is limited.

That’s where we come in.

Click the button below and book a free consult with us

We can get you on-track quickly to make your website have the impact your organization deserves.


Submit a Comment

Your email address will not be published. Required fields are marked *

Wow Digital Inc Incorporated Ink David Pisarek free accessibility audit non-profit non profit not-for-profit hospitals foundations Toronto's best digital agency focused on your business 1.888.238.9679 1-888-238-9679 Toronto Ontario Canada non-profit design agency for nonprofits non profit design non profit website best web design wow websites webdesign graphic design ux ui user experience user interface photography databases html php javascript jquery portfolio programming software operating systems hardware computer sales consulting adobe photoshop illustrator flash javascript mysql microsoft windows apple osx macintosh iphone android linux operational excellence operex the crossways complex art of noise web manager web master professor ceo networking streaming ftp update site full website solutions development develop Thornhill Richmond Hill Oshawa Whitby GTA Greater Toronto Area web design Pickering Ajax North York Downsview toronto ontario editing productions gta ago rss twitter instagram instagrm facebook company portfolio people adobe ajax apple art audio broadcasting business complex computer consulting corel corporations database databases deployment designing developing dhtml downsview draw hrs michael bookmarks categories mac pisarek the best digital company read required durham personal cad enterprises excellence feedback news new bit boards businesses cloud continue david's deals digg eat entries exchange niche form friend work functions dream complete freelance consulting agency crazy designmoo