January 27, 2012

5 tips to help you create visually stunning websites

Image by Angela Waye for BigStock

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. Continue reading →

July 21, 2011

How to create a more social website

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:

To build followers within the nonprofit’s social media spaces
Create on-site engagement
Develop a sense of community on the website
Raise funds
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:

Show
Share
Interact
Co-create
Authenticate
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:

Show – Recent Tweets, Likes, Comments
Share – Like & Tweet Button, E-Card, Fwd to Friend
Interact – FB Live Stream, Hashtag (Tweet Chat), Comments
Co-Create – Shared Content: Mapping, Mosaic, Wiki, Links, Games
Authenticate – FB Login, Twitter OAuth
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. Continue reading →

June 21, 2011

Expert Web design on the cheap

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).

mycroburst logo 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. Continue reading →

August 26, 2009

How to make your website more accessible

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. Continue reading →

June 30, 2009

SEO: 9 tips for optimizing a nonprofit site

Search Engine Optimization isn’t black magic, so get your site to shape up

Guest post by Dennis Yu
CEO, BlitzLocal

Dennis Yu, SEO expert

Most people treat Search Engine Optimization (SEO) as black magic. While there are unethical methods to inflate your search engine rankings — cloaking, doorways pages, link farms, “google bombing,” dupe content poisoning, keyword stuffing, and so forth — these tactics are short-lived and can even get you banned. Folks who employ these tricks (also known as “black hat SEOs”) are in a cat-and-mouse war with search engines, as loopholes are being exploited, found and closed.

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.

Continue reading →