Five Common Web Design Mistakes to Avoid

1712-Common-Ecommerce-Design-Mistakes-to-Avoid-header

Whether it is something as simple as marking the wrong answer on a test, or spending an inordinate amount of money on an extremely unnecessary item, we have all made mistakes in our lives. Finding a solution and learning from previous mistakes can be easier when mistakes can be quickly recognized.

However, mistakes in web design aren’t always as easy to identify as a wrong answer or spending more than you can afford. There are several strategies online storeowners can implement to avoid common design mistakes in order to help drive revenue and provide a great user experience to new and returning customers.

We have identified a handful of the usual suspects to avoid when designing your online store.

The top five most common web design mistakes to avoid

1. You’ve stuffed too many items in your header.

Most of us can acknowledge the value in making a good first impression, and the website header is a potential customer’s first impression of your site. Overcrowding the header is a mistake frequently seen on ecommerce websites. The header is an excellent space to display important information like a business phone number or promotional text. As a global element, the header will appear on any page a user visits. You may be familiar with the best practice of placing the most important items higher on the page, however, a problem develops when too many items are displayed at once, to the point where the header becomes overcrowded and difficult for users to navigate. Remember that having too many competing items in an area can diminish the value and visibility of the important ones.

MZB Coffee

  • Solution: Use the header to keep customers focused on important information such as your navigation items, site search, shopping cart, and contact information. Everything else can remain as a global element, but should be placed in the footer or elsewhere, instead. The website footer is the perfect place to house necessary secondary information such as policies and detailed information pages. As with the global header, the footer also travels with the customer as they click from page to page. Best of all, overwhelming customers isn’t an issue because it’s located at the bottom of the page. Thus, the footer can be as tall as needed.

2. You’re advertising too many promotions/deals.

A well-executed promotion can be used to drive website traffic and generate revenue. However, offering too many promotions can run the risk of devaluing your brand. Sure, your ecommerce business might have a lot of unbeatable offers, but how do you avoid the risk of devaluing your brand and products by promoting too many deals? Are you “crying wolf” too often by styling everything as large, bold and red, thus diminishing the value of primary calls to action (CTAs), such as “Add to Cart” or “Check Out”?

Mignon Faget

  • Solution: Having a multitude of competing sales and CTAs can also overload customers by presenting them with too many options. Rather than bombarding customers with all of your promotions at once, consider displaying specific promotions on your storefront, while limiting other promotions to their respective category pages. Category-specific promotions can help encourage customers to make purchases in certain product categories.

3. There’s not enough white space on the page.

“Above the Fold” is a term that was originally used to describe the content on the top half of a newspaper, before it became synonymous with the content you see on a website before scrolling. Nowadays, customers scroll instinctively, almost as soon as they land on a site. Often times, we see websites packing too much content into the highest portion of the website, in an effort to keep everything in view. However, cramming content sacrifices the valuable white space used in a clean, structured site.

web design mistakes to avoid

  • Solution: The white space should enable the user to easily read and comprehend your website’s content without the distraction that too many crammed items present. Having content that is easily digestible promotes a smooth shopping experience for your customer.

4. The call to action is buried or nearly invisible.

Generally, burying the call to action is a problem specific to product detail pages. When a customer first lands on a product page, the “Add to Cart” button should immediately capture their attention. This call to action should always be the most noticeable thing on the page, however, some websites with complex product descriptions and attributes elect to provide all the necessary information before the user commits to purchase. While on one hand, this allows the shopper to make an informed decision before purchasing, it creates confusion as to what the necessary action on the page actually is. Is it an informational page or can the product be purchased here? Greater visual hierarchy can be accomplished by color or size, and should be displayed above the fold whenever possible.

Bare Bones Broth

  • Solution: Some content, such as a lengthy product description, do not need to be displayed in full, at all times. Instead of showing an entire description paragraph, consider truncating the copy and adding a “Read More” button. A tabbed section on the product page, and located below the call to action, is also a great place to store secondary information like the product specifications. It’s important to keep customers focused on completing purchases.Remember to use a unique color for the call to action, and a different color for the surrounding elements. In other words, the other buttons on your ecommerce website should never be the same color as the “Add to Cart” button. Eliminate distractions by creating a hierarchy for product information that is relevant to how your customers shop on your online store.

5. Your imagery is not up to snuff.

The importance of high-quality product imagery varies from industry to industry, but no one can deny the value that a clear, beautiful product photo brings to any ecommerce website. Selling online provides customers with the convenience of shopping from the comfort of their homes. However, selling online does not allow merchants to physically display products to customers. Ecommerce websites with poor, inconsistent, and small images further hinder selling opportunities by placing doubt of your brand, quality, and professionalism in the minds of consumers.

Milk Makeup

  • Solution: Choose a photography direction and hire a photographer to reshoot your entire product inventory, if needed. Decide whether your products are better suited over a plain background or if there is a need to incorporate application and lifestyle photos? There could be a need for both types of photos for your online store. Keep in mind that a product photoshoot could be a giant undertaking depending on the size of your product catalog. Investing in high-quality photography is a must for a properly designed online presence regardless of the industry you operate in or the size of your ecommerce website.

Reference these five tips as a guide during the website design process to ensure you are staying up-to-date on the latest ecommerce website design trends, and ahead of your competition. These tips are a starting point in your website’s design journey, and no two businesses are alike.
Reach out to our Professional Services team to meet with our expert design team to discover how we can enhance your website.

About The Author

Katie Kindness

Katie Kindness’s background in graphic design, has prepared her to excel in a fast-paced ecommerce environment. Her impressive portfolio and creativity recently earned her a spot in the Adobe Creative Jam – a design competition showcasing top local designers throughout the United States. Katie leverages her design expertise to create magnificent ecommerce stores for Miva clients.

Love it? Share it!