How to turn your nonprofit’s website into an engaging, high-traffic destination

Target audience Nonprofits, NGOs, cause organizations, social enterprises, businesses, brands, Web publishers, Web programmers.

Guest post by Al Lunt for TechSoup

Holding the interest of new visitors and encouraging them to explore the website is important for nonprofits for a simple reason: They are an idea, an encapsulation of your nonprofit’s mission and goals. And that requires careful consideration of the visual factors that will keep users on your website long enough to absorb your intent.

According to award-winning multimedia designer and producer Mike Schmidt at mowhawkstreet.com, creating an “emotional connection is often the driving force behind these sites, but is also the driving force behind most marketing.” With limited financial resources and regular reliance on volunteer help to build and maintain websites, nonprofits face a daunting challenge in creating sites that can make those emotional connections with users.

Below are five basic tips to help nonprofit Web builders create visually enticing websites. Successfully implementing them could turn a mediocre but usable nonprofit website into an engaging, high-traffic site through enthusiastic word of mouth.

Create a clutter-free home page, encourage exploration

1 A cluttered home page that is overwhelmed with too much text or too many graphics may drive away prospective donors. The home page is often the first impression of a nonprofit that a user sees. It should never be thrown together haphazardly just to establish a Web presence. Network for Good, a nonprofit that provides fundraising ideas for other nonprofits, recommends striving “for simplicity and clarity in design. Your home page should be attractive and engaging, but uncluttered.”

Girleffect.org

Girleffect.org targets younger people sympathetic to the plight of young girls in developing nations. The home page above the fold has only four navigation choices: Home, Learn, Give, and Mobilize. Scrolling below the fold reveals the call to action “3 Things You Can Do Right Now” – Donate, Spread the Word, and Learn. Fewer choices encourage exploration.

Operation Warm

Operation Warm distributes new winter coats to needy children in the United States. Above the fold the home page offers three tabs that contain drop-downs with other selections. Scrolling below the fold “What We Do” appears and provides the mission statement in detail. The nonprofit’s title and central picture communicate the mission without ambiguity.

Create brand recognition with a logo

2 Having a logo that reinforces the intent of the nonprofit or serves as a memory aid for the cause helps make a website memorable. Branding through a logo is part of the emotional experience you want users to have when they come in contact with your organization. Creating a logo is an investment and should be a high priority budget item. Ideally a nonprofit logo should be instantly recognizable, convey a sense of the nonprofit name or mission, and remain effective in a variety of colors or mediums.

Feed the Children

The simple Feed The Children logo of a child with outstretched arms holding a food bowl instantly generates an emotional appeal for support. When linked with the tag line – “It’s who we are. It’s what we do.” – it creates a powerful and memorable image.

The Michael J. Fox Foundation for Parkinson’s Research

The Michael J. Fox Foundation for Parkinson’s Research uses clever graphic lines that give the illusion of a fox’s body, streaming tail and pointed ears alongside the name of the nonprofit. The selection of the reddish-orange color of the logo and typography also reinforces the name of the charity and its mascot – the fox.

Wounded Warrior Project

Some logos work powerfully in stark black and white. The Wounded Warrior Project logo of a soldier carrying a buddy off the battlefield is easily recognizable from its outline, although you can’t see the soldiers’ faces. The grayscale banner graphic of rotating photographs of servicemen and women reinforces the intent represented by the logo – taking care of wounded warriors.

Create a consistent visual theme

3 Maintaining a consistent visual theme on a website helps unify the site and makes navigating it easier. Help establish consistency by selecting colors and fonts that complement the nonprofit brand and ensure they are maintained on all pages. Maintaining the same look on the website and mirroring it in promotional materials will reinforce your organization’s brand identity. The visual theme should reflect the culture of the organization and at the same time be targeted to attract the donors, volunteers, and supporters your organization is trying to reach.

History pin

History Pin, the 2011 Webby Awards winner in the charitable/nonprofit category, strives to “get generations talking more, sharing more, and coming together more often.” It integrates Google maps, timelines, and uploaded personal photographs to create archives of places, events, and people’s stories. With the look being part scrapbook and part school project, it is designed to appeal to both young and old and ultimately encourage inter-generational dialogue.

Create a video presence

4 Compelling video tells the story and helps hold the attention of website visitors. Although a nonprofit website can exist without video, it must compete with those that do. Creating a video that tells the nonprofit’s story can be an expensive undertaking if professionally done. But, it can also be done using simple point-and-record cameras with minimal editing for a less polished look that still tells your story. However, the payoff cannot be measured just in website hits. A well-done video can extend its utility beyond the website itself as a centerpiece of a nonprofit’s marketing effort.

Below are two examples of videos from larger organizations. You can also view samples of low-cost, short videos from TechSoup’s annual Digital Storytelling Campaign.

charity: water

One nonprofit that does a particularly good job with a video centerpiece is charity: water, which has built 4,000 wells to bring clean, safe water to more than 2 million people in developing nations. charity: water’s video “Water Changes Everything” uses powerful infographics to emotionally engage the viewer in the impact that clean water has around the world.

Witness

The nonprofit group Witness not only uses video to tell their story – video is the story. Their tagline “If a picture’s worth a thousand words, what’s a video worth?” powerfully communicates their goal: to use video to open the eyes of the world to human rights abuses. Its call to action not only seeks donations but also volunteers to translate and edit videos of human rights abuses from around the world.

Create an emotional connection using still photos

5 Use static or rotating photographs to tell the story of the nonprofit and put a face on the beneficiaries of donor involvement and contributions. Avoid stock photos that might be used elsewhere because you want your photographs to be part of your branding. Unlike video, still photos allow the user to focus on a moment in time that is frozen, allowing contemplation and creation of a lasting connection.

Kiva

Kiva has a mission to connect people through lending to alleviate poverty. Through micro-loans as low as $25, they help create opportunity around the world. The power of the website is that the donor can see the face and read the story of each loan recipient, creating an emotional connection.

Susan G. Komen for the Cure

The Susan G. Komen for the Cure website incorporates a Flash photo banner that can be scrolled to see pictures and read stories of volunteers, breast cancer survivors, and their family members. This connects the user to the cause, its beneficiaries, volunteers, and other donors.

Templates

Experienced Web designers might recommend against using website templates because they can limit flexibility or have a cookie-cutter look. However, small nonprofits may want to consider them if their in-house design capability is lacking or they cannot afford to outsource their Web design requirements. Many nonprofit templates are available online in various content management systems, including popular WordPress themes. While not always ideal, starting with a template can provide a basic site that can often be customized later to incorporate more of your organization’s signature branding and feel.

Conclusion

Creating a visually enticing nonprofit website does not require a significant budget. However, the goal of improving your website as your budget allows is a worthy one. Consider these few tips as a starting place to help you evaluate your existing website for areas where you can improve how you tell your nonprofit’s story with enticing visuals.

Additional resources

• Creating media: tips on producing video, multimedia and photos
• 10 beautiful nonprofit WordPress themes
• Nonprofit Website Design: Examples and Best Practices
• 10 Tips to Improve Your Nonprofit Website
• 25 Powerful Nonprofit Logos, Deconstructed
• Tips for Designing (or Redesigning) a Nonprofit Website
• 25 Great Nonprofit Websites and Tips for Your Inspiration
• Tips for Nonprofit Website Success

This article originally appeared at the TechSoup Learning Center. It is republished with permission.

The post 5 tips to help you create visually stunning websites appeared first on Socialbrite.

Integrate social components into your site’s design and function

By Debra Askanase, Socialbrite
and Seth Giammanco, Minds On Design Lab

If you’re considering revamping your website to include social elements like the Facebook Like button, streaming from YouTube, or adding information from a social site through its API, it can be overwhelming to know where to begin. There are many ways to “get social,” and so many reasons for doing so. Primarily, it’s about creating a fundamentally engaging experience for the website visitor that brings them closer to your organization.

The process of considering how to get social starts with considering goals.

Why integrate social into your website?

Ask yourself: what do you want to accomplish for your organization using social media? Having a goal seeks to address why you might want to make your website social. By thinking first about the goals, you clear a path for the decisions around which tools you’ll use to get there.

There are five main reasons for integrating social media with your website:

1. To build followers within the nonprofit’s social media spaces
2. Create on-site engagement
3. Develop a sense of community on the website
4. Raise funds
5. Create a call to action

In our review of many social websites, we noticed that some websites have at least two primary goals for placing social media on their website. Think about separating your goals into “priority” and “lesser priority.” Don’t be afraid to begin with one or two primary goals, while testing frequently at the outset to see whether or not your goals are being achieved. Gradually, you can add more social media integrations as your initial goals are achieved.

Categories of integration

Categories of integration address what you might do to meet your goals, and how you would do it. While reviewing websites, we specifically looked at the different types of social media that organizations were integrating into their websites. We categorized the (almost limitless) social media integration possibilities into six categories:

1. Show
2. Share
3. Interact
4. Co-create
5. Authenticate
6. Open source

Each category is exhibited by different tools, technology, and/or approaches. Here are some examples of categories and how they might be implemented within a website:

1. Show – Recent Tweets, Likes, Comments
2. Share – Like & Tweet Button, E-Card, Fwd to Friend
3. Interact – FB Live Stream, Hashtag (Tweet Chat), Comments
4. Co-Create – Shared Content: Mapping, Mosaic, Wiki, Links, Games
5. Authenticate – FB Login, Twitter OAuth
6. Open Source – API

Some of the items above are simple widgets and plug-and-play doodads that allow one to take a little snippet of code and incorporate it onto a Web page. With services like Disqus, even complicated features like comments can be added to a page in literally minutes.

On the other end of the spectrum, there are uses of technology to create unique “co-create” opportunities, if not open opportunities, where content can be made available through APIs and syndication for others to use. Check out the Brooklyn Museum’s API documentation for some pretty advanced tech sharing.

The graphic below illustrates the intensity of resources required for each category.

Examples of sites that integrate social resources

Here are a few social websites that offer different levels of resource integration.

HandsOn Network: America’s Sunday Supper

1This was a Livestream-powered event billed as “America’s Sunday Supper” in the spirit of Martin Luther King, Jr., which was part of a national event to inspire giving and local leadership. HandsOn created a page on their site to showcase the livestreamed panel discussion on volunteering and leadership, and encouraged online participation through its live Twitter and Facebook streams on the website.

• Goals: develop a sense of community, create on-site engagement
• Categories: show, share, interact
• Implementation: livestreaming, Facebook event plugin, Twitter feed

American Red Cross: Why should I give?

2The site presents, one reason at a time, why one should give to the Red Cross. Each reason is clearly presented with no more text than you might put on a PowerPoint slide. The reasons are sourced from blogs, news, or case study posts from a network of American Red Cross sites. These posts are linked to if a visitor chooses to read more about the reason shared. For each reason you view, the site ticks up your donation counter one buck, and if you decide to give, the resulting donate screen defaults to the amount of your donation counter and number of reasons you needed to be “convinced.”

The primary goal of the site is to fund-raise and build followers. The social aspects of the site rest in the use of Facebook and Twitter social plugins and widgets for sharing, as well as liking the campaign.

• Goals: raise funds, create on-site engagement, create a call to action
• Categories: Show, Share
• Implementation: Tweet Button, Facebook Like Button

VolunteerMatch: Live Map

3VolunteerMatch has created an up-to-the-minute live map on its website, offering information about the total number of searches and different categories of referrals indicating when a user has responded to a volunteer opportunity. The map pinpoints where the referrals were made throughout the United States, with the goal of showcasing individual activity collectively to illustrate the social impact of volunteerism. VolunteerMatch also utilizes social authentication to allow Facebook account holders to login using their Facebook accounts. VolunteerMatch also has placed a Facebook activity widget on the home page to highlight users whom have recommended (liked) content on the site.

• Goals: create a call to action, develop a sense of community on the site
• Categories: show, authentication
• Implementation: Custom mash-up of site specific volunteer activity with geo data to map via Google Maps.

It’s an exciting time, where strategy begets technology solutions and in turn technology inspires new strategic opportunities. It’s critical that all of us crafting engagement keep learning, and keep seeking out new tools and inspiration from our peers. Each day, new tools are announced and someone is doing something cool with it to create connections and do some good. Having a framework to organize your goals and to categorize the types of technology integration available can help you make quick sense of a social site.

NTEN webinar on how to socialize your site

Please join us online on Sept. 13, 1 pm Eastern (10 am Pacific) for our NTEN webinar The Social Website: Integrating Social Media into Website Design and Function to look at additional examples of sites getting social. If you have a social site to share or are curious about other examples to check out, please visit the Get Social blog.

The post How to create a more social website appeared first on Socialbrite.

MycroBurst offers readers special discount to try out service

Target audience: Nonprofits, social enterprises, foundations, NGOs, cause organizations, startups.

When I was at BlogWorld Expo in New York earlier this month, I spent quite a bit of time walking around the exhibit hall.

One of the companies I came across was MycroBurst, a marketplace that helps you crowdsource any kind of design – website, logo, stationery, T-shirt, you name it, there’s a community of designers signed up there to vie for the honor of creating your project. Similar crowdsourcing communities include crowdSPRING and 99designs (website and logo designs), uTest(software testing) and Amazon’s Mechanical Turk (data entry and verification).

Special offer for Socialbrite readers

The MycroBurst team gave me a discount code to give out as a special offer, which waives the standard $19 set-up fee for anyone who uses it. So, in essence, you can post a free project (you’ll still have to decide on the amount of your prize money, etc.) and probably get some great designs to help you along. If you’d like to take advantage this special offer, just plunk in the code B222 when you post your project.

if you have any trouble, please let me know. The code is valid through July 17, which gives you a few weeks to get a new project going.

How MycroBurst works

First, you select what kind of project you want crowdsourced and post the details along with how much of a “prize” you’re offering. MycroBurst suggests $149 as a good starting point, but if you offer a higher prize, you’re likely to get more entries. Once you’ve posted your project, a contest starts among the designers on the site to present their best idea (see examples in the main image above).

Throughout the project, you can review the entries, give feedback and then at the end of the contest select your favorite as the winner. Give the designer his or her prize money, and you’re done – probably for far less than you’d pay otherwise.

There is typically a $19 set-up fee for MycroBurst to run your contest, along with a 7.5% credit card processing fee and various options for you to select from in terms of promoting it. You can head over to the MycroBurst site to learn more about the details. I’ve seen other crowdsourcing design sites, and I really like the way this one works. No doubt the fact that Joe Witte, one of the people behind MycroBurst, took some time to talk to me and give me a demo made a difference.

Here is some other information about the site that may be helpful:

• There are currently an average of 104 concepts per project posted. A project typically lasts 7 days, unless for some reason you need to extend it.
• MycroBurst is so confident in its model that they offer money back guarantees if a logo project doesn’t get at least 30 concepts. Think about that – 30 concepts in one week – that’s  a pretty promising outcome.
• 80% of MycroBurst clients gave them a “9” or a “10” when asked if they would refer the firm to a friend or colleague (metric based on the “Ultimate Question” book by Fred Reichheld, and his “Net Promoter” question).

How to make your MycroBurst project successful

• Give good feedback to the community during the project, and give star ratings.
• Invite designers (not just the top designers, they get tons of invitations) to participate in your projects.
• Make your project guaranteed — that means someone will definitely win the prize — since it will result in 70% more concepts.

I’ve been thinking about doing not only a blog redesign but also a website redesign and MycroBurst might be just the thing for me. I don’t have a huge budget, and I’m smart enough to know that I shouldn’t try to design something myself. I’m great with concept, but the technical execution not so much.

Happy MycroBursting!

Tell us: Have you used a crowdsourcing service? Did it work for you?

The post Expert Web design on the cheap appeared first on Socialbrite.

This is a remix of a post that Stoney deGeyter published on Search Engine Guide. It was written back in September 2008 so it has nothing about Twitter, but according to Guy Kawasaki, “it’s great nonetheless.” I have to agree.

Of the 400 items, I found that most also apply to non-profit social media marketing. To save you time, I’ve listed the “must check” items below:

Domain name & URLs

• Short and memorable
• Uses keywords
• Multiple versions: .com, .org., .net
• No misspellings

Site logo

• Displays company or organization’s name clearly
• Isn’t hidden among clutter
• Links to home page

Site design

• Font size is adequate
• Font type is friendly
• Paragraphs not too wide
• Good overall contrast
• Non-busy background
• Recognizable look and feel
• Low usage of animated graphics
• Instant site identification
• Crisp, clean image quality
• Clean, clutter-less design
• Consistent colors and type
• Whitespace usage
• Minimal distractions
• Targets intended audience
• Easy to navigate
• Descriptive links
• Good on-page organization
• Easy to find phone number
• Don’t link screen captures
• Skip option for flash
• Consistent page formatting

Navigation

• Located top or top-left
• Consistent throughout site
• Links to Home page
• Links to Contact Us page
• Links to About Us page
• Simple to use
• Indicates current page
• Uses Alt attribute in images
• Permalinks

Content

• Grabs visitor attention
• Exposes need
• Demonstrates importance
• Ties need to benefits
• Justifies and calls to action
• Gets to best stuff quickly
• Reading level is appropriate
• Customer focused
• Benefits and features
• Targets personas
• Provides reassurances
• Answers WIIFM
• Consistent voice
• Web version of PDF docs available

Content appearance

• Short paragraphs
• Uses sub-headings
• Uses bulleted lists
• Calls to action on all pages
• Good contrast
• Also see How To Get A 124% Increase In Your Website’s Stickyness

Links and buttons

• Limit the number of links on a page
• Avoid small buttons and tiny text for links
• Leave space between links and buttons
• Avoid using images as the only link

About us page

• Adequately describes company or organization
• Shows team biographies
• Shows mission statement
• Up-to-date information
• Note associations, certifications & awards
• Links to support pages:
• Contact page
• Also see my post 27 Ways To Breathe Life Into Your About Page

Download a PDF version of The Best Damn Web Marketing Checklist.

As I studied the checklist (over 400 items), I realized that your non-profit or organization would get a valuable education just by going through the list. I know you guys are busy, but this is one task that will yield big returns.

Reposted from JohnHaydon.com.

The post Best Damn Web Marketing Checklist appeared first on Socialbrite.

Enhancing website accessibility from JD Lasica on Vimeo.

A few weeks back, at SOBCon busniess school for bloggers in Chicago, I met Glenda Watson Hyatt, a remarkable trainer and conference speaker who gave a presentation on how to make websites and blogs more accessible to the disabled. Glenda, who has cerebral palsy, deals with computer accessibility issues on a daily basis. I wrote about her advice on Socialbrite: 7 tips for communicating with people with disabilities.

After Glenda’s talk and one by Lorelle VanFossen, author of “Blogging Tips” — Lorelle has occasional memory lapses because of traumatic brain injury — I captured some of their advice regarding how to make sure your website or blog accessible to disabled people.

Lorelle says that fully 60 percent of all sites on the Web are not accessible to the disabled — so pay attention, yours may be one. They discuss specific steps website operators and bloggers can take to make their sites and blogs accessible, including adding simple things like alt tags, captions and underlined links.

Tips to make your site more accessible to disabled users

• Include “alt” tags (alternative descriptions) and title tags in all images and videos.

• Make your links look like links. Use colors that distinguish them from regular text and use an underline to set them apart.

• Make your body text legible. The 0.8em default on some blog platforms is just too small for millions of readers out there. Usability should be your paramount concern — not all your readers are under 30!

• Also, make sure your stylesheet permits variable font sizes. If you’re using a fixed font, older browsers don’t let users adjust text size. (In Firefox and IE, you can hit command + or – to increase or decrease the size of the text on screen.)

• Give your photos captions, so the vision-impaired can know what they’re looking at.

• Provide a paragraph of summary for your videos and audio podcasts — or, if possible, a transcript. Because search engines can’t see or hear but can only “read” text, your posts will do better in search results, too. And don’t forget to add relevant links to your post.

• Don’t use “click here” as a link. Instead, offer context about what it’s about and link the relevant words.

We made sure to launch Socialbrite with these features in mind, but if you see some shortcomings on our site, let us know!

Lorelle told of one deaf friend whose children are also deaf. “Her kids are growing up in a world filled with video, and they can’t participate.”

About one in four people on the Web is disabled in some way, Lorelle says. And yet 60 percent of all sites fail basic accessibility tests. She and Glenda will be working with @Beanfair on an “Integration Camp” to break down the able-disabled mythology.

“Let’s quit the labels, let’s quit the judging, and find the value in the human being,” she says beautifully.

The video’s lighting and sound are not optimal, but I knew there was something special about capturing Glenda and Lorelle on video together. It’s 15 minutes long.

Watch, embed or download the original video from Vimeo

Related

• 7 tips for communicating with people with disabilities (Socialbrite)

• How POUR is Your Blog? Tips for Increasing Your Blog Accessibility (free ebook from Glenda Watson Hyatt)

• Doitmyselfblog (Glenda Watson Hyatt)

• lorelle.wordpress.com (Lorelle VanFossen)

• Sue Center is a communication environment designed specifically for people who cannot use a keyboard or mouse

The post How to make your website more accessible appeared first on Socialbrite.

Guest post by Dennis Yu
CEO, BlitzLocal

Most experts will tell you not to play this risky game — your long-term strategy is to write lots of good content. If it’s good for humans, it’s good for robots. And much of what SEOs charge for is good old-fashioned webmastering.

So ask yourself these questions:

1Is your code clean? Run it through validator.w3.org and see. Search engines are finicky and fragile. Cut and paste whole content blocks and paste them into the search box to see if they’re being indexed.

2Does your site load fast? Check average load times with free external monitoring services, like host-tracker.com and spyfu.com. Could your images be reduced in size? Optimize your code to run faster and cache where possible. You want pages to load in under one second for an average connection.

3Are you using dynamic pages? Do your urls have question marks or equal signs in them ( www.mysite.org/?sessionid=123&contentid=3456 , etc…)? You can typically have one or two variables in the url, but it’s best to have static pages where you can. Descriptive urls are better for the user and can result in portions of your url being bolded (a good thing) when they match terms in the user’s search. CRM (Constituent Relationship Management) and CMS (Content Management System) vendors such as GetActive/Convio and Joomla have issues with dynamic urls but are working to make their packages SEO-friendly.

4Do you have a Flash landing page? Or perhaps Flash navigation? Search engines cannot see beyond flash, as they look only at text. Do it in CSS. Use the Lynx browser or do a “view source” to get an idea of what search engines see. Don’t put up brick walls to search engines.

5Do you have multiple versions of your homepage? For example, http://www.mysite.org and http://mysite.org), which is also known as the “canonical” issue. To prevent diluting your rank, choose one version and permanently redirect all others to that one. See Matt Cutts’ advice.

6Do you have lots of great content? One of our clients, a nonprofit with a $200 million annual operating budget, wanted to rank highly on a particular term, which was nowhere to be found on their site or sitemap. Our advice: create a page a day of unique content on that topic and over time you’ll be there in the rankings. Simple, but rarely followed. Don’t copy content from elsewhere in any significant way, as that can result in a dupe penalty or even get you banned.

7Do your page titles and tags match your content? For all the talk about how managing meta tags can magically boost rankings, the reality is that if it’s something search engines can see, but humans can’t, it will receive less weighting. It can be gamed. Yet there is still value in having page titles and meta descriptions that reflect terms that are important to you. Just don’t stuff the title with every possible keyword you can imagine. Write your meta descriptions just as you would pay-per-click ad copy — be specific and use verbs, as that is what will show under natural search results. Links between pages should also have your key search phrases — don’t use “click here” in your anchor text.

8Are you doing web analytics? Google Analytics is free and so is awstats. These programs can tell you where users are coming from, what they’re doing on the site, what keywords they came in through, and what’s driving an email signup or donation. Vendors like Lyris’s ClickTracks.com sell a more advanced product that will monitor your SEO rankings, perform A/B split tests, or even manage search campaigns, among other things. Google has other free tools like Website Optimizer, which help you perform landing page testing with ease. Many of these tools are free and easy to use, so there’s no excuse for even a small nonprofit to not be analyzing their online traffic.

9Are you taking advantage of free PPC (Pay Per Click traffic? Google offers Google Grants, which provides free ad budgets to qualified nonprofits. Yahoo has rolled out a similar program, but with limited availability. If you are a nonprofit and are not a religious or political institution, there is no reason not to apply.

We hope these 9 tips will help you drive more search engine traffic to your site. As with the 80/20 rule, you often only need implement a few changes to see significant results. Should you have further questions, feel free to contact us. BlitzLocal, based in Westminster, Colo., specializes in search engine marketing.

Disclosure: BlitzLocal hosts the servers for Socialbrite.org.

The post SEO: 9 tips for optimizing a nonprofit site appeared first on Socialbrite.