Web Design Principles for E-commerce Sites

gistfile1.md

Purpose

Collect and analyze best practices to create the most effective website design for an E-commerce site.

Summary

1. Reduce page download speed to 1 second.
2. Design pages following the F-Shape / Golden Triangle principle.
3. Break design into sub-pages which fit perfectly on the screen.
4. Present only 5 things / content blocks on every page.
5. Try to make visitors contactable at the first visit.
6. Once contactable make visitors return and buy.
7. Reduce the steps from 'Add To Cart' to 'Make Purchase' by deploying 1-click shopping.
8. Use non-classic e-commerce techniques like flash sales, subscription and social commerce.

Problems and Solutions

This section presents common problems presented by industry leaders and offers solutions — in order of importance and impact.

1. Slow sites are abandoned immediately

Problem

Every 100 ms increase in load time of Amazon.com decreased sales by 1% (via websiteoptimisation.com)

Solution

Make the site download speed to meet the industry standard 1-3 seconds. 0.1 second gives the user the feeling of direct manipulation, 1 second keeps the user's flow of thought seamless.

2. Visitors have Tunnel Vision and Selective Attention

Problem

Users don't see stuff that's right on the screen. Selective attention makes people overlook things outside their focus of interest. (via Jakob Nielsen)

Solution

Each page will contain the minimum amount of information positioned after the Golden Triangle / F shape principle considering website eye tracking best practices and heat maps.

The Minimum Amount of Information means visitors can focus only on 5 things on a single page. On importance these areas / information blocks must be:

1. Identity — Makes the visitor feeling safe, being in the right place
2. Offer — What this page offers
3. Values — Emphasize what your site does that's valuable from the user's point of view, as well as how you differ from key competitors.
4. Tasks — Emphasize the highest priority tasks so that users have a clear starting point for what to do next.
5. Entertainment — If all above are not interesting for the user make it feel good by offering something fun which still connects / links back to your site.

(Distilled after the Design Guidelines For Usability by Jakob Nielsen)

The design will break into several 'pages', each page fitting perfectly the current screen.

3. Users stay not very long on web pages

Problem

Users often leave Web pages in 10–20 seconds, but pages with a clear value proposition can hold people's attention for much longer. (via Jakob Nielsen)

Solution

Make them contactable & reachable

Track visitor behaviour real-time and segment them into different target groups (Responsive E-commerce).

Make them to return

Once contactable go after each visitor on every channel (e-mail, facebook, twitter) and make them customers.

4. Shopping Cart abandonment rate increases with every click

Problem

Yet despite many years of optimization, online shopping cart abandonment rates reached 75% in the first six months of 2011. (via Luke Wroblewski)

Solution

Reduce the number of steps from Add To Cart to Make Purchase (Deploy 1-click Shopping)

Conversion Rate erodes with 50% on every step until the final purchase.

Offer them other, more effective ways to shop than the current 'Add To Cart' paradigm

Very few successful e-commerce companies were started in the 2000s. Since then, e-commerce startups have enjoyed a revival. Dozens of companies have gotten traction and venture dollars have followed. Phrases like flash sales, social commerce, and subscription commerce have entered the startup lexicon. (via Chris Dixon)