Don't Hang the Curtains Before Pouring the Foundation: Building a Modern Nonprofit Website

Seth Giammanco Seth Giammanco

Imagine someone told you, “Congratulations! You’re getting a brand new house!” You’d be ecstatic, wouldn’t you? You’re probably already imagining what color to paint the living room. But what if they added, “Of course, you have to build it first.” You’re likely feeling a little less excited and a lot more overwhelmed.

Unless you have a background in construction and are well-versed in the building code, you know you have to hire someone with expertise to do the heavy lifting.

You should have that same certainty about bringing in an expert when it’s time to build your nonprofit’s digital house — your website. (A quick note here to say that new and small nonprofits can sometimes use an out of the box solution like Squarespace or WordPress. It’s an easy way to have the basics like posting your contact info and news while having integration to a donation processor like PayPal. But this approach is more like renting a hotel room than building a house.)

I understand the DIY instinct many nonprofits have. It stems from wanting to be responsible with donors' money. A new website can be a large expense on the 990 which makes senior leadership nervous. While the softer costs of a bad website are harder to measure, they’re no less important. Spending staff time troubleshooting issues, losing impatient donors who close a slow-loading donation page, alienating visitors who attempt to use screen-readers with incompatible text … you will eventually pay for a website. Why not pay upfront for a site that meets your needs and can grow with you instead of a site that will increasingly cost you in staff time and lost opportunities?

If we were planning your new site together, here are the six things I’d like to add at the top of your needs list:

Responsiveness

Everyone should have a good experience regardless of what device they use to visit your site. More people than ever are visiting websites from their phones and tablets. If you’re basing your site designs on a large desktop screen, then you risk alienating a growing part of your audience with bad design choices. Taking a “mobile-first” approach to the site’s architecture is starting off on the right note. Keep in mind that as design moves into execution, a lot of effort will go into ensuring the site will render correctly across a variety of devices, sizes, and operating systems. You’ll want to test the site in a broad array of scenarios.

Accessibility

The social good sector prides itself on leading the way when it comes to inclusiveness. Sadly our websites often fall far short of our inclusive intentions. While design decisions like using larger fonts and black text on a white background have become more common in acknowledgment of sight-impaired visitors, those are just the bare minimum of having an accessible site. Disabilities can take many forms, and if you or a loved one haven’t struggled to navigate an able-bodied biased world, then you could miss how unwelcoming your site is. Consider these scenarios:

  • A legally blind visitor may need to enlarge the text to a suitable size. Can your site reflow the text appropriately or will it become difficult to read?
  • Someone with a hand tremor needs to navigate your site using keyboard commands instead of the mouse. Can they easily jump from field to field or will they be slowed down by inconsequential links?
  • A wheelchair user has a tablet that can’t be rotated. Will your volunteer registration form still display correctly on their screen?

It’s critical to have a fluency in accessibility guidelines and an understanding of how to implement them as you add new content. For instance, will you caption your gala video before posting it or will you make a transcript available?

SSL

Secure sockets layer is just tech talk that means all the data that passes from a visitor’s web browser to your server is encrypted. If you’re accepting donations or payments, then those payment pages are likely secured so that they can process credit cards. But what about the other pages on your site? (Take a look at your current site. Is it secure — the address bar shows https — or insecure — the address bar shows http?) Google wants to be sure that it’s delivering quality search results. Having correct security protocols in place is a factor in how high your site displays in search rankings.

Speed & Performance

Google also cares about how fast your website loads. We’re not talking about a matter of seconds here. If it takes a few seconds for your homepage to load, then you’re way behind the curve. Google measures milliseconds. A site with clunky code will slow you down. Coding is a science, but elegantly written code is an art. The former gets you on the web while the latter makes Google and your visitors happy with how fast your site loads. Remember when we discussed responsiveness earlier? Elegant code is how all your beautiful photos display quickly on screens of all sizes.  

Content & User Experience

Nonprofits often jump right into figuring out what should be on the website, but that’s the equivalent of picking paint colors before pouring the foundation. It’s usually the most internally contentious part of the process because every department has its ideas about what they want to communicate. But good design doesn’t ask, what do we want to talk about? It flips your perspective to that of your audiences. What do they want to know and what do they need? Is someone actually interested in your press release about summer camps or do they just want to know the registration deadline and can’t find that information quickly on your site? Successfully answering those two questions is the difference between smart communications and a vanity project.

Animation

Thankfully, we’re way past the days of when long blocks of text were the only way to communicate on the internet. But you can’t always tell that by looking at some sites. While video has become more common, you tend to see it used more on social media than nonprofit sites. That’s because sites that are just a few years old made the mistake of using a rigid infrastructure that didn’t anticipate the explosion of video’s popularity. I see the same mistake happening now regarding animation which is a terrific way of focusing a visitor’s attention on a page's essential information. But while we should thinking about how to incorporate it into our storytelling, we have to be careful about getting carried away. No one wants a repeat of PowerPoint’s nightmarish early days. (Do you remember when every bullet point dramatically whooshed onto a slide?) And don’t forget, while figuring out how to create animations that communicate clearly it's just as important to make them accessible.

You can dive deeply into each of these considerations. But I hope I’ve conveyed that the website creation process is exponentially more complex than the last time you built a site. And no matter how great your IT person is or how well your communications team knows how to use your CMS, it’s unfair to expect them to have the in-depth knowledge of best practices necessary to build a modern site on top of all their other responsibilities. It’s worth investing in a partner who can help you navigate the technology while balancing your needs and budget.

One last thought for you. While the technology can feel overwhelming, always remember that the reason your website exists is to tell the story of your work and how your supporters make it possible. Your story is exciting and full of possibility. So is your new website.