Key Design Elements of an Effective Web Store

Creating ecommerce designs is one of the most difficult aspects of web design. On one hand, you need to make your site as beautiful as possible, but on the other hand, you need to make the page as usable as possible—walking a balance between these two goals is the key to a high conversion rate. But how do you strike this elusive balance? Below we’ll discuss a few best practices you can apply to make sure your next designs are both gorgeous and useful.

Focus on simplicity

When a designer tries to do too much, failure is never far away. One of the most important aspects of successful layout design is utilizing white (or blank) space. Often times sites become much too cluttered and don’t offer the viewer a subject upon which to rest their eyes. When working with important copy or large quantities of information, make sure to offer healthy spacing that’s free of any clutter. This doesn’t mean every page needs to be completely sparse, but just make sure that graphics and images are intentionally placed to reinforce the topic of the page.

One system that does an excellent job of this is Amazon’s ecommerce software. You can see it in Fruit of the Loom’s product pages.

Men's Undershirts


Crank up product page quality

Because ecommerce designs are relatively sparse, one of the most important places to grab the users’ attention is through product imagery. It may seem obvious that an ecommerce site should highlight its products (that’s the entire purpose of the site), but often times designs don’t place enough emphasis on their products. While it may be enough to simply have HQ product photos over a solid background, you can also be creative and utilize more stylized imagery such as My Own Bike does.

My Own Bike


Make it navigable

When it comes to UI design, arguably one of the most essential elements is site navigation. At its most basic level a website needs to be intuitively and easily navigable by any viewer that stumbles across its pages. While there are a host of techniques and approaches to developing intuitive navigation, there are a few things to keep in mind.

In general, readers will view your pages in an F shaped pattern – IE from the top left to the bottom right of the page. Therefore, sites that utilize the traditional upper left hand navigation bar tend to be successful. Similarly, sites that utilize side navigation usually find better success when positioning it on the left side of the page. Beyond simple page navigation, however, it’s also important for the viewer to be able to easily back navigate, or see where they’ve come from. One simple way to implement this is with a breadcrumb system. Amazon does a great job with breadcrumb navigation by letting users always know what categories and subcategories they’re shopping in.

Amazon BreadCrumbs


Add the human touch

Despite the prevalence of online shopping, people still want the human touch in their purchasing experience. Mashable recommends including social media widgets for sharing on the major networks, customer reviews, and elements that make recommendations based on the user’s site history or purchasing trends. Every time the user sees something that is legitimately interpersonal, she’ll be put more at ease. Check out how DodoCase utilizes social media within its product pages.

DODOCase Social Sharing


And, of course, the most important tip of all for an ecommerce site: maintain a uniform brand. If you make sure everything has the same look and feel, and that branding is aimed at a good target market, you’ll be sure to rise above the noise on the Internet and win an audience.

Share your opinion

About the author

Author avatar
Luke Clum is a graphic designer and developer from Seattle who is crazy about UI design, alpine climbing and earl grey ice cream. You can follow him on Twitter @lukeclum

Follow our latest hunts

Facebook Twitter Google+ Instagram Pinterest