Online stores can often be confusing and hard to use which can turn potential customers away. There are some very simple things you can do to keep your users focused on your site. Here are some great examples of sites doing just that.
CafePress
Good use of top navigation, highlighting the relevant section that the user is currently viewing. Good use of colour to ease usability.
The Mozilla Store
The Mozilla Store creates a fun, creative feel to their online store with related sketches in the header and clear navigation on the left makes it easy to find products.
HMV
HMV’s store almost jumps out at you due to the shadows either side of the content. Space for promo offers in the header to catch the users’ eye and big, bold and clear navigation.
Nerve Music Store
Nerve uses an unconventional method of dragging items to the shopping cart on the right but a big ‘Drag Stuff Here’ button above the cart instructs users what to do.
Taste Book
Taste Book gets across the message of what it is very clearly on the homepage followed by a big distinctive button indicating that it’s free to join.
Blooming Gorgeous Flowers
A design that displays the elegance of flowers with the use of vector illustrations as well as good photography. Great use of icons in the footer and for the basket in the header.
General Robots
Clean graphics and good use of colour shift the visitors’ focus to the products.
Bambino Direct
Fun colours directly relate to the products that Bambino Direct sell.
Blooming Direct
Blooming Direct’s store is ordered into three columns. On the left is the secondary navigation, in the middle is the content with the primary navigation on the top and on the right is the basket and space for offers.
Steam
Layout makes good use of whitespace especially in the left column which contains the navigation and categories. Use of colour to easily distinguish between what is and isn’t clickable.
Feel Unique
Very clear navigation through the use of tabs and login section on the left for easy access for returning customers.
Big W
Big W uses a very clean and uncluttered design that makes great use of whitespace making it easier for the user ti understand how to navigate and use the site.
Northern Tool + Equipment
Colours and design reflect the products on sale giving the users more of an association with the store.
Makoosh
Bold colours which translates into a bold and easy to navigation. Use of a big promo area and a recently viewed items in the ‘My Account’ section on the right giving the user the ability to see what they looked without remembering exactly where it is located.
REI
Another great example of top navigation but with the colour changes dependent on what section that the user is viewing.
Boots
Boots uses a promo area that cycles between three different images with a very clear indicator to show which image it is on. It even includes a pause button so that the user can stop the auto-scroll and take in the message.
Schwan’s
Big imagery allowing the company to promote specific items and draw the users’ attention to them.
Apple
Apple really keeps the focus on the products with little distraction elsewhere. It’s complete line-up of major products are displayed in the top two rows of the store.
Play
Play makes it very clear which section you are visiting due to a clear tab system. Promo area in the middle updated regularly keeping the customers coming back to new content to keep them interested in the store.
Game
Clearly defined sections with big message in the header notifying of free UK delivery which can be a great incentive for people to place an order with them rather than a competitor who charges even a small fee.
Etsy
Etsy gets across the message of what they sell with a big tag line placed underneath the logo.
QVC
QVC displays a message to users who haven’t visited the site before. This allows them to send out an introduction message to welcome new visitors.
Threadless
Great imagery of the products in use by people which is a fantastic way of presenting items.
Tweet
Nice collection this one
. I was kinda interested in this kind of design.I think I found what I needed, thaks for the post.
Great collection! I’m glad that Etsy is featured – I think they do a GREAT job. I’m surprised that Target isn’t up here as one of the greats. Especially since they’ve won e-commerce awards in the past.
Awesome list! Although I’m a little embarrassed to say it, I think the QVC site is fantastic.
Another one I have always loved is: http://www.panic.com/goods/
Inspiring thanks!
Hmmm, no doubt some of these work well, but which ones? What few commentators do is take the time and effort to ask how much these companies sell from their “great” stores. An ecommerce website design is “excellent” if it works (ie sells stuff). This is like listing the 10 best cars without driving them and seeing how they perform in their sector. It’s lazy, sorry.
Anyone can pick some websites and say how good they are – let’s see the figures! (Must throw Apple in to keepn the mac crowd quiet). For example… RYANAIR.com is an excellent site, it does its job – but the chattering weberati will yelp all day long at how “awful” it is.
Not really sure why you “singled” out these 23 sites .. So many good great and clumsy shops out there – what really makes the difference is how they interact with customers and ease of ordering and finding what you want.designers love slick sites because they can showcase their art, but at the end of the day what’s important is a site that closes the sale, something that far too many sizzle sites overlook.
Here’s another: the most amazing UI I’ve ever seen for an online storefront (drag and drop shopping cart, sliding panes, lightbox, etc): http://kayosmarket.com
Full disclosure – I built it
It’s still pretty awesome though!
@Ling: Really, RYANAIR.com? RYANAIR.com is just plain ugly and riddled with adverts. I think RYANAIR.com does the job because the rates are so incredible. It definitely has more to do with the business model than the actual design.
Muito boa lista. Gostei bastante.
There’s a good article about rebranding an e-commerce site that I found the other day.
Nice list, btw.
@matthew, yes Ryanair
Look, everyone can oooh and aaaah at “beatiful” sites (in sort of mac design terms) but what customers want is something that works.
“Excellent examples of design” can only be true if the sites do their job, and whoever compiled this page has not bothered to analyse how the sites perform, in dollar (or pound or euro) terms.
If some of these sites do not create profitable business, how can they be “excellent” in any way? Just because they have perfect code or css or validate or have beautiful colours means nothing. Good design alone does not buy food or create employment.
Ryanair.com works fantastically well. Is functional, but is also excellent.
- Ling
Beautiful websites. As much as people downplay design in marketing, poor designs will destroy the product no matter how good the product is.
I have to say that wwww.bambinodirect.co.uk is a particularly good example.
Inkd is the first marketplace to buy and sell print designs and Smashing Magazine profiled us as a good example of e-commerce usability and conversion. Check the article here if you are into this kind of stuff: http://www.smashingmagazine.com/2009/05/15/optimizing-conversion-rates-its-all-about-usability/
Amazon not on the list??
Thank you for sharing good articles, posts and more are waiting, in respect
I must say play and blooming direct are my favourite sites. I think the use of photoshop graphics and calls to action work well.
Great examples, Apple always have a great setup… very easy to navigate. Play is a great site but there is often alot going on as they have so many offers.
Some good examples above of well designed online stores. It’s shocking that so many e-commerce sites still fail in this department and make the buying process so much more complicated than it needs to be. Thanks
Good examples of well designed stores! Top navigation is defiantly a key factor, and of course first reactions to the site! Good post
Not exactly an online store – but a great site with clean layout and easily findable catalogues from leading Australian retailers that has let to many an offline purchase! htpp://www.lasoo.com.au
I think you mean http://www.lasoo.com.au , and they are ok on things like the catalogue page and they have nice large pics, but it is a bit cluttered on the homepage, with multiple navigational items going to the same place. I think Big W does it better, at least for cleanliness.
Good website design is still needed for profitable business. User friendliness is very important in the website layout, because your search for high rank with poor design could result in high bounce rate and failing your purpose in the long run.
Thanks
nice post
Genuinely brilliant post! We’ve just had a bit of a overhaul of our website and couldn’t done with some examples put together like this.
Great post!
I hope you don’t mind me leaving a cheeky little link as well
noblesse oblige
I found hire also some good shoping card designs http://www.shopping-cart-themes.com
very good selection of good design balanced with the most important aspect: very successful stores.
How do I choose the best of these examples? Many of them suit..
Cool list, these are the ones to aspire to no doubt! we have just started as a small e-commerce store ourselves, click our name and let us know what you think.
Most of the designs are very nice, and seem to be very user friendly, might just get some ideas from some of these and use them on my websites. Thanks for the great post
Thanks, this is really helpful, it’s so difficult trying to get the design right, especially for small or one-person businesses.
excellent online store .Im never seen it before.I love this site
Thanks For a good collection of awesome eCommerce stores. These can be exemplary for the designers who needs to design really cool eCommerce sites for the clients..
cheers….
Some great examples there. It is clear that the large thumbnail and slideshow gallery photos are important factors in modern online shop design.