5 Web Design Lessons I’ve Learnt from Running an E-commerce Store

You may think you’ve got a straightforward navigation on your site, but you usually can’t account for the random ways customers search. They might want to look at everything in your shop that’s colored blue, or everything under a certain price, or everything suitable for a child aged 3-7, or everything with a picture of a penguin on it.

Your store needs more than one way to search every item (items, tags, categories, search by color/size/brand/price, etc), and you need to ensure that every search method is working effectively. Often, search plugins neglect certain parameters and may not include common spelling errors. Check and check your search tools again and again! I checked my store’s search bar recently and discovered that it would only bring up 1 item when I typed in “gothic” despite the fact that 14 items are tagged with that term. Ooops!

Book sites such as BN.com are great at giving you multiple ways to browse a site. In the top part of the page alone, there are 6 ways to find different, related products:

Lowes drives sales by helping people get ideas for what they can create with Lowes products:

More and more people are browsing e-commerce stores and buying products from their smartphones and mobile devices. A responsive design allows these users to shop on your site without using a specific mobile-designed site or app. A responsive design responds to the device’s screen size, orientation and platform, and delivers an optimized shopping environment.

Although the design I’ve been using has out-of-the-box responsive features, I’ve been tweaking it as customers have sent in queries and reviews about mobile shopping. Every month I’m seeing more and more hits and orders coming from mobile users, so responsive design is vital to a store’s success.

FiveSimpleSteps.com sell expert web-design books and their store is a positive reflection on their skills:

My other favorite example is Nixon.com which sells watches:

In an e-commerce store your product needs to be the focus of the design. Customers cannot touch, smell, try on or taste a product, so they are buying with their eyes, and you product needs to be as appealing as possible. Whatever design elements you include on a page cannot compete for attention with the product photography.

Originally, on our e-commerce site we had up stock photography of our products from our manufacturer’s catalogue. Needless to say, they were less-than-inspired, and we didn’t get a lot of customers. I roped in friends to model and photograph our products and we now have a full catalogue of beautiful professional shots, which customers can’t stop raving about.

TeslaMotors.com has some beautiful photos of it’s cars:

You could probably find a lot of car and clothing websites for this category. One of my personal favorites for clothes is http://cxxvi.net:

Lastly – but in my mind, most importantly – an e-commerce store design needs to be unique. It needs to stand out. In the world of e-commerce there are other several companies all stocking the same products and competing in a local market, so it is vital your design appeals to your market.

Our first e-commerce store designs were clean and simple. They looked great, but didn’t match up to my vision for my store’s brand. I kept telling the designer, “Add more personality. Go wild! Have fun!” While we’re definitely taking more of a risk than many e-commerce stores with our wacky design and branding, it definitely helps our site stand out amongst our competitors.

Don’t be afraid to experiment with your e-commerce store design and branding – by using robust testing methods, you can figure out which elements work, and what needs to be toned down, as you begin making sales.

E-commerce store design has certain features that make it unique to standard website design – but the basics of good design hold true: a good design is one that let’s the product shine, and that allows users to quickly and easily find the information they need. Good design = simple, practical, engaging and unique.

My favorite book on this topic is Designing for Emotion by Aarron Walter. Aaron works for MailChimp which is famous for adding personality to it’s site:

Other famous examples of e-commerce sites with personality include BetaBrand.com which comes up with product descriptions like this:

“It’s no secret that our friend Chef Chris Cosentino loves tasty, salted pig parts. Also, he’s been known to wear socks. While looking at some salami tubes one day, he had a revelation: “Tube socks. Salami comes in a tube. Why not salami socks?”

In a similar vein is the e-commerce site Woot.com who take an ordinary product like a kids’ toy and sell it thus:

“Hey! Toddler! Looking for a great deal on a way to help you improve your walking? Don’t go to one of those fly-by-night used walker dealers! “

Have you ever designed / operated an e-commerce store? What design and content tips do you have?

BIO: Steff Green is a New-Zealand-based writer, blogger and e-commerce junkie. She currently writes about SEO, content creation and social media over on Zen Optimise Blog.