Archive for the ‘design’ Category

More homepage clicks = strong call to action

Thursday, May 10th, 2012

Want to double the number of people who click on something when they go to your homepage? Here are six steps for getting more people to click, from Bob Hebeisen’s presentation on SlideShare, who says:

“With a few clever design modifications I doubled the effectiveness of their original landing page. That means for the same media expenditure they are now driving twice as many leads!”

4 Essential Tests Before Beginning a New Website

Friday, March 23rd, 2012

Thinking of embarking on a website redesign? The smartest place to start is by asking the people who use the site what they want. Now is a perfect time to embark on a new project, while you’ve got spring cleaning on the brain. Check out our series on how to spring clean your website for a fresh start.

Here are four tests and surveys you should conduct before you launch new project.

User Needs Survey

Set up a questionnaire survey to find out what your audience thinks is most important about your website. Take their comments into consideration for your needs assessment process. What those survey questions will be largely depend on your own organization’s directives. But a question like this might help you get started.

Please rate the value of each of these features, with 1 being extremely important and 4 being extremely unimportant.

  • Ability to log on to access premium material
  • A blog
  • Video clips that demonstrate how we work

You can request a free quick and easy survey template if you don’t feel like writing your own. Make sure to leave a comments space so people can add features they think might be valuable. This is also a good time to evaluate some of your current processes, like asking people how long it took them to receive feedback or how easy it is to make a donation or pay for an item.

Web Content Test

Having an appealing design is one thing, but having readable copy is another. (Be honest: how much jargon are you using?). The web design industry magazine A List Apart puts it this way:

Whether the purpose of your site is to convince people to do something, to buy something, or simply to inform, testing only whether they can find information or complete transactions is a missed opportunity: Is the content appropriate for the audience? Can they read and understand what you’ve written?

ALA gives helpful instructions on how to test the effectiveness of your content. Examples: try some readability software like Added Bytes, Juicy Studio, and Edit Central (or even Microsoft Word’s built-in Flesch Reading Ease check), or host a moderated reading test.

Accessibility Review

A website is only useful if everyone can use it. Paying attention to accessibility is good practice for all organizations–especially since good accessibility equals good SEO–and it’s a must if you’re a government agency. You can start with these Essential Tips for Making Websites Accessible, and then you might begin a “preliminary review.”

The W3C’s Web Accessibility Initiative provides instructions for conducting a preliminary review of your website’s accessibility. In short, they recommend selecting a representative sampling of high profile pages (e.g., the welcome page) and those with different layouts and functionality, and testing just a few of those to see how well you’re measuring up.

SEO Audit

Making your website more friendly to search engines is a large but critical undertaking. The good news is any improvement you make is a good one. Schedule a search engine optimization (SEO) audit of your website with a few key goals in mind:

  • Are you using heading tags correctly?
  • Do you have a sitemap?
  • Is your content skimpy?

Check out the 9-Point SEO Checklist for more tips.

How To Hire a Web Designer

Friday, February 24th, 2012

These are the things I wish clients would ask when they’re looking to start a new project. You can use this as a punch list of questions to ask a web designer, web development agency or someone to develop an online course:

1. Do you have any case studies?

Case studies are a really great way to see what an Internet developer or graphic designer has done for another client. Good ones take you through the problem, solution and introduce the technology. We’re careful to create case studies that are framed to show how work we’ve done for one client is applicable to many. People can find case studies on our website, but they don’t ask for them enough or ask for ones that are specific to the work they need.

2. Do you have references?

It’s a little odd how many people don’t ask me for references. They should, because talking to someone we’ve actually done work for is invaluable. An outside perspective is exactly what someone hiring a designer should be looking for, too.

3. How does your process work?

I’ve worked on enough projects to know how valuable it is to have a capable person managing the process. You’re not only hiring someone who knows about the technology and design, but who also knows about how to manage a project, how to schedule milestones, and make sure deadlines are met.

4. How did you get into the web design industry?

This is an easy question that will give you an idea of how passionate a person feels about the work they do. It will also give you an idea of the values of the web developer and what kinds of hidden skills they bring to their cache of talent. It always sparks a good conversation, and anything that opens up conversation in an exploratory call helps.

Notice that nowhere on this list is, “How much will this cost?” Everybody has a budget, but without preliminary research into what a client needs, it’s virtually impossible to give a price estimate. Plus, if you’re working on a tight budget, a good development agency can help figure out how to solve problems you have rather than cut features you can’t afford. Plus, value is not the same thing as cheap. With interactive design, you get what you pay for.

Anything I missed? If there are other questions you’ve found useful in initial conversations with web designers, add them in the comments below.

Top 5 Predictions About Nonprofit Websites in 2012

Friday, January 13th, 2012

If there’s one takeaway from 2011, it’s that the economy is haywire and technology is evolving faster than an oiled bullet. In that kind of nutty atmosphere, it can be a challenge to predict what will happen to web-based technology in the coming months.

The Crystal Ball

What does 2012 hold for nonprofit websites?

We do see a few trends emerging for the next year, however. Here are our predictions for 2012 web trends. Take note for when you next talk to your web design firm about and also pay attention to so you can to succeed in your NGO or company.

1. More design for mobile devices.

Look around you. What’s in the hands of the people surrounding you, including your own? An iPad or iPhone? Nook? Kindle? Tablet? Blackberry? Everybody’s using some kind of handheld device. While corporate websites have been mobile-compliant for years, nonprofits will finally start to catch up. Want to peer into the future of mobile design? Read Mobile Web Design Trends and Best Practices.

2. App-lification of websites.

All those people with mobile devices are getting used to responsive design that they can manipulate with their fingers. Move over “point and click,” and make way for “touch and swipe.” People are beginning to expect interactive design with websites, so expect to see websites look and behave more like they came from the app store.

3. Websites focused on user experience.

Since people are spending so much time with their heads bowed over their handheld devices, they also expect to understand what to do with an app without having to guess. This means websites will be built with careful attention to user experience design (UX), in other words, built with humans in mind. Nonprofit leaders might finally understand that the less people have to think about a website, the more likely they’ll donate, sign petitions, volunteer or otherwise participate. Finally!

4. Less Flash.

We’ve long believed Flash to be big and clunky plug-in, with way too many distracting splash screens and blank spaces on the iPad. There are other technologies out there that make web movies and play on a host of devices, so expect to see more of these letters in the alphabet soup: AJAX, CSS3 and HTML 5.

5. Move to online donations.

Smart charities are already asking for money online with little more than a click. Many smaller nonprofits have been slow to relinquish check-cashing for ecommerce web design. We see some of that fear waning, and expect more nonprofits that don’t allow online donations to begin earning some electronic cash.

What do you think will be trending in 2012? Give your vote for one of these five in the comments below or tell us what you think we’ll see in the future.

[Image: Flickr user rjrgmc28]

Top 8 Places to Feed Your Inner Artist (Plus, Win a Gift Card and Travel Mug)

Friday, December 9th, 2011

Here’s a little secret: web designers like to be bossed around. Nicely. Under certain circumstances. They like to be told of your color preferences. They like to know what styles of fonts to avoid. They want to know what things you find hard to use on the web and the things you prefer to visit.

One of the worst things a web designer can hear is, “I don’t care. Just make it look good.” “Good” is one of those enormously subjective words, the way some people think cilantro is “good” – ugh. Even if you don’t think you know what kinds of design elements you like, the chances are high that what a web designer thinks looks super may not be what you think.

You really do have preferences, even if you think you’re a design noob. You just have to learn to tap into them. Then, when you go to create a project brief, you’ll have somewhere to begin.

Where to find web design inspiration

Here are a few places for finding design inspiration:

Check your stationery for branding.

If your organization or corporation already has business cards, letterhead, a logo or anything with approved colors or branding, you should look here first for design guidance.

Look through random magazines.

Flip through a few magazines at the library or bookstore and focus on the design rather than the articles. Note typefaces you like, colors, pictures, layout – anything that grabs you.

Scan your environment for cool things.

You might have unknowingly cultivated a design aesthetic through the pictures on your wall and the stuff on your desk. Look at this interesting coffee mug photo contest, where you can see the beauty in a cup of joe.

Look through image sets on Flickr.

This enormous image database has not only photographs that might spark your interest, but also all manner of design projects, products and just about anything that someone else finds inspiration.

Check the design of other websites.

Look at other web design for inspiration. Note down what resonates with you, including overall design and good logo examples, and why.

See artwork in galleries and museums.

Check out the masters to see how they use colors together and what kinds of patterns they put together. We once built a website to match the architectural style of Frank Lloyd Wright.

Check for design in nature.

Nobody does it better than Mother Nature: the colors, patterns, textures. All wonderful fodder for design.

Read a few children’s books.

Kids’ books have masterful balance, color and content. You can use them to glean some great ideas from the layout and textures.

Web design gift card and super cute mug

Contest time

Contest time

[Update! Congratulations to Linda, who won the drawing for one of the cutest travel mugs on the planet. This contest may be over, but you're still welcome to keep sending ideas for creative inspiration.]

Now that you’ve got some solid ideas of the kinds of design elements you like, do something with it.

Enter our drawing for one of these enormously cute Brewed by Talance travel mugs, and you’ll automatically receive a $150 gift card good for any new web design or update work from us. It’s part of Talance’s Customer Appreciation Month, where every week through December, we’re offering a new giveaway or contest.

How do you enter? Just add your ideas for how you find design inspiration in the comments below, and you’ll be entered into a drawing to win the mug and will receive your gift card via e-mail.

Deadline for entries is January 9, 2012. We’ll pick one winner at random from all entries on January 10, 2012 and will notify the winner via e-mail. You must leave your name and a correct e-mail address to qualify.

Enter now!

Cheat Your Way to a Professional-Looking Web Project

Friday, October 28th, 2011

Here’s a little secret many people don’t know about building projects for the web. You don’t have to do everything from scratch. There are so many tools out there that do the tricky stuff for you, that you really don’t have to be an HTML wiz to have a polished looking website.

Here are some excellent tools to help you fake web excellence:

Table Builders

Tables are the nemesis of many well-meaning web worker. They can be tricky to build from scratch, but no need with these.

Quackit HTML Table Generator

TableGen

Code-Generator.net HTML Table Generator

Color Palettes

Color theory is a practice that people spend years perfecting. But you can fake it pretty well with these tools that help you choose complimentary colors.

Color Scheme Designer

Color Schemer Online

Elvan Online

Image Generators

A few well-placed images can help bring your site to life. These three tools help you manage and create pictures to illustrate your pages.

PicMarkr lets you to add custom watermark to your images.

Digital Post It Note Generator

Create A Graph

Guest Post: Five Musts for Pictures That Pop

Friday, September 30th, 2011

[Professional photographer Morgan Ione Yeager is our guest writer today, sharing tips for making your online images better. Want more tips for using pictures on the Web? Check out Communicate Better Through Imagery.]

By Morgan Ione Yeager

Very often the simple inclusion or exclusion of a particular element can either result in a great photo or in a great photo gone wrong. Here are some details to pay attention to while choosing the photos you upload to your website or use for other media. Also, learn some simple tricks to capture better images in the first place and therefore cut down on editing time.

1. The man who grew a pole out of his head.

Are you looking at the chef or the pole on his head?

Are you looking at the chef or the pole on his head?

This one is really common. Once you start looking out for this you will notice it all the time and it will drive you crazy! Be aware of any kind of vertical or horizontal line that is in the background and behind a person’s head. It can create an odd intersection or look as though person has a weird protrusion. Most often this happens with street poles/signs, door frames or tree branches.

2. Remember that bright colors draw the eye.

If the subject of the photo is in the center of the image, then that’s where you want the viewer’s eye to go … not to the person wearing a bright red shirt in the top right corner. Often a simple crop can get rid of distracting peripheral objects or people.

Flash spots are also something to look out for. Generally taking photos of people in front of mirrors or glass can leave you with a blinding white spot, which is very distracting. Professional photographers know how to manipulate light and use off-camera flashes that make these kinds of photos successful.

3. Don’t amputate your subjects.

The father of the bride is cropped at his wrist.

The father of the bride is cropped at his wrist.

This means try not to crop people at their joints. If you crop right at someone’s elbows, knees, neck, wrist, etc. it can often look very awkward.

A better crop, cropping them both mid-thigh.

A better crop, cropping them both mid-thigh.

4. Frame the image.

The vertical edge of the viewfinder was lined up with the vertical edge of the beach sign resulting in a straight and balanced image

The vertical edge of the viewfinder was lined up with the beach sign for a straight and balanced image

If you are taking a photo, try to frame the image by lining the vertical edge of the viewfinder up with something vertical you see through the viewfinder. This will create a more balanced image and will simply look more professional. If you are working with photos that are already shot, use the rotate and crop tool in your editing software to straighten the image. Again, use vertical and horizontal lines to gauge how straight the image is.

5. Simpler is often better.

Morgan-Ione-Photography---b

The photo has been cropped to eliminate the clutter and make the pole less obvious.

If there is too much going on in a photo it can be confusing. The viewer’s eye wanders restlessly, unable to find a place to focus or settle. Be aware of unnecessary props, extra people, any non-essential subjects or objects. Often cropping a bit tighter on the main subject can help.

About the Author

Guest blogger, Morgan Ione Yeager of Morgan Ione Photography, is a professional photographer based in New York. She specializes in shooting people, food, interiors and travel images. She travels all over New England to shoot for online and print publications, small businesses, restaurants and events.

View her portfolio and blog at:

morganionephotography.com

morganione.blogspot.com

Web Design Tips for Better Images

Thursday, September 1st, 2011

[This appeared in our July newsletter.  Subscribe now so you get monthly tasty tech tidbits and special deals.]

The more you pay attention to images, the better your website will be. Good graphics make the difference between a webpage that attracts and one that repels. Here are a few essential graphics tips you can follow to make your whole website better:

1. Save photographic images as JPG and save illustrated images as GIF. Learn more about GIF vs. JPG.

2. Make sure your web graphics are saved as no more than 72 dpi. That’s the standard compression for the web. Anything bigger means slow loading. Learn more about optimizing images from The Comprehensive Guide to Saving Images for the Web.

3. Don’t use HTML to set the width and height. Instead, resize the picture to the appropriate dimensions. Doing otherwise will make your page load slowly and could skew the look of the picture. In other words, if you need

<img width=”200″ height=”200″ src=”boat.jpg” alt=”sailboat” />

then your image (boat.jpg) should be 200x200px rather than a scaled down 500x500px image. Just like this perfectly sized pic:

boat

Here are more tips on web design from the Talance blog:



20 Free Icon Sets for Non-Profits

Monday, August 15th, 2011

The quickest shortcut to making your website look polished is to use icons. These little pictures, plenty of which are cheap or free, look way better than anything most mortals can do with Photoshop. A little pop of color, used judiciously, can help bring life to bland webpages. Coordinated sets of icons also make pages look like you put a modicum of thought into how the out-put looks. And, importantly, visitors are more likely act based off a compelling picture rather than a chunk of text.

So stop snagging any old picture off Google Image Search (naughty, naughty!). Here is a list of free icon sets guaranteed to make any non-profit’s webpage better, whether you’re into donations, social media, activism, environment, or health and human services. Have you seen anything I’ve left off? Leave a link in the comments.

Donations

Donate Now Buttons

Donate Now Buttons

Donate Now Buttons

Festive Donate Buttons

Festive Donate Icons

Festive Donate Icons

Open Source Icons (including money icons)

Open Source Icons

Open Source Icons

Themed Fundraising Buttons for Email

Themed Fundraising Buttons

Themed Fundraising Buttons

Credit Card and PayPal Icons

Credit Card Images

Credit Card Images

Social Media

Vector Social Media Icon Set

Vector Social Media Icons

Vector Social Media Icons

Scribble Social Icon Set

Scribble Social Icon Set
Scribble Social Icon Set

WG Social Media Icons

WG Social Media Icons

WG Social Media Icons

Double J Social Media Balloons

Social Media Balloons

Social Media Balloons

Buddycons

Buddycons

Buddycons

Health and Human Services

Fruit/Food Bank Icons

Paradise Cherry Icons

Paradise Cherry Icons

Education Icons

Bitty Education Icons

Bitty Education Icons

Jana free baby icon set

Parenting/baby icons

Parenting/baby icons

People & Disability Icons

People and Disability Icons

People and Disability Icons

Medical Toolbar Icons

Medical Toolbar Icons

Medical Toolbar Icons

Environment

Environment Icons

Environment Icons

Environment Icons

Ecology Icons

Ecology Icons

Ecology Icons

Recycling Icons

Recycling Icons

Recycling Icons

Weather Icons

Weather Icons

Weather Icons

Water Icons

Water Icons

Water Icons

Activism

Endangered Animal Icons

Endangered Animals

Endangered Animals Icons

Sign Up Petition Icon

Sign the Petition Icon

Sign the Petition Icon

World Flag Icons

World Flag Icons

World Flag Icons

Military and War Icons

War Icons

War Icons

Multi-ethnic People Icons

Multi-ethnic People Icons

Multi-ethnic People Icons

Save Your Sanity AND Get the Logo You Love (Yes, You Can!)

Wednesday, April 20th, 2011

Maybe your logo started with a clever idea you once loved, but now seems … well … hokey. Or it was something that no one on your Logo Procurement Committee absolutely hated. Or (this is the most likely scenario) you were over-rushed, understaffed, underfunded and that piece of clip art worked just fine, but now you’re still using what was meant to be a placeholder.

Whatever the reason behind having a look that doesn’t fit your organization comfortably any more, you know when it’s time to update. Just sprouted a couple gray hairs thinking about embarking on the process? Deep breaths. You can get through an image rebranding without rehashing past mistakes or subjecting yourself to the pain of collaboration. Invest a little time up front to think clearly about what you need out of a logo and what it should do, and the rest will come. Trust me; we do this all the time.

Of course, deciding that you need a new look is easier than deciding what it should be. The key is to think critically and logically. When Talance takes on a new project, we pull out a set of trusty checklists and run through them with our clients until we have a good idea of likes, dislikes and needs. Only then do we start thinking about creating a new image.

If you’re thinking about having a new logo designed in the near future, start now with solid planning. Start with the items below (you can bookmark this article and use it as a checklist), and when you begin on the logo design process with a designer, you’ll be that much close to having something you love and that works for you.

Peg the decision-makers.

If possible, peg just one decision-maker. Nothing kills progress and creativity more efficiently than a committee. Pick the chief to sign off on ideas, or – if you must – co-chiefs. It helps if they’re buddy-buddy, though, and can work together well.

(Can’t get by without a committee? Try this strategy guide.)

Know your audience.

I know, we’re always harping on about audiences in this blog. But you can’t hope to reach the people you really need to reach if you don’t know who they are. The over-50 crowd doesn’t respond to the same images as the under-20 crowd does. Dig up some demographics.

Work on your elevator pitch.

Can’t describe what your organization does in the time it takes to ride from the lobby to the fifth floor? Get to honing. Your logo will be a graphic representation of your work and must be communicated quickly and efficiently. You must be able to describe what you do succinctly in words before that can be translated to art.

Know your goals.

Seeing a trend here? You have to know what you want before you ask for it, and this includes knowing why you want that new logo. Is it because you want to appeal to a different cross-section of people? Do you need something that works better in print? Do you want to represent yourself with a new tone? Note your goals, and then prioritize them.

Find inspiration.

Copying is a no-no with logo design (and any designer that doesn’t respect that should be avoided!), but inspiration is a different matter. Start noticing colors you like (or need), typefaces that speak to you, patterns that catch your eye. Keep a folder of examples or even carry around a digital camera to take snaps of winning ideas. It can help push your designer in the right direction.

You can start with 30 Typography Focused Logo Designs and 70 Latest and Creative Logo Designs for Design Inspiration if you need some inspiration sources.

Find anti-inspiration.

This is arguably the easiest part of any logo design project: noting what you hate. I’m not sure what this says about humanity, but talking about your hates comes remarkably fluidly. It’s helpful too, because if you say so early in the project, you’ll help your designer steer away from what you can’t abide.