Welcome to SEO Boy, the authority on search engine optimization -- how to articles, industry news, insider tips, and more! If you like what you see, you can receive free and daily updates via email or RSS.
Print This Post Print This Post

Tactics to Avoid Bad Design and Increase Conversions with Professional Website Tips

July 15th, 2009 | | Basic SEO Tips

SchwarzerhutTrust2009

As part 3 in our five day series on increasing conversions with credibility and trust, today I’ll be talking about how to accomplish that with professional website design do’s and don’ts.

Let’s start off with a scenario; say you’re in the market for a new flat screen HDTV. You’re driving down the road and you notice two stores right next to each other that sells TVs. However, one store is very run down and is in serious need of a good remodeling. The other store has a clean parking lot with a manicured lawn, pretty trees and friendly employees holding the door open as people walk in.  Which store do you choose?  It’s pretty obvious people will choose the clean store over the run down store.  You’re website is no different.

You’re homepage is the first impression a customer gets; as they say, you get one chance to make a first impression.

People are going to buy from stores that are trustworthy, and I want to discuss ways to help make your website more trustworthy. I also want to discuss bad design and what makes a bad design that can scare customers away to never return.

Let’s start with ways to avoid bad design.

1. Cheesy animated graphics. At the dawn of the internet everyone had these little marching ants or jumping bunnies on their websites. To an average online shopper today this tells them that you don’t really care or want to spend the money to update your store front. Which means you may not truly care about the quality of your products or services or custom service either. Having too many graphics can hurt your store front as well.  People need to have one focus when they go to your homepage and that one focus should be the one thing that stands out more than anything else.

Fabricland.co.uk is a classic example of using cheesy animated graphics to promote and sell your products.

fabricland

The waving flags, horrible graphics and bad colors just make this site incredibly unappealing and if I had another choice to buy fabric online I would choose another company.

2.  Horrible Navigation.  Navigation is the science and skill to which you apply to a web site that helps visitors move from one page to another.  On a website, there is usually one main action you want your customers to take. Whether its request more information, purchase a product or call for service you must make it easy for customers to navigate to complete this action.  Havenworks.com is a good example of how to NOT design your website in terms of navigation.

havenworks

3.  Un-Readable Website Copy.  If you’ve ever had to stage your home in hopes of selling you’ll know that colors you pick for your living room, kitchen and bedroom aren’t always going to appeal to other buyers. So it’s best to go natural.  The same goes with your website.  Don’t have a black background with red copy unless your website is all about blood, guts and gore and isn’t necessarily about selling.  Don’t have distracting background colors at all, including distracting graphics that are too bold in color and contrast too much with your copy. Also, don’t use vertical copy – that’s also really hard to read.

Below is a website I found on www.webpagesthatsuck.com in the top 2009, well, webpages that suck.  Even though this woman’s site is about the ‘antichrist’, you can see how hard it is to read and how unappealing it is to the eye. No one in their right mind would stick around to read all this copy.

antichrist

Un-readable copy can be copy that is too small. The standard size for copy on websites should be either 10pt or 12pt font.  Font type is also important. We understand using script fonts will supposedly enhance the theme of your website, but if you can’t read it, what’s the point?

Miauk.com is another great example of copy you can’t read due to annoying colors, simply unreadable text and distracting backgrounds. And that’s just the beginning.

miauk.com

I could go on an on here, but I think you get the point. Next, I’d like to discuss a few helpful tips to make your design more appealing to the eye and trustworthy to the end user.

1.  Navigation on the left or top.  If you’re looking to NOT confuse your customers, then put your main navigation to the left hand side of the page or the top.  The reasoning is that people read from left to right, top to bottom.

So if you have you navigation where people can find it easily by scanning your web page over then they’re more likely to not get frustrated and leave the site, or click on a category within the left hand navigation to learn more or to shop.  To further support this point, great website designers have been following this rule for a while now. So now people are accustomed to finding category or sub-category pages to the left or top of the web page. Putting it somewhere else is just going to throw them off and lead to fewer conversions.

2.  Call-to-action and other important copy above the fold. Understand that everyone uses a different screen size and resolution.  Screen size is the size of your actual monitor. While resolution is the number of pixels used to display an image.  The resolution on a monitor is composed of many pixels and is indicated by a number combo like 800 x 600.  In laymen’s terms if you play around with your resolution settings, your windows, icons, etc will display either larger or smaller depending on which resolution you choose.  So what may be above the fold on your monitor may not be a standard size on everyone else’s monitor.

The standard size for a resolution is typically 800 x 600 or 1024 x 768.  Screen size varies from desktop computers to laptop computers.  However, a good way to determine what  resolution a majority of your users are using is to go into Google analytics, click on Visitors, then click on screen resolutions.  The point of this tip is to better understand how your users are looking at your website, so you can make changes according to them, not you.

By putting your call-to-action or other important copy above the fold the user is almost guaranteed to see it and not skip over it from having to scroll.  Anything that can differentiate you from your competition like a promotion or by having a call-to-action on your homepage front and center is a great way to go and will help generate more conversions.

3.  Colors & Readable Copy.  There are studies that show how certain colors can affect a person’s way of thinking or their mental psyche.  Example, red is supposed to influence excitement and energy while blue tones are supposed to be calming and relaxing.  Choose colors for your website that are naturally complimentary to each other so the reader can feel at ease and not distracted by loud annoying colors. Plus, this will make your website more much more professional and credible.  According to www.colormatters.com, they call this ‘Color Harmony’.

In visual experiences, harmony is something that is pleasing to the eye. It engages the viewer and it creates an inner sense of order, a balance in the visual experience. When something is not harmonious, it’s either boring or chaotic.

At one extreme is a visual experience that is so bland that the viewer is not engaged. The human brain will reject under-stimulating information. At the other extreme is a visual experience that is so overdone, so chaotic that the viewer can’t stand to look at it. The human brain rejects what it can not organize, what it can not understand. The visual task requires that we present a logical structure. Color harmony delivers visual interest and a sense of order.

Also, Colorcombos.com allows you to view various color combinations they and their users have put together.

colorcombo

In the end, my best tip for creating credible and trustworthy website design is to do some research first.  Don’t just slap a website together and say you’re going to go back and tweak it because honestly that day may never come.  Research a few color palettes, some other websites in your industry, and show the final design to someone who won’t be afraid to give you some honest feedback.  Allow them to navigate through your website without telling them where to go and see how easily they can find what they’re looking for. That’s almost a fool-proof way to learn what needs to be changed and what can stay.

Facebook   IN   Stumble Upon   Twitter   Sphinndo some of that social network stuff.
  • Benjamin

    Good article but poor navigation….the user experience is to go from the first part to the 2nd article, then the 3rd, to the final article. All of the good information for navigation and SEO, this part fails. Sorry.

  • http://attorneysstpaulmn.com/ Minnesota Lawyers St Paul

    You raise a very interesting point. I appreciate how you stated it. Brilliant article! I wholely agree. Well put.

  • http://www.innerid.com Motion Master

    Nice article!! Navigation and colors are the key factors in a website . The navigation should be friendly and colors should be as light as possible. Light colors always give a professional look to the web page.