Main / Blog / 
Donation Page Design: The 14 Best Practices for a Donation Pages Structure

Donation Page Design: The 14 Best Practices for a Donation Pages Structure

Have you ever asked yourself why people donate? What encourages people to become donors and support this or that cause? Altruism, desire to change the world or maybe belief in a certain cause. No matter why your website visitors prefer to donate, the best practices in this post will help you in your donation page optimization efforts.

Donate Pages and HubSpot

Is it altruism, desire to change the world or maybe a personal relationship with a particular cause?

No matter why your website visitors consider a donation, it’s your role to guide them in the process, removing as much friction as possible and enhancing the donation page user experience.

HubSpot is built around this concept - providing a streamlined, user-friendly journey for every engagement. However, how you use HubSpot’s tools for donation page structure will ultimately determine how effective they are.

Below you will find a list of 14 donation page best practices that will keep your visitors focused and increase your donations.

1. Highlight Your Value Proposition on the Donors Pages

Potential donors visiting your site perhaps already know what you do and what your mission is. But your donation page template should reiterate the main message. It should reflect what change the donor is going to make or how someone’s situation is going to improve. Your value proposition message should be short and concise, not too long to distract the giver.

Donation Page Design Template


2. Be Specific on Your Donate Pages With How the Donation Will Be Used

Let the donor know exactly how you are going to spend their money and who will benefit from it. Here are some donation page examples:

Your gift of $50 will allow 1 family to build stronger and healthier relations with each other.

100% of your donation will be used to support our research program.

3. One Banner Image Is Enough

There’s no need to overwhelm your donation page with multiple images, slides or videos. Every image should serve a purpose - to inform and guide the user on their journey. To create a donation page, one big banner image that accurately reflects your company’s mission will serve to anchor the page and capture attention. Most HubSpot landing page templates come with space for a hero image over which you can place relevant text that clarifies your value proposition.

4. Remove Menu and Other Distracting Elements

Your donation page should serve a single purpose - encourage visitors to make a donation. If you’re wondering how to create a donation page that converts - the answer is simple: eliminate the menu header, footer, sidebar and other distracting elements that may draw attention.

The logo on your donation page shouldn’t direct to the website homepage, but be linked to the donation page. In HubSpot, you can create variants of existing landing pages that remove these elements while retaining the rest of the template’s design using the Design Manager.

Donation menu header vs regular page header: HubSpot Donate Page Designs

5. Remove Unnecessary Fields From the Form

Every additional field on your donations page template form adds friction and decreases the conversion rate. Make sure you only ask for information you really need. ‍

For example, in many cases, you don't need the donor’s phone number to complete a transaction. Sure it’s nice to have for future follow ups, but it can greatly reduce your campaign effectiveness. There’s a reason more than 37% of people will abandon a form unless the phone number field is optional. Sure enough, they don’t want to be called.

If you are not planning to send physical mail or rewards, don’t ask for their address either. Making sure not to repeat the questions as well is one of the tips for getting the most out of your HubSpot account and increasing your donations.

Remove Unnecessary Fields From the Donation Payment Form

6. Optimize for Mobile Use

Your page and donation form should be mobile-optimized. Make sure your image, copy, and form are clearly visible on mobile devices and donors won’t have difficulty in submitting their info.

According to the latest statistics on mobile usage, 59.4% of the website traffic came from mobile devices. Using HubSpot’s COS platform for template design can help with this. Forms are automatically responsive, and most modern templates are optimized for mobile use.

Optimize donation pages for Mobile Use

7. Insert Predefined Gift Amount Buttons

Donation page best practices show that you should give donors an option to select predefined gift amounts.

You should display those amounts as big buttons, not a drop-down list or radio button selectors. Big buttons are easy to spot and perform much better on mobile devices.

One of the buttons can be a default choice. You can test different variations and see which amount performs better.

Give an option to update the amount manually as well.

Insert Predefined Gift Amount Buttons on donors page

8. Suggest to Donate on a Recurring Basis

Most nonprofits strongly suggest that donation page examples should allow donors to choose a donation frequency. Donors can decide whether they want to make a one-time payment or donate on a monthly, quarterly, annual basis.

Give your donors the option to donate on a monthly basis automatically. Statistics show that the monthly giving programs are preferred by 45% of donors. This can dramatically increase the donation volume and reduce the time spent by your team following up with one-time donors.

Suggest to donate on a recurring basis on your donation pages

9. Insert Security Labels

Your donors want to know their credit card and personal information are secure. Display special labels or seals to reassure donors that all data and payments are stored securely. Make sure your website is SSL compliant and your URL begins with https.

If you host your donation landing page on HubSpot, an SSL certificate is automatically installed, which trust us, is a major benefit in comparison to other hosting providers.

Insert Security Labels for higher donor conversion

10. Remove Captcha on Donation Pages

We are all familiar with the "I'm not a robot" mechanism. Users select images according to specific instructions that are difficult for a machine to replicate.

This adds a lot of friction, though, especially on the final payment step. There is almost no practical reason to add it either because the credit card field already serves as pretty good protection from bots.

If you want to create a secure donation page but you are concerned about fraud payments, you should know that most payment gateways already have strong algorithms to reject such transactions.

Remove Captcha on donation pages

11. Suggest to Donors to Cover Processing Fees

When you process a credit card payment, some portion (usually 2-3%) goes to a payment gateway. But you can ask your donors to cover that fee. Many will gladly do so. It ensures 100% of their original gift amount goes to the organization. Add 3% in donations to your cause with one minor tweak.

Suggest to Donors to Cover Processing Fees

12. Don’t Redirect the Donor to Another Page

Some fundraising software products and payment systems redirect users to another page to confirm the payment. There are three important reasons not to do this:

  1. You can’t track the conversion path on external pages.
  2. You can’t change the look and feel of the checkout page.
  3. Your donors may be suspicious about redirection during the payment process and cancel the transaction.
Don’t Redirect the Donor to Another Page


13. Thank You Page

“Thank You” is such a simple word and so easy to say. But sometimes nonprofits fail to thank their donors properly. Don’t forget to express your gratitude and show how much their donation matters to you and the people you help.

Using HubSpot, you can automatically redirect to a page on the same domain with a thank you message after the payment has been processed. Additionally, you can make a donation page structure that automatically sends a followup email with a well-crafted thank you message on form submission and payment completion.

14. Segment and Test Your Efforts

Use HubSpot’s segmentation and A/B testing tools liberally to evaluate the performance of individual campaigns. Every email you send should link to a unique landing page that is designed for that audience. If you send an email to one-time donors in Florida referencing a recent event you held in the area, your landing page should reflect that.

At the same time, use the A/B testing functionality to evaluate different headlines and copy options on those landing pages. HubSpot is also in the process of adding Adaptive testing that allows you to dynamically evaluate up to five variants of the same landing page, showing the best performer automatically.

To Wrap It Up

Just as businesses know the value of a properly designed landing page, nonprofits should not take the donation page structure for granted. It’s the most significant representation of their organization and the crucial page for donor conversion. As a result, investing time and resources to build a page that delivers a smooth user experience for donors is the most important decision you can make for your organization. Don’t underestimate it!

Ready to start
accepting payments
with your HubSpot forms?
start
a Free Trial