How Simple Web Design Helps Your Business

Advertisement

Many e-commerce sites these days tend to be loaded down with too much information on their landing pages. The reasoning for cluttered e-commerce sites is simple: the more information you can cram on the page, the more the user will buy. Unfortunately, web buyers are a finicky bunch.

Jacob Nielsen reports that web users are becoming much more impatient1 while shopping and browsing online. Instead of spending their time going to a site’s homepage and finding the content by categories or other product recommendations, most shopping is done by quick Google searches. If the user can’t find what she’s looking for right away, she’s gone.

It’s crucial to have simple web designs to allow the user to quickly find the information they need, especially if you are selling a product. If the page is cluttered with useless text, widgets or unrelated products, the site becomes meaningless.

However, it’s become a common practice to do just the opposite. e-commerce sites have taken this “scatter shot” approach of trying to slap the potential buyer with as many options as possible. Instead of making the landing page solely about one product, sites usually clutter the page with unnecessary information, ads and related products.

Less Products Mean More Focus

Many web companies forget the cardinal rule of e-commerce: Web shoppers want as little hassle as possible. Instead of hopping in the car and driving to the store to buy a DVD, it’s much easier to go online and snag it from Amazon in a few clicks. The customer is even willing to wait longer and spend more money if the shopping experience is simple and fast.

Apple2

Apple3 has mastered the art of minimal homepage design. If you go to their homepage, they’ll only show you three things:

  • A simple header navigation
  • One product in the body of the page
  • A few informational links about the featured product with images below the fold

Aside from the standard footer navigation, the homepage consists only of three parts. Here’s what you see if you click on a product link (like the iPhone4).

iPhone homepage5

Even on the product page, you immediately see what the page is about: the iPhone. The product itself dominates the bulk of the page, and the surrounding information are apps and features of the new iPhone. But more importantly, notice what’s not on the iPhone page:

  • Unrelated products
  • Unrelated sidebar ads
  • Lots of copy
  • Clutter

Apple has effectively shown just enough information in a very pleasing manner. There’s nothing wrong with showing lots of information, as long as it doesn’t feel like a lot of information. You’ll also notice that all of the information, links and pictures are all centered around the iPhone and what it offers. There are no distracting ads or unneeded information about other products.

There are a couple of tried-and-true methods that any designer or web developer can take to ensure that the site layout doesn’t drive customers away with clutter.

  1. Only what you need.
    The biggest aspect of simple web design is only showing what’s needed to make the sale, and nothing more. This doesn’t mean that you can’t give the user lots of information. Just make sure they want to see more information. Apple uses “Learn more” links throughout the page to accomplish this.
  2. Reduce clicks. The less clicks it takes for a customer to buy a product, the higher returns. Don’t make them jump through hoops to buy your product.
  3. The “Grandma” rule. If your grandma (or any elderly person) can figure out how to buy a product for your site, odds are it’s put together pretty well. Unneeded information will turn Grandma away quickly.
  4. Reduce the number of columns. Each time you add a column to a page, the content is pushed into a smaller and smaller space. This puts less emphasis on the main product, and more on extra stuff the buyer isn’t really looking for.
  5. Give less options. There is an added stress put on web shoppers to make decisions. Ultimately, the buyer wants to think as little as possible when making the purchase. Displaying products in a way that eliminates extra thinking and decisions will streamline the buying process and give the customer more peace of mind.
  6. Keep it clean. A clean design keeps visitors happy. By taking the time to ensure that the layout of the site is aesthetically pleasing keeps the customer returning to the site.

Intuitive web design means thinking like a potential customer. Would you shop at your site?

Other Great Examples of Simple e-commerce Design

Bell.ca6

Bell.ca7 uses only a few colors to indicate the branding and offers visitors only the main navigation options. Notice how well the design manages to present a number of different options — shop navigation, support as well as personal and business areas. The design isn’t cluttered but clean and simple and provides the visitors with a broad overview of available options without forcing users to actually go through all of them. Also notice how clever the product navigation is designed at the top of the site. There is just nothing users can do incorrectly.

Shoeguru.ca8

Shoeguru.ca9 present a very user-centric and product-centric design. The product seems to be on the stage just in front of the visitors. The design presents only the product, and nothing else; even only few navigation options are available.

Etsy10

Etsy11 is a great example of how to place a lot of information on a page without it being cluttered. Etsy has a wide catalog of products to sell from, yet Etsy’s design has an earthy, relaxing quality. Creating a useful homepage that doesn’t distract is no small feat.

crupress12

Crupress13 is an elegant book site without many distractions. The homepage manages to present a lot of text without agitating the user. The header navigation is prominent, but doesn’t demand attention. All the design elements flow together smoothly.

tokyocube14

Tokyocube15 is a fun, trendy little site that sells Japanese products. Instead taking precious space explaining what the site sells, the products are put right in front of you. Also, the heavy use of white space allows the products to almost jump right off the page at you. You can’t help but click on one of the toys to learn more about them.

furious tees16

While Furious Tees17 is a tad busier in graphics than the previous sites, it helps do two things:

  1. Show the playfulness of the site
  2. Make it very clear that all shirts are only $19.99

You aren’t lost trying to figure out what Furious Tees is selling, the products are all in front of you. Having all the products on the homepage is especially beneficial for novelty sites that have merchandise people normally wouldn’t be looking for.

But sites with lots of products on the homepage run the risk of becoming cluttered very quickly. Furious Tees doesn’t have this problem. They don’t use any extra sidebars or ads taking attention away from the T-Shirts. The focus is solely on the shirts and the hilarious design.

37 Signals18

Basecamp (37 Signals)19

Look no further than 37 Signal’s project management tool Basecamp for an incredible example of mixing different types of information to sell a product. Yet there’s just enough information to make an effective sales copy. Every word, every image has to be weighed in a design. If there’s not enough information, the user won’t spend time trying to figure out what the product does. Too much information and the user becomes overwhelmed.

The tasteful use of heading backgrounds and company logos makes every bit of information stand out on it’s own. And they somehow made all of the different types of media blend together, with plenty of space so that the user isn’t bombarded by lots of text or images at one time.

You Only Have a Few Seconds

Every website is going to require a different type of layout, design and copy to sell products. But designers can strive to do more with less by:

  • weighing every word
  • removing unneeded elements
  • using tasteful colors and whitespace
  • and limiting the amount of overall information the shopper sees at one time

Remember, online shoppers are a fickle bunch. They don’t “window shop”. They use search engines to limit their searches to a very narrow field. If they don’t like what they see, they leave. Site owners only have a very small window of time to capture the attention of the prospective shopper. A tasteful, clutter-free design that places the focus on the product (and nowhere else) will allow the shopper to find what she wants faster.

Glen Stansberry is a web developer and blogger. You can read more of his articles on smart web development at Web Jackalope20.

Footnotes

  1. 1 http://news.bbc.co.uk/1/hi/technology/7417496.stm
  2. 2 http://www.apple.com/
  3. 3 http://www.apple.com/
  4. 4 http://www.apple.com/iphone/
  5. 5 http://www.apple.com/iphone/
  6. 6 http://www.bell.ca
  7. 7 http://www.bell.ca
  8. 8 http://shoeguru.ca/
  9. 9 http://www.shoeguru.ca
  10. 10 http://www.etsy.com
  11. 11 http://www.etsy.com
  12. 12 http://crupress.campuscrusadeforchrist.com/
  13. 13 http://crupress.campuscrusadeforchrist.com/
  14. 14 http://shop.tokyocube.com/toys.htm
  15. 15 http://shop.tokyocube.com/toys.htm
  16. 16 http://www.furioustees.com
  17. 17 http://www.furioustees.com
  18. 18 http://www.basecamphq.com
  19. 19 http://www.basecamphq.com
  20. 20 http://www.webjackalope.com

↑ Back to top Tweet itShare on Facebook

Glen Stansberry is the editor at Web Jackalope, a blog about creative Web development.

Advertising
  1. 1

    Simplicity & white space is the key to the best design!

    0
  2. 102

    I think the larger point about apple’s design is missed here. Across their global sites they focus their homepage to what is currently their main focus for marketing because it is where 90-95% of their current traffic is looking for. They are bold in that respect that they want to cater for the people coming to their site at that time and are not afraid of losing users in the smaller % that may be looking for a more obscure product. This is not a model all people can emply though.

    It was 37 signals blog that I read this point on over a year ago when they were explaining how apple are not scared of alienating the “all” for the passionate people who want their products that still enables them to turn a very good profit. In that respect they compare their own products where they refuse to put in feature blot to satisfy the few and instead focus on their passionate audience who love their products than alienating that core audience to satisfy the few people who don’t like their products.

    I think the point of less is more is more about people designing with actual real targetted uses to their audience rather than stripping down their choices. People who cram sites with useless links or feature all products and don’t focus a customer lose on all fronts.

    0
  3. 203

    Beer is my poison

    September 2, 2008 6:07 am

    Nice article. I really like how you pointed out to ‘give less options’!

    0
  4. 304
  5. 405

    Good stuff. I notice Amazon is not on there. Probably because they are the worst example of this ever! I have stopped using Amazon completely because of this exact reason – too much junk on their pages.

    0
  6. 506

    No one likes a grammar nazi. (Even if you ARE correct.)

    0
  7. 607

    As a young designer, having graduated only a few years ago, I can only look at this article and feel a pang of sadness. Though the theory of having simplistic designs and easy-to-navigate eCommerce sites is a touching one, it’s nearly impossible to achieve unless working with the perfect client. In my less than three years in the job force, I have yet to find a boss/client/superior more concerned about the user than their own profit. Until the old fashioned businessmen start trusting their own designers and stop cramming content down their users’ throats, we’re still going to have a long line of cluttered eCommerce sites to deal with.

    0
  8. 708

    Thank you! I’ve been having an argument with someone for 2 months that simple is the way to go. Now I have the proof! Excellent post, I appriciate all your hard work!

    0
  9. 809

    Hi,

    Nice discussion on design with very nice collection….!!!

    Most of the time, its not about design, its about innovation in design and here creativity like dell and others speaks well…

    0
  10. 910

    Small business website design

    September 29, 2008 4:21 am

    thank u r information

    IT IS VERY USEFUL
    u r blog Is very nice

    0
  11. 1011

    Christopher Ross (thisismyurl.com)

    October 8, 2008 5:14 am

    Far too many “designers” seem to put emphasis on stuffing a page full of content. It reminds me of the old print rule … whitespace communicates quality and confidence in your product.

    Chris

    0
  12. 1112

    Nice posting :) I never see this articles before, very helpfull . . . and thank you for your information.

    0
  13. 1213

    very good articles. some important stuff there. read and save!
    I changed my web site about 3 times until I got good results. sometimes what we think is best design, is not good marketing!

    0
  14. 1314

    generic deodorant, indian navy sea hawk, roller chain tulsa ok, speaker dust caps, celtic eagle tattoos,

    0
  15. 1415

    ruger sp 101 red hawk, j geils band centerfold, red hawk phoenix, indus and brahmaputra water dispute, local chemist related on shampoo making,

    0
  16. 1516

    Cool Article!!! Keep up the good work…

    0
  17. 1617

    Very informative and helpful. Thank you Smashing Magazine!!! Thanks to you guys, Dallas Web Design is about to heat up this winter!!!

    0
  18. 1718

    as a I use the internet more I agree with Jacob, my attention span is reducing, my frustration if I can’t find something quickly and accurately is increasing especially around hard products. The only exception I would make are those sites that sell information and are packed with a lot of good stuff then I more willing to look around but the sites do need to be well organised.

    0
  19. 1819

    真的很不错呢!!

    0
  20. 1920

    http://www.prtclr.com/
    We find that simple designs are more difficult designs.
    Since each object on the page is more important, every object needs more thought.

    http://www.perqworks.com – our other company

    0
  21. 2021

    Simple designs is more user friendly and converts much better because they can navigate easier. But designing a simple site is much harder than most thought.

    Jim

    0
  22. 2122

    McKinney Web Design

    June 22, 2011 1:12 pm

    Nice article. Still applies after a few years! Keep it simple.

    0
  23. 2223

    Yes, simple designs are proven to convert well and visitors can navigate easily is the key to having a successful landing pages.

    Ali@ aml-assassin.com

    0

↑ Back to top