Business & E-Commerce Website Design Best Practices

I get asked about this subject a lot at my seminars and from my clients. I work with what most people would consider micro or small businesses, and while I’ve done some e-commerce work, large complex shopping sites are not something that I’ve had a lot of experience in. Common sense, design standards and my own experience are still my friends though, so here’s my best shot on this subject:

Usability & Navigation

Make sure it works

Usability is one of those lovely words that means many things to many people, but the bottom line is, does it work, does it make sense, is it easy to use?

I was on a beauty product site the other day and they had a questionnaire to determine which line of their products would be best for me. I actually spent over 3 minutes filling this form out, only to find out that the submit button was broken and did not work. I never got the information I was looking for and was frustrated enough to find the contact page and let them know. I never got a reply and I’m very unlikely to re-visit this site or buy the products now.

Be vigilant about is broken links and have someone test your site regularly, especially to external links that are not in your control. Nothing screams unprofessional site like links that go to Page Not Found. Any time you change anything, it’s always good practice to test for this. You can check your site right now with this tool. http://validator.w3.org/checklink

If it’s not ready, don’t put it out there

No under-construction

I strongly encourage forethought and planning in site design, but that doesn’t mean promising links or info that is not ready yet. If the content for the page is not ready, then don’t put it in the navigation. How many times have you seen COMING SOON! only to come back a week or month later and have whatever was coming still not there? Design the navigation so that adding pages later is no big deal, but “under construction” and “coming soon” are  just not cool.

If Mom can’t figure it out, it doesn’t make sense

When I first designed my own site, I did some very artsy things with my navigation. Instead of the straight choices across the top or side that you see almost universally, I embedded the links into the header art. I showed this site to my Mom and despite the fact that the giant leaves to the right had Portfolio and Contact written on them, she didn’t know that was where she was supposed to click until I showed her. Oh. Eventually I got around to changing my navigation to something more conventional. Maybe not as cool, but if your audience can’t make sense of it, what’s the point?

For more on this, check out the Mom test video.

Is it easy to use?

We’ve all been in sites where how to get to the next step, refine the search or figure out the shipping before buying was just not apparent. User testing, (this is a great place to use your Mom again), is critical. Even small companies can enlist family and friend help. This is where you really want to find someone who is not you or your designer. If it’s not easy to use, the chances of repeat visits, otherwise know as business, are slim.

Engagement & Conversion

Engaging your audience and converting them to sales are the holy grail for e-commerce sites. Once you’ve got the structure making sense and working, making your site attractive to your target audience is next.

Know your audience

People gravitate to images that reflect themselves.

Designing a site for baby products in black and red with a lot of flash makes about as much sense as designing a site in pastels with lots of open space for teenage video games. While designing a site that reflects the style and tastes of the owner is appropriate, making it pretty for you and a turn off for your audience is not. People gravitate to images that reflect themselves. If your core audience is older men, then your images should reflect that. While those guys may like pictures of hot girls on their auto parts calendar, when they’re shopping for insurance, those same hot girls do not make them think your company is reliable.

Know the audience you’re designing for

Design elements

Why are quote and buy buttons often large and hot colors? Because they work. Why is navigation across the top or on the side? Because that is where we expect it to be. Your site can be your own without being so unconventional that nobody knows what you’re offering

Call to action example
Call to action example

or how to get more information. All e-commerce sites and even those that are just service businesses should have some kind of “Call to Action” on as many pages as possible. What that is depends on what you want your audience to do, but if you want them to get a quote, or sign up for a newsletter or search or buy, makes those actions obvious and don’t be afraid to test different methods.

Customer Service

OK, this seems like a no-brainer, but it bears repeating. If you’re selling something, at some point you will have to deal with your customers.

  • Don’t surprise them, be up front about things like shipping costs
  • Don’t make them search for a way to contact you
  • Make returns and other policies obvious

If you are selling your own products, make sure this process is completely tested as well. The system that works is one that can handle the exceptions well. Very few people will talk about an uneventful order, everyone will complain about a bad one.

Sell your Credibility

Belong to a chamber of commerce, a trade association, have a profile on Linked In or a fan page on Facebook? Tell the world about it. Not only does bring credibility to you and the services you offer, but it has the added bonus of adding more SEO to your site. Do you see what’s happening at bottom of this page?

Test it, track it

Google analytics

How do you know what pages on your site are being visited? How do you know how long they are staying on a page? How do you know if your customers are bailing in the middle of a sale? How do you know that you really need to make sure that your site works in IE6?  How do you set up A-B testing to see which landing page works better? One word: ANALYTICS. Google analytics is free to install. There is no excuse for any site and particularly an e-commerce site to not have the tracking code installed. Business is all about measured results. This is where it starts.

Further Resources

http://www.seomoz.org/blog/17-new-rules-for-successful-ecommerce-websites

http://reach.dzone.com/articles/10-key-practices

http://www.webdesignfromscratch.com/web-design/current-style.php

http://www.lakeshorebranding.com/company/blog/simple-ppc-tip-increasing-conversions-with-a-shiny-button/

http://www.mahalo.com/how-to-use-google-analytics-for-beginners

http://www.newfangled.com/how_to_use_google_analytics