Building Your Donation Page: 7 Best Practices

October 22, 2020

donation page

With nonprofit operations relying heavily on the digital fundraising sphere, it’s important to have an online presence, and this all starts with an eye-catching donation page.

Your online donation form is the core of your digital fundraising strategy. You’ll link to and drive traffic back to this page across all of your campaigns and marketing, which means having one that’s well-designed is crucial to your success. Making a donation page that’s conversion optimized is often easier said than done.

Why is it important to have a well-designed donation page?

An eye-catching, navigable donation page is a must for any nonprofit. It’s the core of your digital fundraising strategy, and it’s where prospects go to show their support for your cause when online. Further, it empowers donors to connect with your organization the moment they feel inspired.

Overall, this page is the underlying foundation of your online giving strategy and plays a major role in developing a smooth donation process. If it’s disorganized, overwhelming, or otherwise difficult to complete, it defeats its own purpose: increasing donations. In other words, you’ll miss out on much-needed financial support.

Luckily, there are several steps you can take without help from a professional developer – so long as you’re backed by the right donation software. We’ll walk through seven easy tips that will set your donation form up for maximum success, including:

  • Make sure it’s mobile-friendly
  • Adhere to accessibility guidelines
  • Brand your form to match your website
  • Feature suggested giving amounts
  • Conduct A/B testing
  • Offer multiple secure giving options
  • Encourage recurring gifts

Remember, your donation page can be the determining factor as to whether or not someone donates, so putting in the effort upfront will pay off in the long run. Ready to make your nonprofit donation page stand out and improve your online giving strategy? Let’s dive in.

Make sure it's mobile-friendly 

Half of all nonprofit website traffic comes from mobile users. Further, studies have found that incorporating mobile-responsive design can increase donations by an astounding 126% on average. In other words, offering a mobile-responsive donation form is a no-brainer.

Mobile responsiveness means is that your donation page will adjust to fit the user’s screen size no matter if they’re visiting on a smartphone, tablet, laptop, or desktop. Optimizing your content for mobile users means that you can:

  • Avoid poor formatting. From your images to the form’s fields, every element will reformat and look clean with a responsive design.
  • Make it easy to interact with content. Users won’t have to pinch, zoom, or rotate their devices to view the content and submit their donations.

Your best bet is to go with a donation form that offers automatic mobile responsiveness. This way, you won’t have to develop multiple versions of your webpage for mobile users, tablet users, and desktop users. Take a look at this donation page example that offers a fully responsive experience:


Beyond featuring a responsive design, your donation page can incorporate other mobile-friendly best practices to fully optimize the mobile experience. For instance, you should aim to quicken the page load time. After all, as page load time goes from one to ten seconds, the probability of a mobile user bouncing increases by 123%. Account for this by reducing the number of fields, compressing images, and removing excessive coding.

Further, you’ll want to keep content to a minimum and simplify forms. Otherwise, your mobile users will be endlessly scrolling and will be more likely to wind up leaving your donation page. Overall, design your donation page with a mobile-first perspective, and it’ll pay off in the long run.

Adhere to accessibility guidelines

When making a donation page, you’ll want as many people as possible to be able to see and interact with it. This means ensuring your design is accessible by those who have disabilities or impairments. Otherwise, you risk excluding them and missing out on their support.

Developed in 2018, the Web Content Accessibility Guidelines (WCAG) 2.1 outline several requirements that websites should adhere to. This way, people with diverse abilities are able to participate equally on the web. While there are numerous requirements, most are easy to implement without help from a professional web developer.

With your nonprofit donation page, you’ll want to accomplish the following:

  • Incorporate high-contrast colors. WCAG 2.1 guidelines require a minimum contrast ratio of 4.5:1 for text and images of text. For reference, black text on a white background has the highest contrast ratio, which is 21:1.
  • Clearly label fields outside of the field itself. This is particularly useful for those who are using screen reader technology. Screen readers only read visible text on the form, so only using placeholder text within the field won’t give any indication to what information is required.
  • Note which fields are required. Typically, this is done by adding a red asterisk or another signifier. Simply changing the color of the label on required fields is not sufficient, because those with low vision may not be able to see this.

Of course these are only a few steps you can take toward better accessibility when making your donation page. You’ll find that many nonprofit compliance tips are easy to implement and can provide immense value to your prospects.

Brand your form to match your website

Consistent branding across all channels increases revenue by 23%. In other words, you’ll need to create a seamless transition from any other page on your site to your donation page.

To start, ensure your tools allow you to embed your donation form directly into your website. Your prospects should never have to leave your site to contribute to your cause, because redirecting them to a third-party site may appear untrustworthy. Then, they won’t feel comfortable inputting their payment information, and you may lose their support altogether.

From here, you’ll need to customize your donation page to match the rest of your site. According to Morweb’s donation page guide, “visual consistency maintains the element of trust for your donors as they navigate on your website. Creating a seamless transition using effective brand-oriented visuals is key to keeping this trust.”

To maintain visual consistency on your donation page, try out these suggestions:

  • Use your nonprofit’s color scheme. As part of your branding strategy, you likely utilize two or three colors consistently across your marketing materials. This should go for your donation page as well.
  • Prominently feature your logo. Your logo is the most recognizable element of your brand. Typically, organizations feature their logo in the upper left-hand corner of the website. Although, anywhere will work fine as long as it’s large and located in a prominent place.
  • Add an eye-catching banner image. Choose a single compelling picture that represents your cause and the community it serves. Any more than that will distract your visitors from the task at hand. This may also help to remind individuals why they’re giving to your cause. For instance, an animal shelter may feature a picture of one of their furry residents.

Take a look at this donation page, which exemplifies the power of strong branding through imagery, a legible color scheme, and text describing the cause:

climate landing page

When donors click through to your donation page, they shouldn’t feel like they’ve been handed off to a stranger to collect their money. A branded page will reassure them and make them feel more at ease when giving, helping you to drive more donations to completion.

Feature suggested giving amounts

With the transition to digital giving, nonprofits have recognized the power of suggested donations. When implemented strategically, suggested giving amounts can directly impact your total donation revenue. This works because of two primary reasons:

  • Donors use suggested giving amounts as a reference as to how much others are donating. Then, they use this as a guide to determine how much they should give.
  • Giving is simply easier when all donors have to do is click a button.

Even though you can use suggested giving amounts to influence donors to give more, you can only nudge them so far. In other words, if your current average online donation amount is $20, it wouldn’t be reasonable to ask them for a $500 donation.

Instead, set options that are marginally higher than what your average donor contributes. For instance, if last year’s average donation was $20, you might consider suggesting donations of $10, $25, $50, and $100. That way, prospects who may intend to contribute $20 may opt for the slight increase to $25. Similarly, your donors on the lower end may also bump up their contributions to reach that $10 threshold.

Over time, you may consider adjusting these amounts as your average donation increases. This is where donation software that automatically gathers insightful KPIs comes in handy. This way, you won’t have to worry about gathering these statistics manually.

Take a look at this donation page example, where there are set donation amounts of $25, $500, and $2,500 to encourage their prospects to give more:

donation info

Notice how they feature the buttons prominently. As an added bonus, their donation page is also mobile-responsive, meaning mobile donors can also make use of the giving buttons! Overall, implementing this approach simplifies the process of asking for higher donations from your supporters. This minor change can make a major difference in your fundraising.

Conduct A/B testing 

A/B testing (also called split testing or bucket testing) is a user experience methodology in which a web developer compares two versions of a web page to figure out which variation performs better. The end goal is to determine what elements drive conversions, which are donations in this case.

To conduct an A/B test, you’ll want to first set a control donation page. Then, decide which element you want to test. Then, set up a second donation page with that variable changed, and drive traffic to both forms. For instance, you may split your email list in half and direct them toward each page. Finally, track completion rates across both pages, calculated by dividing the number of donations by the number of visitors.

If you notice there’s a considerable difference between the two, the winner should then become your control donation page. Then, you can repeat the process and refine your donation page even further.

Take a look at how slight tweaks in the following donation page example led to a considerable difference in conversions:

mobile landing

What elements to test

Especially if you’ve never conducted an A/B test, it can be tricky determining what to test. For a better idea, there are several elements to consider on your nonprofit donation page, some of which include:

  • The banner image: What type of photo inspires people to complete the form?
  • Suggested giving amounts: Do higher suggested gifts lead to higher donations?
  • Copy: Does the tone or the length of copy have an impact on donations?
  • Layout: Does a one-column form drive more completions than a two-column form?
  • Testimonials: Does a testimonial from another supporter impact donations in any way?

What elements not to test

While there are several elements you do want to test, there are also several elements you don’t want to spend time and effort on. For instance, avoid testing the following:

  • Several variables at a time. When you see different completion rates, you won’t know which element prompted this.
  • Images that are too similar: This likely won’t impact results.
  • Copy that’s similar in tone and length: Your donors likely won’t notice the slight difference.

When to conduct an A/B test

After a period of time, you can determine which elements impact completion rates. Note that the best time to conduct an A/B test is when you know you’ll have an increase in traffic. For instance, set it up during the following times:

  • When you’re conducting an email campaign
  • Toward year-end giving
  • During a fundraising event
  • When your organization is receiving media attention

Higher traffic means you’re more likely to witness statistically significant results. Otherwise, you’ll have to wait for longer to see results.

Offer multiple secure giving options 

As a nonprofit organization, you’re likely gathering a massive amount of data from your donors. Because of this, it’s important that you take sufficient security precautions, especially when it comes to collecting payment data.

Cyberattacks are the fastest-growing crime in the U.S. and are growing by more than 350 percent every year. And if it’s not apparent that your donation page is secure, donors won’t trust the page and will likely abandon the process.

Secure giving starts with a PCI-compliant payment processor, which simply means that it follows industry protocol for protecting data with PCI regulation. Further, this platform should also authenticate and encrypt payment information using secure socket layer (SSL) technology, which establishes a secure connection between the server and the user’s web browser. This way, both your staff and your donors can rest assured that all data is protected.

With the help of your secure donation processor, you should be able to accept a number of different payment options, so donors can select the option that best suits their needs. For instance, ensure you can accept the following payment methods:

  • Debit/credit card
  • ACH direct deposit
  • PayPal and other popular payment methods

From here, you’ll want to ensure these options are abundantly clear by displaying the relevant icons on your donation page. By offering these choices and reassuring donors that their payment information is protected, you’ll give them peace of mind when donating.

Encourage recurring gifts 

One of the best (and easiest) ways to maximize donation revenue is by encouraging recurring donations on your donation page. This is because donors can simply fill out your donation form, opt in, and continue giving without ever filling out the page again.

According to Nonprofits Source, donors that set up recurring donations give an astonishing 42% more each year, compared to one-time donations. In other words, recurring gifts are not something you want to overlook, and during the giving process is the optimal time to promote them.

By encouraging recurring gifts on your donation page, you’ll easily increase visibility and compel donors to sign up for the program. Make the most of this opportunity by incorporating the following best practices:

  • Allow donors to manage their own giving. Provide them with a platform where they can adjust their giving amount and frequency without your staff overseeing the process.
  • Follow up whenever a donor’s payment is declined. Quickly reach out to rectify missed payments that were caused by declined or expired cards.
  • Make the option clear. Adding recurring options directly onto your donation form will maximize visibility. Check out the following donation page example that accomplishes exactly that:
landing page


As you now know, building a donation page takes a good bit of time in order to fully optimize it. However, doing so is imperative to your success within the online fundraising space.

From mobile friendliness to recurring gifts, there are countless ways you can make the online giving process as smooth as possible. With the help of powerful donation software, you’ll be well on your way to connecting with donors and boosting conversions. 

Never miss a post.

Subscribe to keep your fingers on the tech pulse.

By submitting this form, you are agreeing to receive marketing communications from G2.