Apr 3, 2007

Got white input fields?

Believe it or not, the color of your fields influences your conversion rate. Usually only by a little though - like by 0.1% Considering that you must first test a multitude of colors to obtain such a result, I do not recommend this tweak for the smaller businesses out there.

That is unless of course your website uses a gnarly color scheme. Every now and then I see a website with a color scheme so deviant, white is a clashing color. Yet they never bother to change the background color of their fields to something else - even when it causes a headache to look at.

Take sketchbagz.com for example. They have a great site design and sell high quality merchandise for artists ( best place to purchase stencils in the U.K. ). However, the artistic look they capture dies as soon as the customer reaches the checkout and gets a migraine.



How do you think field background colors are affecting your online business?

Desigining fixed 800X600 e-commerce sites is an extinct best practice

Times have changed since this was established as a best practice. As few as 5 years ago, 800X600 was the most common computer resolution, used by over 50% of web users. Today that number is closer to 10%, and unlike 5 years ago, it is usually a concession for poor eye sight ( often signifying older users ).

2002 Screen resolution statistics

49% 800X600
38% 1024X768
5 % unknown

2007 Screen resolution statistics (recorded from Taming The Beast)

51.80% 1024×768
12.04% 1280×1024
10.88% 800×600
8.83% 1280×800
3.58% 1152×864

Back in 2002, you could count on the vast majority of internet traffic to sport one of two resolutions: 800X600 or 1024X768. Higher resolutions were too uncommon to even consider. Had higher resolutions of 1280X1024 been a reality five years ago, there is no way that 800X600 would have ever been established as a best practice. The reason? 800X600 fixed width websites look horrible when viewed at 1280X1024. They seem to make use of only 1/3 of the computer screen and make for a painful user experience. It is a given that this will drag down conversion rates (unless you target people with narrow angle glaucoma).

Adaptive width, the new design standard

For the modern online business, you need a site design that looks good in any resolution. Therefore, the new best standard is to use an adaptive width site design that will scale to any resolution. An adaptive width website looks good on any screen size, from 800X600 to 1600X1200.


Second best choice to Adaptive Width?

If designing for an adaptive width is not an option, I would recommend a 1024X768 fixed width design as your next best choice. Why? For one, it is the lesser of two evils. More and more people sport high resolutions of 1280X1024 than low resolutions of 800X600. Hence, a fixed width design of 1024X768 will frustrate less internet traffic than an 800X600 design would. If you need further reason for embracing a 1024X768 design standard, your must indulge in a few assumptions about demographics.


Low resolutions of 800X600, in most cases, signifies users with impaired vision or low income. Assuming poor vision is more common in senior citizens, we can characterize 800X600 browsers to be primarily composed of older users who are statistically less likely to buy online. Compared to high resolution browsers, who have the money and desire to use the newest technology, it seems 1024X768 is a better design standard as far as fixed width is concerned.

Apr 2, 2007

Buttons and your Conversion Rate



When people put their OSCommerce stores up for review, the most common way I see them shoot their conversion rates in the foot is with a weak call to action. What is a call of action? Well, if you are selling something, the ‘add to cart’ button is your call of action. If you are trying to obtain email subscriptions, the ‘subscribe’ button would be considered your call to action. But for this article, we are just going to look at how to improve conversion rates through the design and placement of the ‘add to cart button’.

A lot of research has shown that you can increase your conversion rate through a stronger call of action. Think about it, how is someone going to buy something from you if they cannot find the ‘add to cart’ button? Case study after case study has shown that ‘add to cart’ buttons which are more attention grabbing improve a websites conversion rate.

Aside from the product image, the ‘add to cart’ button should be the first thing your visitor’s see. It should be as big as aesthetics permit, and should contrast enough with your site so that it literally seems to pop out at you. It should be above the fold, near the price and product image, and should appear again at the bottom of long product descriptions. A good rule of thumb is to make sure that your call of action can be easily seen to someone who is standing away from the computer on the other side of the room.

If you are currently using a 'buy it now' hyperlink, an annoying graphic, or a button that is subservient to your color scheme - you are losing easy sales. I've seen case studies citing a 300% increase in conversion rates - just by overhauling the 'add to cart' button.