Your homepage is the face of your nonprofit. While marketing appeals will likely be supporters’ first impression of your nonprofit, your homepage tells supporters everything they need to know about your nonprofit (whether it’s intentional or not). To improve visitors’ experience on your homepage, learn how to build and maintain an accessible homepage with a modern design that reflects the sophisticated nonprofit behind it.
If you don’t have experience in web design, upgrading your website can seem like a monumental task with the potential downside of breaking core functionalities. To help you confidently lead your nonprofit’s homepage development, this article will go over:
The first three sections will discuss key aspects of your homepage, allowing you to take the first steps towards creating and maintaining a better nonprofit website. The last section will then discuss actionable steps you and your team can implement to continually improve and upgrade your website.
Design trends change, and while your current supporters have a clear idea of what a website should look like now, their expectations may shift in the future. Once you design your website, continue to keep up with technological and design changes in the nonprofit sector in order to have your homepage consistently make a good first impression.
When visitors come to your website, what do you want them to see first? Nearly every nonprofit should have a few core features on its homepage, but the order and presentation of those items will affect how your visitors engage with your website.
Here are a few must-have features for your homepage:
- Basic information about your nonprofit. Basic information includes the name of your nonprofit, your contact information, and an abbreviated mission statement or summary of what your organization is. Additionally, consider spotlighting a project your nonprofit is currently working on or has recently completed. Keeping regular news updates on your website gives visitors examples of your work, while also assuring them your nonprofit is still active.
- Navigation bar. Your navigation bar should be near the top of your homepage, should be obvious to visitors upon first glance, and should contain links to key pages on your website. Put yourself in your homepage visitors’ shoes as you consider the labels on your navigation bar, especially if you have nested items. Conduct user testing by having users practice navigating your homepage to be sure they are making the right assumptions about what content is under each label.
- Link to your donation forms. Donating should be as easy as possible for visitors. Many nonprofits have large, brightly colored donation buttons located somewhere near the top of their homepage. Others have the donation form already open in a sidebar or over their hero image to let visitors input their donation information without navigating off their homepage.
- Link to your volunteer/contact forms. Similar to your donation form, your homepage should feature a “Work with Us,” “Get Involved,” or “Volunteer,” link somewhere above the fold (or near the top of the page). Be sure to differentiate your volunteer form from your careers page, if you have one. Careers and job opportunities tend to be linked in your webpage’s footer if you are recruiting.
- Logo. Your entire website should represent your nonprofit’s brand, and placing your logo front and center will make it clear to visitors what homepage they are on. Your logo should make an appearance on every page on your website (usually in the upper right or left corner), but can be bolder or take center stage on your homepage.
Consider your audience and how your audience interacts with your nonprofit as you begin the design process. Are your supporters from a specific area? Do they have specific jobs? Are they from a specific generation? Take the time to research your audience and conduct user interviews in order to understand who your website should appeal to.
While expertise helps, you can create an attractive, modern website without being a professional website designer. You’ll just need to follow a few standard best practices and carefully consider how design will impact your users’ experience.
Your website’s design should enhance the information on your homepage rather than being incidental. Decide what you want to draw your visitors’ eyes to as you consider your design choices for:
- Images. Your website should have high-quality photos, graphics, or other visual media. Along with your logo, consider creating a main hero or banner image that evokes emotion while also informing visitors about what your nonprofit does. For example, an environmental nonprofit might have pictures of volunteers planting trees or eye-catching graphics showcasing how many trees they have planted over the past year.
- Colors. Choose colors that align with your nonprofit’s brand. In addition to coloring menu bars and section dividers, consider implementing gradient overlays to give your homepage a consistent color palette. However, be sure to leave white space in margins and between sections to give your visitors’ eyes a chance to rest.
- Text. Text design includes your headers, paragraph line-length, and use of bullet points and numbered lists. Strong text design includes clear headers, short line lengths, and gives readers breaks between blocks of text with white space and listed content.
- Layout. As mentioned, consider what order to put your features in. Some websites use vertical column layouts to display lots of information at once, while others act like a social media feed, allowing visitors to scroll until they find the content they want. Your layout affects how viewers navigate your website, so prioritize navigation and convenience above all else by reducing clutter and ensuring your navigation bar is always accessible.
As you add design elements, take the time to make sure your website meets accessibility guidelines. Add alt-text to images, transcripts for videos, and ensure necessary fields on donation forms are marked by another visual aid than just color alone.
After building your nonprofit’s homepage, you will need to conduct regular maintenance on it. You should regularly add new content to your website in order to show your activity to your supporters, but adding new pages without proper maintenance can lead to broken links, confusing website hierarchy, and long load times.
Not all website maintenance requires you to have knowledge of coding (though it can help), and there are many routine operations you can complete yourself. Cornershop Creative’s guide to nonprofit website maintenance provides a checklist of items that includes:
- Replacing outdated links. Outdated and broken links can make visitors doubt your website’s security, which may cause them to hesitate when inputting their financial information into your donation form. Click all regularly used links and test links to new pages to keep your visitors on your website and away from 404 Error messages.
- Checking loading times. If your homepage takes longer than two seconds to load, visitors may not bother to wait, losing you website traffic and potential donations. Long load times can be caused by large image files or unnecessary plugins. Check out this guide for more information about what you should look for (and avoid) in a WordPress plugin.
- Actively testing forms. Practice entering your information into your donation, volunteer, and registration forms to ensure information is flowing through to your CRM properly and that there are no unnecessary steps slowing down the process.
Staying updated on website and online best practices requires time and routine research. If your homepage has a problem you are not equipped to handle, reach out to professional website consultants for advice. For example, serious issues like a security failure require immediate attention and warrant bringing in outside help to protect your donors’ security and your reputation.
Steps for Improvement
Implement the practices in this guide as a first step towards forming a better digital first impression. Remember, though, that creating and maintaining an up-to-date website requires consistent research on new technology and web practices.
As you improve your website, start looking into additional improvement strategies such as:
- Attending training courses. As nonprofit technology evolves, the list of things to learn grows along with it. Training courses can teach you how to make the most of the tools you have and potentially start tackling tasks in-house that you previously had to outsource.
- Hiring a consultant. You may decide that your nonprofit doesn’t have the time and resources to build and design your homepage. In this case, look into web design consultants specialized in nonprofits to discover what you need and what options are out there. If you’ve never worked with an external expert before, this guide to nonprofit consultants outlines essentials to keep in mind.
Keep your budget in mind as you get to work on your website. Designing, coding, and maintaining a website can quickly become expensive, so be sure to create a list of must-have components and a budget to ensure nothing vital is forgotten without spending more than necessary.
Your homepage’s visitors are used to modern web design and will approach your website with specific expectations of what a homepage should look and act like. While you want to give these visitors a unique experience, ensure they find your website easy to use, modern-looking, and secure.
Design your website with convenience of use and your brand identity in mind, and regularly update it to make sure the effort you put into its creation never goes to waste due to loading times or broken links. With a solid web design foundation in place, you’ll be able to start bringing all of the other pages on your site up to speed, too. Best of luck!
About the Author
With 15 years’ experience, Ira is an expert in nonprofit online communications and online fundraising. His work has resulted in increased funds and resounding supporter engagement for hundreds of organizations.
Ira oversees our project management team and works with clients to provide our clients with the best possible final product. He also manages all of our strategic engagements and helps guide nonprofits to determine their long-term strategy goals for online communications.