Day in and day out, through much hard work and perseverance, nonprofit organizations do their part in spreading good around the world. These groups promote causes that they truly believe in, often with limited budgets and resources. But even on a budget, a nonprofit website should look just as good as the work it promotes. A strong online presence can help in spreading awareness to the organization’s cause and activities, bringing in donations, and recruiting new volunteers. The main points to keep in mind when creating a website for your nonprofit are:
01. Tell your story: Get site visitors excited about your cause and work by showcasing your main activities and highlighting their positive impact. 02. Encourage donations and support: Your site visitors should be able to quickly and easily contribute to the cause with prominent CTA buttons and clear prompts. 03. Build a community: Reach either the community you support or like-minded volunteers (or both), and help them stay up-to-date with your work via social media links, a newsletter subscription, and more. Below we’ve hand-picked 20 of the best nonprofit websites out there, created with Wix, for your inspiration. Read on to discover what it is that makes them work so well (and look this good). As a bonus, we’ve added a few free nonprofit website templates to get you started: 01. HERoines Inc. HERoines Inc. is a women’s empowerment platform that motivates and supports women in achieving their dreams. The bright website color scheme of pinks and purples is far from frivolous, conveying the positive and strong-knit vibes of a sisterhood you just want to be part of. This striking website maintains visitors’ attention with all sorts of high-quality media features, from photographs to icons, animations and more. It also includes a page dedicated to upcoming events, where guests can easily register and RSVP using Wix Bookings. There are testimonials of satisfied members of the community, and a blog for sharing anything from empowering lifestyle tips, to interviews with HERoines members. The website is scattered with call to action (CTA) buttons that invite visitors to either ‘Donate’ or ‘Become a Member.’ And just in case you happen to miss any of those, there’s a supplementary ‘Donate’ button on the right. This button stays put throughout all of the site’s different pages, with a heart icon that adds a fun and subtle appeal to visitors’ emotions. Down at the footer of the website are a newsletter subscription form and social media links so that visitors can stay in touch. This website was designed as part of the Wix Design Playground by Valerie Trisnad and Qiuyu Guo. 📷 02. Ocean Data Alliance The Ocean Data Alliance is a nonprofit organization that utilizes ocean data in hopes of addressing the climate crisis and helping ocean ecosystems. The work that this organization takes part in is apparent in every aspect of its web design. For example, maps of coastal cities from around the world, from New York City to Shanghai, are featured in the background, gently gliding on top of one another as we scroll down the site. The titles also tie into the same idea by using an animated pixelated font, bringing to mind the data work the alliance does. The concept is further enhanced by the use of website animations as we enter the site. The logo design is just as fitting with the organization’s expertise, with wavy lines that represent the ocean. When clicked, the logo leads back to the homepage for easy navigation. On the top fold are prominent CTA buttons, inviting site visitors to buy tickets for an upcoming event or to join the organization. These buttons stand out against the overall design of the site, in their bright green color and an underline that draws extra attention. This website was designed as part of the Wix Design Playground by Sophie Brittain, and Wendy Ju.
📷 03. Kode with Klossy Kode with Klossy is a not for profit initiative by supermodel and entrepreneur Karlie Kloss, aiming to teach young women to code. The website launches into a fullscreen video showing young women coding, cheering, learning and taking selfies with Karlie. Right below the video is the program’s mission statement, in vivid and fun colors. The website’s design is cheerful, filled with images of smiling teens. This friendly approach makes the STEM disciplines feel more accessible, helping to inspire young women of all backgrounds. The website navigation here is made up of three parts: a classic menu on the website’s header, accompanied by two sidebars. On the left is a bar for social media links, and on the right are the ‘Donate’ and ‘Apply’ CTAs. 📷 04. Barco Sorriso This nonprofit organization, whose Portuguese name literally means ‘The Boat Called Smile’, provides free dental care and health education to isolated coastal communities in Brazil. Barco Sorriso’s multilingual website is colorful, bright and fully illustrated, with the organization’s logo (a boat which doubles as a winking, smiling face) repeated throughout. Note the ingenious use of the parallax scrolling effect, which creates a smooth transition between the first two folds. As we scroll down, the ocean view of the first fold is gradually obscured behind the greenery of the second, making room for a beautiful animated video that introduces the organization's activities. Lower down the page are a slideshow of photos of the individuals and communities that Barco Sorriso have helped, as well as testimonials by both dentists and volunteers, and more. These diverse types of content are all tied together under the same feel-good, optimistic visual language. 📷 05. Dreams Have No Boundaries Dreams Have No Boundaries’ mission is to provide extended education for underprivileged youth in Bangladesh. Their website design employs a cohesive visual language comprised of a combination of photography, hand-drawn doodles and brush strokes, that together bring to mind the scribbles of a child’s notebook. Although this website is rich with information and CTAs, it remains coherent by splitting up elements into bite-sized sections. For example, potential volunteers can pick between options such as teaching classes pro-bono, to helping out as a web designer. The application is separated into stages, so only once a category is picked using the ‘Apply’ button, does the next stage pop up as a lightbox. This ensures that the screen doesn’t appear cluttered and also forms a smooth overall experience. This website was designed as part of the Wix Design Playground by Jikun Tao, Marcela Monko, and Carista Eliani. 📷 06. GEM, Inc. Girls' Empowerment Matters GEM, Inc. provides a safe space for urban girls from the Bronx, with personal attention, guidance, and mentoring programs. The values at the core of this initiative (from self esteem to expression) are proudly displayed on the website’s top fold, rotating in a typographic animation. The website boasts a well-defined color palette of purple and teal, which is repeated in its design with geometrical vector art and duotone photography. The purple acts as the primary color, dominating the majority of the webpage, while the teal serves as the accent color. Due to its more limited use in the design, the teal truly stands out when inviting site visitors to ‘Donate,’ ‘Get Involved,’ and ‘RSVP’ to events. This website was designed as part of the Wix Design Playground by Nikhil Singh, Siman Li and Jiajia (Amber) Huang. 📷 07. Arte Arte works with young people to create visual art projects centered around topics of human rights. Their website includes inspiration and tips for raising awareness to different social causes through art, such as via mural painting or zine making. With an easy-to-navigate design and a seamless user experience, this nonprofit website is thought-out down to the last detail. They’ve also included a favicon (the small icon at the top of your web browser), abbreviating the organization’s name into its first initial, which makes it readable in favicon size. The site also has a carefully crafted domain name, with a .org domain extension to signify that this is a noncommercial entity. This website was designed as part of the Wix Design Playground by Marta Urbez, Kristina Filler, & Jiyoon Kim. 📷 08. City Farm Committed to reviving community engagement in sustainable agriculture, City Farm manages a 19-acre reserve in San Luis Obispo, California. On the top fold of the website is a Google Maps widget, helping us locate the reserve’s whereabouts. In the ‘Latest News’ section, the website links to City Farm’s monthly newsletter, in which they share regular updates. While serving as an archive accessible at any time, these newsletters are also utilized for email marketing. Site visitors can also subscribe to the newsletter either on the ‘News + Press’ page, or at the website’s footer, where other contact details and social media links can also be found. 📷 09. CharacTours As soon as this website opens, a pop-up lightbox welcomes visitors with an important message, asking them to support the organization through donations or contributions. The site itself recreates an old-fashioned look, immediately reminding us of days of yore. With sepia photography and vintage type, the website is in line with the CharacTours’ theatrical walking experiences, introducing audiences to the history of New York City. This website was designed as part of the Wix Design Playground by Ivy Chen, Veronica Clauss, & Liran Arbiv. 📷 10. Global Grace Global Grace explores gender and cultures of equality across the world. The upside-down world map of their logo is also featured on the ‘Projects’ page. Here, the same map that offers a fresh perspective of our planet, becomes interactive. As we hover over certain countries on the map, a lightbox shows up with an excerpt of the organization’s activity in each country. 📷 11. Hold Your Fire Hold Your Fire is a personal project led by illustrator and designer Kristina Filler, in memory of her father, a school teacher killed by gun violence. This initiative raises money for gun safety though the sale of illustrated t-shirts. The Hold Your Fire shirt merges a dove with an open hand into one beautiful design, exemplifying the use of illustration for a social cause. By using a hand-painted illustration, alongside a very personal story and a minimal website design, Hold Your Fire treats what is often a controversial topic in a light-hearted and genuine manner. To date, the project has raised $11,000 for its cause. 📷 12. Literacy Inc. The very first fold of Literacy Inc. is quick to deliver every detail site visitors need to know: the name of the organization, three words that describe what it does, and a prominent CTA button for donations. Combined with a fullscreen photo of children reading, and badges that add credibility and reliability, this website’s homepage ticks all the right boxes. The rest of the website is just as enticing, with animated infographics, a split-screen layout (which is a current web design trend), and parallax scrolling. This website was designed as part of the Wix Design Playground by Ryan Carceller & Jackie Lam. 📷 13. Ascend Through mountaineering and leadership training, Ascend aspires to empower young women in Afghanistan. The physical challenge of mountain climbing, followed by the sense of accomplishment at summiting the peak, are mutually evident on the fullscreen photo on the top fold. The website displays many photos of Ascend’s different mountaineering feasts, telling the program’s story in a highly visual way - alongside text and video. The homepage also embeds the program’s Instagram feed, so that their newest content always shows up on their website. 📷 14. Artrepreneurship Brooklyn-based creative collective and agency Artepreneurship, helps local artists in jumpstarting their careers through workshops, tools and personalized training. The website’s asymmetrical design is colorful and creative, while also retaining readability. The ‘Donate’ button is prominent in the upper right corner. At the left is a navigation bar that allows for easy access to the website’s menu, a logo leading back to the homepage, the collective’s social media links, and an online form for leaving them a note. This website was designed as part of the Wix Design Playground by Judy Ye, Pei Jung Ho, and Yue Leng. 📷 15. The Depression Portal On a mission to provide education and support for those dealing with or affected by depression, The Depression Portal is full of information about the condition, its treatment, the surrounding stigma, and more. The website’s first fold reads, ‘Depression strikes 1 in 4 Americans,’ and matches the text to a visual representation of this harsh figure. The image shows a grid of black and white portrait photography, with one out of four images marked in red to symbolize the statistic. 📷 16. The Pad Project This one page website introduces both The Pad Project charity project and its Academy Award winner documentary, ‘Period. End of Sentence.’ The Pad Project supports women and girls in developing countries by promoting the production of affordable, biodegradable pads. The first fold of the website features a fullscreen photo of young girls laughing. On top of the photo are all of the major must-haves: the nonprofit’s name, a one-liner to briefly explain their mission statement, buttons linking to their social media, and a ‘Donate’ button. 📷 17. Travel with a Purpose, Inc. Travel with a Purpose, Inc. donates school supplies, clothes and shoes to less fortunate children around the world. Their website utilizes a combination of photography, animation, and illustration to lay out their vision and activities. Note, for example, how a photo of worn down flip-flops on a child’s feet, barely held together with plastic bags, is magically transformed through animation into a shining new pair of sneakers. It’s a fun and imaginative way of instantly explaining what this nonprofit organization is all about. This website was designed as part of the Wix Design Playground by Pondsuda (June) Saelim, Charlie (Marko) Luardo and Alicia van Zyl. 📷 18. DOTS: Dogs on the Streets Dogs on the Streets is a charity supporting the dogs of the UK’s homeless community. Centrally located on their website is a video, showing Peter Egan interviewing a homeless person named Damo about his special relationship with Gypsy, his dog. The video catches visitors’ attention early on through a captivating personal story. This nonprofit website also includes many other types of media, such as a podcast and an image gallery. 📷 19. The 1930 Committed to participating and promoting female philanthropists and leadership, The 1930 is a not for profit community based in Briar Cliff University, Iowa. Their website helps site visitors feel involved by sharing the organization’s history (dating back to 1930), photos of its activities, and personal stories of female students that are part of the program, retold on the website’s blog. 📷 20. Little Miss Code Little Miss Code is a student-run initiative, where high schoolers introduce underprivileged school girls in the Bay Area to computer science, web design, design thinking, and more. While the site is packed-full of eloquently explained information in the form of questions and answers, a video and more, its first fold remains clean. There, we’re welcomed by just a fullscreen image of girls at work, together with the organization’s logo, its business name, and a concise sentence about its vision. 📷 Free nonprofit website templates Looking to create a nonprofit website of your own? You can create one from scratch, or start with one of these website templates, customizing it to fit your organization’s needs and style. Here are three templates to get you on the right path: Women Empowerment NGO: This template is filled with all the features needed for a nonprofit website. Starting with a large and eye-catching ‘Donate’ button at the top, it also includes a blog, a testimonials section, a list of upcoming events, and even its own podcast. 📷 Food Charity: This charity template features a fullscreen video on its first fold, so that visitors can be clear on what it is that you do early on. There are many ways for site visitors to get in touch, from live chat to social media links, donation buttons, and a newsletter. 📷 Environmental NGO: Express your message loud and clear with animated typography on a video background, encouraging site visitors to support your cause. This template is neatly organized, with a blog, podcast, photo gallery and more, each on its own designated page.
Make your sign up now on our blog so you do not miss anything!
* Source https://www.wix.com/blog/