The following post is by Katya Andresen and originally appeared on her blog, Katya’s Non-profit Marketing Blog. In addition to blogging, …
While reviewing some new wireframes with a client the other day, we began to compare their own, nonprofit website with some other, commercial sites. In a way, commercial websites have it easy. Typically, they have tangible products or services to sell, making it really clear what they want users to do on the site (buy, buy, buy!).
Nonprofit websites don’t usually sell something tangible. Sure, you may have an eCommerce store or even a Virtual Gift store, but there is always a bigger message than just “buy, buy, buy” or even “donate, donate, donate”.
My client’s feedback on their new wireframe was something along the lines of, “When I visit a site like Convio.com, I immediately know what you want me to do. Here, it’s not as clear. What is it we want people to do on our site?” I responded that it’s more challenging for nonprofits because you’re trying to sell a relationship, which can be defined differently for each organization. For some organizations, a relationship may mean that users rely on your site as a source for news on a specific topic. For others, it may mean that they care about your cause and simply want to keep up with what you’re doing to make a difference. Sure, donating and possibly buying something should be part of that relationship, but not likely at first. It takes time to cultivate relationships and your website should provide something valuable for users and offer a positive experience so that they’ll ultimately value your organization.
Take some time to consider your online goals with respect to your relationship with a constituent. I can bet that your goals may include “increase donations” or “build our house file”. What are you offering in return? You’ve got to sell a relationship, so what does that look like for you?
What catches your eye when you look at your web site’s homepage? What is the first thing you see and the first thing you want to click on? These are questions we almost always ask during a usability test to ensure our visual hierarchy is coming through clearly and consistently. Think of the visual hierarchy as the pecking order of a page’s content, providing cues as to what’s most important. If your organization wants, first and foremost, to bring in donations, then a compelling ask should rank high in your list. Maybe you’d rather get visitors to take an action alert or read a new study you’ve published. Your visual hierarchy should reflect your organization’s goals, whatever those may be at the time.
Take a look at the Blockbuster web site. Since Netflix arrived on the scene, one of their goals is likely to obtain subscribers to the DVD-by-mail program. From their homepage, the first thing I see is the “Try it free” button on the “Movies Delivered” promo. The “Learn More” for Blockbuster On Demand also stands out, which is likely reflective of another one of Blockbuster’s goals.
The Jewish National Fund site also demonstrates a good visual hierarchy. My eyes are drawn to the “Donate” button in the top navigation bar and the graphic in the “Plant a Tree” promotional box, both of which are major goals for the organization.
Many of you may be so used to looking at your web site that you may not see a visual hierarchy anymore. Or, the one you do see may be artificially influenced by what you know is most important. In that case, have a friend take a look at your site and tell you what they see first. You could try a “5-second test” where you display the homepage for 5 seconds, then close it and ask your friend to write down what they remember. If their list does not correspond to your organizational goals, then consider rearranging the page or redesigning certain elements. You’re likely to see more clicks and actions taken as a result.
Does your navigation reflect your sitemap?
The question I pose today may seem really obvious, but I’ve noticed lately that many organizations try to make their web sites look simpler than they actually may be. I posted a long while ago about navigation best practices http://www.connectioncafe.com/posts/2009/february/navigation-pass-the-test.html. Today, I want to hone in on one of my navigation test questions: “Is your main navigation representative of your entire site?”
Starting with a content inventory is always a good way to test this out. Content inventories, though perhaps not so fun to make, will make maintaining, optimizing and eventually redesigning your web site so much easier. I cannot stress enough the benefits of keeping an up-to-date inventory of every page on your web site.
Now that you’re going to run out and make one, keep it consistent with your web site’s navigation and/or sitemap so you can easily see where everything fits. As you evaluate your content and add new content, there should be a logical “home” for each item. If there isn’t a natural fit, flag the item in your inventory and consider changing your navigation once you observe several flags. A few questions to consider when testing whether your navigation reflects your sitemap…
-Are there important pages on my site that are only accessible from the homepage or from the footer?
-Are there sub-sections in my site that don’t exactly fit in the area where they’re found?
-Is there important content that users never seem to be able to find?
-Do I rely on the Search function or a Sitemap page to get users to certain contet?
Keep in mind that your navigation should scale with your web site so that you’ll easily be able to change it as you begin answering “yes” to many of the above questions. Unfortunately, your web site will never be “done”, so continuous evaluation and iteration is key to staying successful online. Have you noticed any of these symptoms on your own site or on other web sites? Feel free to share ideas in the comments.
Yesterday, Safe Kids Worldwide [http://www.safekids.org] launched a brand new web site. During the redesign process, Safe Kids worked with Convio to conduct significant user research to ensure the new site would meet the needs of their various audiences. The new site looks great and is much easier to use than the previous version – nice job Safe Kids!
On the heels of a previous post I wrote about “The 10 commandments of effective homepage design”, I thought I’d compare the old Safe Kids homepage to the new one along the lines of those commandments…
[screenshot of old homepage]
I. Thou shalt clearly state who you are and what do you.
The old homepage did convey who Safe Kids is with a nice tagline and a photo of the child in a carseat. The new site, however, provides an even stronger message about who Safe Kids is with a more descriptive tagline and larger photographs of happy children.
II. Thou shalt be able to point to where your top 3-5 online goals are represented on the homepage.
Some of Safe Kids’s online goals include capturing email addresses and increasing donations. Unlike the previous site, the email sign-up is now available on every page in the new site. The homepage also includes a “Donate Now” promotion below the left navigation.
III. Thou shalt offer clear, concise navigation.
Safe Kids previous navigation was confusing and not tuned towards Parents, who are their primary audience. The new navigation not only offers clear and concise options in the left nav, it also offers audience-specific options in the top tabs in case a user identifies specifically with one group.
IV. Thou shalt provide scannable, up-to-date content that entices visitors to click for more.
Safe Kids new homepage offers dynamically updated content under “What’s New” and also under “Product Recalls”, which are very popular among visitors of their website. The previous site offered up-to-date content, but it was not easily scannable and trailed down the length of the page.
V. Thou shalt dedicate space to each of your audience groups.
The previous website did not offer any cues or entry points for each audience group, but the new site provides tabs for each one, which allows Safe Kids to consolidate relevant information in an audience-specific way.
VI. Thou shalt convey a visual hierarchy so visitors know where to look and what to do first.
The old web site included several promotional items on the right side that tended to compete for attention. The new site has a clear visual hierarchy that points first to the rotating feature area and also the options below “How You Can Help” with the icons used in that section.
VII. Thou shalt include 3-4 ways for visitors to engage.
The “How You Can Help” section on the new homepage offers, at a glance, a listing of ways users can get involved today. The old website did offer ways to get involved, but they were scattered about and difficult to locate.
VIII. Thou shalt avoid the Flash intro or any other gratuitous animation.
The new web site does include a rotating feature graphic, but it is not intrusive and does provide the most important content on the page.
IX. Thou shalt make sure most relevant content is above the fold.
The old homepage scrolled for pages and pages. The new homepage does offer all navigation and the feature area above the fold, along with headlines for the rest of the content so that users know there is more to see.
X. Thou shalt balance meaningful content with relevant supporting graphics
The old homepage was text-heavy, with very few graphics. The new site offers more imagery, which is all supported by relevant content and/or calls to action.
All-in-all, the new website abides by the “10 Commandments” and is a great showcase of how user research can really pay off when redesigning your site. Way to go Safe Kids!