5 Website Design tips for Nonprofits January 4th, 2011

Many nonprofits suffer from low budgets. But there are many things you can do incrementally to quickly improve your website’s effectiveness.

Make the site User-Friendly

Just as with any site, nonprofits should follow the basic guidelines for web design. Ease of access and navigation are as important as visual aesthetics. It is also important to make the site media friendly, an easy information site for journalists. Contact information should be accessible and downloadable images can help with cohesive media coverage.

Good Content Informs and Energizes

The organization’s main purpose should be immediately apparent. Why should the user be donating or volunteering? It is important to list out the goals of the organization ahead of time and work with these priorities as guidelines. Some organizations have different departments and people heading those departments.  Have each write the content for their respective department so that the best description is captured.  Great images will always enhance your message. Every image should help tell your story to get the most emotional connection for your cause. Videos are an even better way to show programs in action. Even simple image animations can be informative and engaging.

Ask and You Shall Receive

The most common goal for nonprofits is to raise money for their respective causes by appealing to donors. Tastefully but directly show how easy it is to make a donation with a button or donation area in plain sight on every page. Using direct messages like “DONATE NOW” will be more effective than passive language asking for donations. Other Calls to action can include applying for a grant, attending an event, opting in to various communications channels (Facebook, Newsletters, Emails).

Mobilize Your Army of Volunteers

Another target to keep in mind are the volunteers. Use call to action terminology like “Take Action” or “Ways You Can Help” to prompt users to act.

Social Media Was Made for Nonprofits

  1. Social media users are always looking for good content to share.
  2. People are more likely to respond (donate, volunteer) if they know you.
  3. Viral social communication can reach exponential numbers.

Maximize your social network by incorporating social tools everywhere. Let users promote your content via “likes”, “tweets”, and “shares”. Banners, and widgets that link back to your site can be made available for others to install on their own sites. Letting users comment on content also creates a strong engagement bond.

Quick Takeaways

  • Create a newsletter to keep people up to date with your organization. Be sure that signing up for a newsletter is easy and accessible.
  • Include a news/blog section to show that the organization is a living, breathing thing. It will keep people up to date with stories and news directly from the people volunteering and projects being put in place. Updating this often will help keep the site alive and people interested in what you are doing as an organization.
  • It is important to “keep it real” and not come off as a business. Yes, nonprofits are businesses in themselves, but they are in the business of making a difference. People want to know that their money is going to something meaningful.

What web design tricks have most helped your nonprofit business?

Tags: , , , , ,
Posted in Uncategorized | 3 Comments »

Co-branding December 14th, 2010

What is the importance of co-branding and how should it be used? Watch this brief video to learn a few quick tips from Metropolis.

Tags: , , , , , ,
Posted in Uncategorized | No Comments »

Navigating Navigation October 27th, 2010

Website navigation needs to be simple, easy to use, and intuitive — you don’t want your viewers to have trouble finding their way around. When navigation is too complex, they often tend to abandon the site altogether, which can result in negative sales or marketing for your brand. A good website navigation design can help keep these visitors on your site.

One of the first steps in website design is deciding on a method of navigation that reinforces and does not distract from your site’s purpose, CTA (call to action), or product. There are numerous types of website navigation to choose from, and it can be difficult to know if you are choosing the right one for your site. In this guide, I’ll cover some of the most popular methods of navigation to make this decision a little easier.

Types of Website Navigation

If your site is on the smaller side… Standard Navigation Bar
If you want to display a lot of navigation information at once… Mega Menu
If you’d like your navigation to be more graphic… jQuery Script Navigation

Standard Navigation Bar

A standard navigation bar is the type of navigation you are probably most familiar with. It’s what most websites use for displaying a small amount of information. A standard navigation usually appears horizontally across a page or vertically in a sidebar. Links usually feature a “roll-over” state, wherein the appearance of a link will change when a visitor holds his or her mouse over it. Sometimes, a drop-down navigation is incorporated to allow related links to be shown alongside (or under) a main link. Standard navigation bars are usually constant across all pages of a site, and allow a visitor to quickly access information without a change in the interface. This is the most “expected” type of navigation; there’s something to be said for immediate understanding.

Pros:
Doesn’t take up much real-estate on a page
Offers a compact use of space

Cons:
Doesn’t allow for extensive navigation
Visitors may become confused or frustrated by drop-down animations
Some drop-down animations may not be cross-browser compatible

Example:
Marathon Physical Therapy
Marathon Physical Therapy

Mega Menu Navigation

A large drop-down/popup menu allows for a huge amount of sub pages to be displayed along with additional information or design elements. Commonly used in retail or with companies with larger service offerings. Mega menus can be designed to act almost as sites-within-sites.

Pros:
Lots of links are shown at once for easy reference
Can include other text or even images
Eliminates need for a third level of navigation

Cons:
Menu can become too big, and can actually be larger than the user’s browser

Example:
Altran Control Solutions
Altran Control Solutions

jQuery Script Navigation

A light-weight, cross-browser alternative to Flash animations, jQuery is a JavaScript library that interacts easily with the code on your site. It allows for images to be added to your navigation without sacrificing load time. jQuery can be used to create many kinds of animated navigations that pair text with images, expanding upon categories or showing multiple subjects of links. To learn more about the wide world of jQuery, read our blog post on the subject.

jQuery is commonly used to create sliding navigations. These can look like embedded slideshows (with moving images and/or text) or can dynamically expand an otherwise standard-looking sidebar navigation (called an accordion slider). An accordion navigation features a group of sub-navigation links that are hidden in a collapsible panel. This sub-navigation is revealed upon roll-over or click of a main navigation link. Usually, only one panel is allowed to open at a time, but this can be modified to allow multiple to open at once.

Pros:
Can add interest and movement to a site
Can give a page a simple and effective “upgrade” with included animation
Keeps information easily accessible, without the need for scrolling

Cons:
Could hide information that should be displayed constantly
Care must be taken to assure cross-browser compatibility

Example:
US Pavement
US Pavement

If your site has a more unique structure (if it has many pages-within-pages, or if you’d like your visitors to be able to find specific information quickly) there are other types of navigation available to you. As always, we can help you decide what type of navigation is right for you, whatever your unique needs may be.

Tags: , , , , , , , ,
Posted in Uncategorized | 1 Comment »

CTA’s and Target Audiences February 19th, 2010

Most websites we’re called in to redesign suffer from two main problems. They aren’t speaking to their target audiences and they don’t have the right Call-to-Actions.

Target Audiences

Mistake number one — referring to your target audience in singular form. Multiple target audiences require multiple messages. Can you do that on a single home page? Of course you can. That’s where the design comes in.

Example #1: A startup company is trying to sell their product or service, but also wants to look attractive to investors. If you showcase your product or service in a way that’s easy to understand, and the site looks high-end and professional, then you can accomplish both.

Different target audiences think differently. Different areas of a home page can communicate differently. In fact, they can actually be very visible to one audience and be practically invisible to others.

Example #2: A college website targets (among others) incoming students, parents of incoming students, guidance counselors, current students, and alumni. Incoming students may be focused on campus life and programs of study. Parents may be focused on facilities, safety, and financial aid. Guidance counselors (who help recommend colleges to students) would probably be focused on all of the above. Current students may focus on events and social sharing aspects of the site. And alumni want to see their Alma Matter growing both physically, as well as read about successes of other Alumni.

A successful website design will prioritize the audiences, and then the messaging. Most, if not all of the elements mentioned above can be included on a college’s website in an organized way. Prospective students will look at the photos and people first wheras Alumni might go to the news block first. These areas can be side-by without detracting focus from each other.

CTA’s

The Call-to-Action is a message directing the user to do something. Some sites have none. Others have a simple “Call us today”. A more targeted message will lead to more conversions. Rather than “Call us today”, how about “Contact us today for a free 30-minute consultation”. Consider changing the copy on submit buttons under forms from “Submit” to “Sign me up for my free trial.” If you are speaking to different audiences, then pay attention to the different CTA’s as well.

Spend a little time up front thinking about what your target audience needs. Answer your audience’s questions before they think to ask them, and conversion rates will go up. How does your site measure up?

Tags: , ,
Posted in Uncategorized | No Comments »

Does Your Website Pass The 4 W Test (In 4 Seconds)? August 16th, 2009

website usability 4 W TestWebsite design is an art. Website development is technology. Often the two don’t connect on a site. Great websites combine layout, imagery, and type with technology to deliver clear, concise and compelling messaging.

Stop reading for 4 seconds. Take a look a your (or any website). Put it to a test.

The 4 Second, 4 W Test:

1. Who are you? Is the logo or company name legible and prominently placed?

2. What do you do? What’s your message/tag line? Short and to the point — quicker than even an elevator pitch. Avoid marketing jargon and boil your unique value proposition down to a few engaging words.

3. Where. Hello SEO! Let search engines know where you are by listing your industry or target audience specific key words. Hint: This will also help convert viewers to buyers.

4. When should I do anything with the info I just learned? Umm, today please! Add a prominent call to action. Get started now. Contact us today. Have a rep contact me now. (Add your phone # and an email address here too!)

Time’s up! Did the site pass the 4 W’s, or after 4 seconds were you left wondering who, what where and when? But wait, there’s more! Did you have to wait for a huge or ugly flash animation to load, or even worse, an annoying talking website actor barking about quality, comfort and price?

Actually, your site might not be that bad after all. Website design and development were divorced before before starting the Rocky Creek ATV Trail site.

So, what sites have you seen that don’t pass the 4 W test (reply via comment box below)? I could list 10 in 10 minutes. Don’t get me started.

PS. Give your site a second opinion. A Metropolis Creative designer will put your website to the 4 W Test and reply with results to see if you make the grade. Send an email with “4 W Test” in the subject line to: manager@metropoliscreative.com.

Tags: , , , , , , ,
Posted in Uncategorized | 2 Comments »

“Social” Isn’t a Tool June 29th, 2009

Search Engine MarketingOne question I’ve been asked a lot recently is “what’s going to be the next Twitter?” The quick answer is, it doesn’t matter. I know that sounds flip but hear me out before you think I’m just another social media basher (you’ll know this is not the case if you read my blog). I say “it doesn’t matter,” not because I don’t love Twitter and all the other social networks but because it assumes that the concept of “social” can be limited to a single tool.

To that end, comparing the phenomenon of “social” to a tool is somewhat akin to thinking that a good website is strictly about a great logo or a slick header graphic. Obviously those things help but they aren’t the end all to be all. It’s the concept of great usability and design coming together meeting the needs of a stated business objective that makes a site great. Oh yeah, the site damn well better meet the needs of the customer too. Otherwise, you’re dead in the water.

Getting back to my rant about Twitter and why limiting “social” to the category of a “tool” is such a pet peeve of mine… Well, it’s not dissimilar to thinking that the discipline of marketing could be confined to just e-mail or advertising. While some companies might concentrate their efforts on a particular tactic, most good businesses also leverage other tactics to help accomplish their goals. They also realize that at the end of the day, “marketing” isn’t limited to one tool because it’s a more about a philosophy and a thought process than it is a bunch of tools.

The difference between good marketing or even site design is that while “social” can be important to helping a company get in touch with its customers, it can also be a transformative power within an organization helping companies:

  • Share ideas — both internally and externally
  • Co-create with its customers
  • Energize its customer base by creating a launch pad for word of mouth marketing
  • Deepen loyalty and increase referrals by giving customers something of value

I guess the next time someone asks me what the next “Twitter” is, I’m going to tell them that it’s the wheel, or the printing press. Or a turbine engine. Or the Internet. Maybe then they’ll start to think about this brave new world of “social” as something more than just a tool.

So how does your company describe “social?” Let us know in the comments — just do me a favor and don’t use the “T” word.

Tags: , , , , ,
Posted in Uncategorized | No Comments »

An Extreme Website Makeover Event in Boston — Move That Mouse! March 29th, 2009

Extreme Website Makeover BostonSo what’s the connection between a website and a party? Consider your website as your brand ambassador — your host/hostess — smartly dressed but not over flashy. The overall theme is decidedly trendy but not so funky that it will become dated tomorrow. Can people find you (the host) and your location? (Note how many times this week you can’t find a phone # on a website). Then there’s content, your community and the conversation. Plan ahead. Match your theme to your attendees.

Join your peers and industry leaders Wednesday, April 29th from 6:00 – 8:30 PM at 28 Degrees in Boston to see what site deserves an Extreme Website Makeover!

I promise not to shout MOVE THAT MOUSE! But, I will do a before and after presentation to show how the winning website has:

• Branding — serves as a brand ambassador — a party host per say!
• SEO features — keywords and design to attract and wow a crowd
• Call to action — lead capture tools; ways to draw an audience
• A RSVP or more info spot
• Means to get the buzz into the community

These aren’t just nice things to have in a good web site design, they are required. So why do so many web sites fail? Why are so many parties boring? Because web technology, search, and social networking have rapidly changed the overall marketing and community landscape.

Keeping up with the latest technology requires constant effort. For example, when you scroll down a page, you move away from the navigation bar. To solve this usability issue on our blog, we found a nav bar that follows you down the page. Although there are multiple solutions for this, we chose one that has a smooth sliding movement — like a Travolta move (on most current browsers) and stays in a fixed position on older browsers.

“Search” is the hip party term for all things relating to Search Engine Optimization. Making your site searchable goes much deeper than just getting found. With concerted effort and smart design, you can get your company cataloged, linked to, and talked about. Searchability really is key. This can be done by carefully planning the hierarchy of content, and by using keyword-rich typography as a design element. Good design firms optimize the back-end code for search and include unique keywords on page titles. Extraneous code is separated from the main pages to allow for easier indexing of content by search engines. (See some upcoming trends on the Search Engine Journal blog.)

Social Networking blends both technology and search into an additional network of interactivity and community. (Read Bob Cargill’s post: Five Important Questions to Ask Yourself Before You Use Social Media) To start with, social networking helps your company on a brand loyalty level. Customers who “belong” will not only promote your brand, but will protect it as well through blogging, comments on other blogs, and recommendations. Social networking is also viral. So the more people who are in your network, the faster (exponentially) you are able to broadcast your message. And social networking offers opt-in subscription models to ensure that people who want to hear from you never miss your message.

Usability is often overlooked in favor of fitting all the “right” content on the page. Of course you have a lot to say, but you need to show restraint in your message. Say only what you need to in order to get the desired response. Other usability factors include section titles, navigation options, and e-commerce paths. Make it easy and quick for your users. Give them a positive experience so they talk about you and come back for more. Note to self: When is our next party?

Call-to-Action — What are you trying to get your site visitor to do? Buy a product? Download a demo? Sign up for a mailing list? Call you on the phone? Whatever it is, it should be everywhere and prominent. Stay focused on the call-to-action. The purpose of your web site may not actually be to educate the user about your product, but to get them to buy it. Educate only as much as you need to achieve that goal.

You’ll see what I’m talking about on April 29th. One lucky organization will be selected for a homepage redesign, social media PR makeover and email marketing offer. In front of a partying crowd of marketers, social media makers and my peers, I’ll show you a quick before and after presentation. Complete with gratis martinis and tasty apps. Networking and tweeting is optional! Sign up here!

Tags: , , , , , , , , ,
Posted in Uncategorized | 3 Comments »

How Much Is Your Web Design Hurting Your Business? March 9th, 2009

Web design monsterThere are over 182 Million web sites out there according to Netcraft. So what makes your site findable, usable, and effective? A good web site design should have three basic things on every page: search engine optimization, a good user interface, and a strong call to action. If your web site doesn’t focus on these things, your target audience will just move on, or not find you at all.

Search Engine Optimization
This is a huge topic, but I’ll talk about some web design basics.

  1. You need a list of key phrases. If you are a web design company, “web”, “design”, and “company” are horrible keywords. But “web design company” is a good one. Think about key phrases as opposed to words. Include your city in there as well. The more keywords you can come up with, the better.

  2. Target the keywords to your pages. You can’t effectively target more than 5 keywords per page. Three is a better number. Start with the page title bar. Use your keywords there, and then in the copy of the page. Links using keywords are great, too. Instead of saying “See our web design work here” use “See our web design work here“. Lastly, take a look at your copy, and see where you can inject your keywords more often. You need to balance effective communication with adding additional keywords, but it’s usually not that hard, just time consuming.

  3. Code the site correctly. A good web designer will use HTML searchable text, not text in a graphic. True, you can’t get too crazy with fonts this way, but findability is more important than how it looks. And there’s a lot you can do with HTML fonts anyway. Images should always have ALT tags, with keyword-rich descriptions. Headlines using tags hold more weight then body text. And if you can get keywords into the actual file names, that’s even better.

A good User Interface
This obviously starts with an easily understood nav bar.

  • Navigation is expected either on the top or the left side of the page. If you deviate from that, it will be harder to find. Don’t forget that most web surfers are still a bit technically challenged.

  • Keep the navigation options to the minimum. The more options you give someone, the harder it is to choose

  • Buttons should look like buttons. And if it isn’t a button, then don’t make it look like one. (Sounds simple I know, but we’ve all clicked away on that thumbnail image waiting for it to do something… waiting… grr — not a button.)

  • Wording on the buttons needs to be obvious. Don’t put product names on buttons. They make sense to you, but not to your visitors. Also, don’t get cute with titles like “The Team” and “Home Runs.” What does “Home Runs” mean anyway?

  • Don’t forget that the user interface includes proper labeling of areas of the page, including the name of the section that you’re actually in. A depressed button usually isn’t enough to tell you where you are.

A Strong Call to Action
What’s the point of your web site? Is it for lead generation? Or are you selling a product? There should always be a call to action on every page if you can. The top right column is ideal for this for a couple of reasons. It’s usually space that’s available, and it’s where people expect to see an important announcement. Make your call to action prominent, and you’ll see an increase in action.

What’s interesting, is that all of these things can usually be done to a web site without requiring a complete redesign. If you’d like an analysis of your site’s effectiveness, post a comment below and we’ll check it out!

Tags: , , ,
Posted in Uncategorized | 1 Comment »