On-line fund-raising has become a growing source of income for many non-profits over the past 10 years.
But while organizations typically spend lots of time developing clever, creative, and inspirational on-line content, they often overlook more mundane aspects of on-line appeals that can make a big difference in converting advocates, subscribers, and other supporters into donors.
Some tend to get inspiration from this way of seeing the web. Hints of techniques or approaches to attempt for next projects emerge from all corners of the web.
Now there are many considerations that need to be made when designing, especially a beautifully designed donation page whose calls to actions are often vital to the mission for the client behind it.
Which is why in this post,we have gathered together a showcase of beautifully designed donation pages for our readers,with some resources and tutorials at the end of the post to help prepare them for those potential clients to come calling. Take a peek down through to see some examples of both unique and more extravagant designs that have tackled this task with style. Happy Viewing!
Donation Page Design Showcase
The Product (Red) site features products that support the organization prominently in a slideshow on their home page. They also include links on other ways to get involved, their blog, and learning resources in the sidebar
The page design has a large, eye catching call to action area which sets off the donation area nicely and effectively pulls the reader to it.
The slideshow on the home page of The Nature Conservancy’s site is one of the best I’ve seen, offering up information about various programs and initiatives they support.
The charity: water site is a great example of how simple but bold design can make a huge impact. The donate button is red, while the rest of the site employs black and dark gray navigation.
This is a nice site with comfortable, welcoming color scheme. The donation page calls vary in color.
6. Red Nose Day
This site uses a simple two tone color scheme. The red colors pervading the donation page denoting the passion for the mission, and driving people to take action.
Has a wonderful design, with three courses of action that their readers may follow. Each with a large, eye catching call to action button.
Manna Foodbank uses a natural, earth-tone color scheme which goes well with their mission. The call to action button stands apart nicely even with only the slight changes in color, next to the information about their cause.
The Oxfam America website uses color to make their donation button stand out on the home page. While the majority of the site is designed in shades of green and tan but the donation link is orange.
The blue becomes overwhelming with the amount of information it contains.
The Kiva website has a very simple and straightforward design. Right at the top of the page they explain exactly what Kiva does, and they make it very easy for visitors to lend money
This has a sleek design for its donation page with designated avenues for assistance that the users have at their disposal.
has a subtle donation page design with a creative header attached to their site where fans and users can donate to keep their mission alive.
has a great donation page design, using tabbed windows to separate the various paths that users can take to pitch in.
The donation page is stylish and focuses the users attention directly towards the calls.
ASPCA has another subtle donation page design with the purple calls standing out from the overall orange design colors. Soft coloring imparts a sense of comfort and eases the readers into the cause and taking action.
Has a very sleek design with large buttons with various ways to contribute to the mission. With a slight grungy effect used to highlight areas of the page, the design stands out.
Is a unique donation page, with a category breakdown so users can find the type of charitable organization they are looking to support.
19. Humane Society
Uses large images and bold buttons to draw the users attention and persuade them to take action.
The donation page uses a form for the main appeal to the readers, with secondary (more subtle) calls in the upper right corner. Overall, the large header and large body text compliment each other leading the reader into the ‘action center’.
Has a donation page that is as stirring and emotive as their mission. With large images of the children the world tends to overlook connects the design with the cause in a simple yet effective way.
The NRDC website also makes use of color to distinguish between different sections of their site. The “Donate” and “Take Action” links are denoted in orange.
Awesome yellow header.
The Michael J. Fox Foundation website offers a great home page that includes tons of great information without looking cluttered. Links for living with Parkinson’s, about the foundation, research programs, and how to help are included prominently in the middle of the page. A donation link is also included in the top navigation. And news both about Parkinson’s and the Foundation are also featured prominently on the home page.
Has a somewhat whimsical design, with pink calls to action buttons that really stand out from the rest of the site, yet match with the logo of the organization.
Simplistic donation page.
This site makes great use of space in their header for highlighting important links, including ones to pages for women recently diagnosed with breast cancer, how to make a difference, and a page to share your own breast cancer story. The donation link is featured in the header, making use of a bright pink button where the rest of the header is gray.
29. Take The Walk
The Take The Walk site makes great use of bold graphics and a slideshow on the home page to immediately capture visitor attention. A graphic showcasing how many miles have already been walked and how many left until they reach their goal is the main highlight of the home page.
The Amnesty International site makes great use of color, including a bright yellow header and accents mixed with shades of gray and black. A slideshow on the home page shows current news and research. Links to join, donate, or take other action are featured prominently in the sidebar and a link to media information is included in the header.
References and Tutorials: