Nonprofit Website Design: Improving User Experience

Bureau for Good Branding & web design for folks who do good bureauforgood.com

Improving Nonprofit Website User ExperienceAssess your site’s effectiveness & identify problem areas

Bureau for Good Branding & web design for folks who do good

bureauforgood.com


How Much Do You Need to Know About User Experience (UX)?Not a lot! Only enough to:

fff Understand what makes a good site

fff Adopt a user-centered mindset

fff Know how to identify common problems

fff Know when to seek help


What Makes a Good Site?A good site is one that successfully addresses the needs of two parties:

fff the organization

fff the audience

Among those two, the audience is boss, because:

fff You can’t make audiences read content that isn’t relevant to their needs or interests.

fff You can’t make audiences click repeatedly to find information if they’re not motivated to do so.

fff You can’t make audiences stay if they don’t want to.


Basic Questions for Better Experience1. Who are your audiences?

Examples: Prospective donors and volunteers, “clients” (groups you serve), the media, the general public

2. What do audiences want when they visit your site? (audience needs)

Examples: “I want to understand what this organization is all about.” “I want to learn about the impact it has on the communities it serves.” “I want to figure out how I can help.”

3. What would you like them to do? (organizational needs)

Examples: Support us, donate, spread the word, sign up for our mailing list

These are your desired responses. When they are successfully met, we call this a conversion.


Adopting a User-Centered MindsetAudiences are smart. But they’re also busy, easily distracted, and their attention is often split among several tasks at once. To have a user-centered mindset means to respect your visitor’s time and busy lives.

So what do your audiences want?

“I want to understand what this organization is all about, FAST (before I get distracted).”

“I want to learn about the impact it has on the communities it serves, STAT (before I turn to a different nonprofit website).”

“I want to figure out how I can help, NOW (while I have some spare time).”


WRITE TO YOUR CONGRESSPERSON!

DONATE YOUR TIME! SPREAD THE WORD! JOIN US!

DONATE! SIGN UP! PARTICIPATE! VISIT US!

SHARE OUR CONTENT!THROW A FUNDRAISING PARTY!

GIVE US YOUR OPINION! PLEDGE YOUR BIRTHDAY!

VOLUNTEER!SIGN OUR PETITION! SHARE YOUR STORY!

Prioritizing Desired ResponsesWhen feeling overwhelmed with too many choices, audiences tend to choose none—they simply give up! That’s why it’s important to prioritize desired responses.

Overwhelmed? So are we.


DONATE! SIGN UP!

SPREAD THE WORD! VOLUNTEER! SHARE OUR CONTENT!

Prioritizing Desired ResponsesWhen we have less options, we’re more likely to pick one. By concentrating only on your most valued desired responses, you can actually increase conversions!

TELL US YOUR STORY!

Ah! Much better!


What is Good Site Navigation?When you go to the mall, you may start by going straight to the floor plan in order to figure out where you are and where you want to go. You may also rely on signs posted throughout the building. This is called wayfinding.

Here’s what you would NOT expect when visiting the mall:

fff Floor plans that contradict one another

fff Finding a corner of the mall containing dozens of stores that aren’t on the floor plan

fffWalking west and somehow ending up in the east wing

If you did, you’d be confused and frustrated. You’d want to leave as soon as possible!


What is Good Site Navigation?On a website, navigation works in a similar way: it helps audiences form a mental schema of where they are, and it helps them find their destination. A site with bad or inconsistent navigation is like the nightmare mall from the previous slide. Audiences will quickly get frustrated if they don’t understand where they are, what section they’re in, or what path they used to get there.

Ask yourself:

fffDoes every single content page of our site belong to a clearly marked “parent” section?

fff Does the site use a sidebar navigation to indicate sub-sections, and is it consistent with the main navigation?

fff Does the site use breadcrumbs to give users even more wayfinding clues?

fff Are there pages that are listed in various sections, giving the impression that they are either repeated, or that they don’t belong to any one section? This is bad.

fff Are there pages that require too many clicks to get to? Also not good.

fffAre your navigation labels clear? Or are they more ambiguous than we care to admit?


What is User-Centered Content?Many organizations adopt an organization-centered perspective when they create content. They write what they want to say, but not what audiences want to read. No matter how much you love your content, visitors won’t read it if it doesn’t directly address their needs and interests. Result: you’ve buried your user-centered content in a sea of organization-centered content. Audiences give up and move on.

what we do

outdated stuff

our impact

repetitive content

our very detailed history

long bio of our ED

minutia about program X

how to help

35 lengthy facts about us

irrelevant stories


User-Centered Content: 3 Rules of Thumbfff Keep it brief and to the point!

fff Avoid repetition. Consolidate content, sentences, bullet points, etc., as much as possible. Consolidate pages if it makes sense.

fff Break up text with subheads, callouts, display paragraphs, etc.

Ask yourself:

Would anybody outside our organization care about this content?


Using News & Blogs Sections to Keep Content OrganizedOne great approach to content organization is making the distinction between informational, evergreen content on one hand, and editorial or timely content on the other hand. You can separate the two by using a blog and/or news section. Now you can feel free to write to your heart’s content (about last night’s gala, what your ED has been up to, etc.) without having to worry about overcrowding your “official” site content. Visitors looking for this level of detail will know where to look.


User-Centered Layout & DesignGood layout is about visual hierarchy. This means that some things are emphasized in relation to others. When you try to emphasize everything, you end up emphasizing nothing. As a result, audiences don’t know where to look. Compare these two nonprofit home pages. Which one communicates mission and desired responses more clearly?


User-Centered Layout & DesignGood design can be hard to verbalize. But it helps to ask yourself these questions:

fff Does our home page efficiently communicate core messages and desired responses? Does it prioritize our most important messages and desired responses using a visual hierarchy?

fff Is it clear where visitors should look first on each page, or are there many visually competing elements?

fff Are we using color and images to engage our visitors?

fff Are our internal layouts clean, and do they use subheads, callouts and/or display paragraphs to break up text and make it easier to scan?


When to Seek HelpWe hope this brief assessment has helped you pinpoint any glaring problem areas. Once you’ve identified them, you can determine the extent of the improvements needed. Perhaps all you need is to rethink your content creation strategy, and train your team to write more user-centered content. Or perhaps the changes need to go much deeper, and you’ll want to seek a web design consultant to help you redesign the site from scratch. A good consultant can help you establish messaging and desired response priorities, think about your site in more user-centered ways, and bring up issues and problems you hadn’t even thought about.

Your site is often the first (and sometimes only) point of contact between your organization and your audiences. Most, if not all, of your outreach, marketing, PR, and social media efforts will point directly to your site. A bad site will turn audiences away, and that translates to lower outreach and marketing ROI. Make sure to turbo-charge your efforts by offering your audiences an experience they find clear and engaging!


Parting Words

THINK LIKE YOUR USERS!


Download our FREE guide

Don’t start your nonprofit website without meA feature checklist for nonprofit websites

Or visit bureauforgood.com/checklist

CLICK TO DOWNLOAD!

http://www.bureauforgood.com/lp/checklist

Bureau for Good Branding & web design for folks who do good bureauforgood.comBureau for Good

Branding & web design for folks who do goodBureau for Good builds websites & visual brands that help nonprofits educate, advocate, inspire & serve.

VISIT US!

http://www.bureauforgood.com