Web Site Design & Development

Read Our EnewsletterTell Us How We Can Help You
   
You need to upgrade your Flash Player
Aware InSites


Ten Tips for Design That Inspires Action

Every website has a purpose. Maybe you need your website to persuade users to provide contact information as a method of lead generation. Maybe you’re just trying to get the word out and supply users with information in a format that is fast, efficient, and relatively inexpensive. Or maybe you’re simply out to earn a buck by selling your company’s products online. 

No matter what action you’re trying to coax out of the users of your website, there are certain things you can do to influence them to complete your objectives, or at least to guide them in the right direction.

The “call to action” should be the most important element on each and every web page if you want your website to fulfill its purpose. A call to action can be as simple as a Check-Out button, an online form for gathering information, or just a phone number with an invitation to call. Whatever the case may be, here are ten tried-and-true design tips to inspire action in your online customers:

1. Avoid Clutter and Embrace White Space
Colorful imagery and eye-catching graphics sure can be impressive, but users are harder to impress when they are focused on finding specific information or trying to achieve a particular goal. White space is your friend. Resist the urge to fill up every area of blank space on a web page, even if you think the extra content you’re adding is relevant.  Instead, use the white space to draw focus to your call to action. Don’t fret, we aren’t advocating sparse white pages with plain black text, but be prudent with your graphics. Don’t be afraid to use imagery, just use it sparingly, and always make sure that the imagery on your page relates to your primary user objective. Helpful telephone or shopping cart icons are good examples of relevant visual cues. Just remember, any unnecessary imagery or content can distract a user, which only serves to give them one more opportunity to lose focus and abandon your site. As long as we’re talking about focus…

2. Have a Visual Focus
A dominant headline, a detailed photo, or a useful, iconic button work well individually. Use all three together and you’ve got a headache-inducing hodgepodge and a lack of focus. While the headline, the photo, and the button may be great in and of themselves, giving them equal emphasis will ultimately end up canceling them all out.  If a product image is your most important element on a page, then make sure a fancy header graphic, or an animated banner advertisement isn’t overshadowing it. Focus on whatever element benefits your call to action the most, and stick with it across your entire site. Speaking of sticking with it…

3. Consistency is Key
The human brain is trained since birth to follow patterns and is a slave to routine.  Keep the brain in its comfort zone by being consistent with colors, font styles, and – most importantly – page layout. The more consistently laid-out your website is, the more natural it will be to navigate. The easier the navigation, the more successful users will be in fulfilling your call to action. Don’t alter layouts from page to page; don’t move around or hide your navigation; and try to keep your call to action in the same place on each and every page. Allow users to anticipate how each page is going to look by maintaining a sense of site-wide consistency. Users prefer having their expectations met to being surprised with every click.

As for fonts and colors, choose no more than two contrasting fonts for graphic headers, page titles, and pull-quotes, preferably one serif and one sans-serif font of varying thickness. You shouldn’t need any more than that regardless of your content. Also, choose one reasonably sized HTML font for text, usually between 10 and 14 pixels tall, and don’t be tempted to use larger fonts for your more important messages. Instead, simply reserve bold text for those occasions. The same goes for colors: choose a couple brand-distinctive colors and one neutral background color and try not to stray from that palette or you might overwhelm the user’s delicate sense of good taste. But there is one exception to that rule…

4. Dedicate a Color to Important Action Elements
The first thing a user does upon accessing your website is scan the page for what they consider to be relevant information. This is your first chance to draw their attention to your call to action. A good way to catch their wandering eye is to reserve a dedicated color for important action elements, preferably something vibrant and bold that contrasts with the rest of your site design. Red is often a good choice, but it really depends on your overall color palette. Also use color to connect other recurring themes on your website, but try to keep your dedicated action element color reserved for those special occasions where you really want to draw the user’s attention. Remember, each page needs to have a focus. Less is more. Which leads us to page content…
 
5.  When It Comes to Content, Less is More
Short, focused content is of utmost importance. Get the details out as fast as possible. At the risk of making a broad generalization about the state of education today, the simple fact is that people don’t like to read. Especially on the Internet. When it comes to laying out content, keep it short, to the point, and preferably outlined in bullet points rather than in traditional paragraph form. Take this article for example: how inclined would you be to read the details if they were not laid out in an easy-to-scan list? If you must use paragraphs, keep those users with short-attention-spans in mind and at least supply some pithy pull-quotes. Also, stay away from wide columns of type as they are difficult to read on high resolution monitors.  If no matter how hard you try, you’re still unable to pare down your online content, then…

6. Make the User Click for More Info
Don’t drown your users in details they don’t want. Keep pages short and brief. At the same time, we understand what a great resource the Internet can be as a repository for detailed information. If information exists, you can bet there is someone out there looking for it. So utilize the functionality of the web and add “click for more info” links wherever you think that the information is straying beyond the general. That way, people uninterested in the smallest details can quickly achieve their goal and get on with their day, while the Type-A personalities can relish in the details with one simple click. And don’t worry about the fallacy that users won’t click more than three times to find the information they are looking for. Research has shown the users will click indefinitely as long as they think they are on the right track. How do you make users feel confident that they are on the right track? One way is to…

7. Follow Internet Standards
Sure, sometimes it’s good to stand out in a crowd, but when it comes to the Internet, users have expectations. For example, they expect to find their primary navigation across the top of the page or vertically down the left side. And they look for information and scan pages in a fairly predictable order: generally it goes top, middle, left, right, bottom. You may wonder why the most popular and successful sites have similar layouts; it’s because users have become accustomed to that format, and it works. Laying out a page in any other way breaks away from Internet standards, which undermines user expectations, and risks making the user dizzy. Speaking of making users dizzy…

8. Avoid Movement or Animation
You might think that animation and fancy Flash images attract attention, but in fact, the opposite is true. People avoid looking at animation like it’s the plague. They either assume it’s an advertisement, or they are internet savvy and avoid it on general principle because they know that animated graphics are the mark of a novice. And as long as we are openly discussing the user’s tendency to judge the professionalism of a website’s design, we may as well just cut to the chase and recommend…

9. Have a Professional Design Your Website
What people really want to feel is secure, and we aren’t just talking about secure servers and encrypted personal data. People trust the appearance of stability and dependability that a professionally designed website can provide. Don’t just casually toss the design of your website into the lap of your company’s IT department or your aunt’s cousin’s son who is studying computer science at college. Your best option is to hire a professional who understands the above recommendations that are specific to the web as well as the general fundamentals of layout and design. On the other end of the spectrum, don’t spend your annual advertising budget on an avant-garde or cutting edge website. Too far off the beaten path can often be more intimidating than impressive. For an example of how simple site design can be more successful, just visit Amazon.com, which is also a good example for how to…

10. Simplify Your Processes
Imagine yourself at your favorite local discount chain store. You have a tube of toothpaste and a credit card, and you’re ready to commit to a purchase. But you can’t find the cashiers, and when you finally do, the line is around the corner. Even more frustrating, when your turn comes at the check-out, they ask for your middle name and a daytime phone number. Then, in an attempt to squeeze out every last drop of patience you have, they attempt to sell you an extended warranty or fancy gift-wrapping. You wouldn’t put up with this in a store, so why would you expect users to put up with it online?

Avoid user frustration by supplying a link to the shopping cart and checkout process on each and every page, perhaps highlighted with your dedicated action element color. We’ve heard the statistics a thousand times: the majority of online e-commerce transactions fail or are abandoned. It sounds dire, but users are fickle and can get frustrated to the point of abandonment in a millisecond. Don’t ask for information unless you absolutely require it, keep add-ons and up-sells to a minimum, and if you can manage it, don’t require a user to register or create an account just to make a purchase. Just the sight of a complicated entry form can discourage a user. The faster you can get them to that “confirm your order” button, the better.

So there you have it: ten tips for design that inspires action. And that’s just for starters.  The best thing you can do to understand how design can inspire action is to simply pay attention while surfing the Web. What draws your attention? Which websites can you hardly stand to look at? What stops you from completing an action?  And take notes, because web trends change daily, and you don’t want to get left in the dust.

If you have any comments or questions about any Aware InSites, feel free to contact us at info@awarewebsolutions.com or call 800-783-8919.

Featured Resources

Web Design & Review
Site critiques and web design community forum

A List Apart
General web design and web trend topics

User Interface Engineering
Usability tips and articles

Lynda.com
Good resources for learning internet tips and standards


Get Aware InSites sent right to your inbox as we publish them!

Email Address:   

First Name:  

Last Name:  




© 2008 Aware Web Solutions, Inc. • PO Box 390236, Minneapolis, MN 55439 • Toll Free Voice & Fax 800-783-8919 • EmailSite Map