Webmasters Gallery

Do you remember the “Breakfast at Tiffany’s” scene where Holly Golightly was standing in awe in front of Tiffany’s window?

While Tiffany & Co., without a doubt, is an established and recognized brand, it still has to take care of its showcase decoration so the product display corresponds to the brand image.

So why should things be different from your e-commerce store?

Unlike physical stores, online shops cannot offer the customers an opportunity to try or touch the products. Hence, online stores rely on design heavily in order to instantly grab the shoppers’ attention and showcase the products in the best manner.

However, it’s easy to miss certain things in design when optimizing the whole store and fine-tuning its performance. But these little things can actually have a big impact on your conversions and revenue. Let’s have a look at the biggest design mistakes that many e-commerce stores make and see the ways of fixing them.

Poor theme choice

The e-commerce theme is a landmark of the store.

The moment the user lands on the site, they will be either immediately attracted or will prefer to leave. And this depends on the first impression a lot.

A theme comprises a variety of elements (e.g. banners), the overall layout, navigation, and much more. The biggest things to look for in a theme are:

• Correspondence to the brand: a theme’s look may be in a complete mismatch with the way you perceive your brand.
• Responsiveness: the theme should function equally well on all needed browsers/devices.
• Optimization: it is highly preferable that a theme can be easily optimized.
• User-friendly design: shoppers prefer certain elements to be easily recognizable (i.e. shopping cart in the upper right corner).

The e-commerce merchant can choose either from a ready theme from a Marketplace or a custom one that requires development from scratch.

While readymade themes are usually responsive and can be used right away, they may not necessarily correspond to your brand and may have problems with performance. Custom theme, on the other hand, can be tailored precisely for your brand but usually have high cost and demand more time for development.

An important point here: consider the e-commerce platform that powers your store. Shopify, for example, is not very customizable and it might be better to choose from available pre-designed themes. Magento, on the other hand, is known for its high level of customization. So it will make sense to address a Magento development company to create a perfect theme that will not let you down in terms of looks and performance.

Poor images quality

You want the shoppers to fall in love with your products and buy from you. And for that, you need to present the products in the best manner.

The quality of product images is an absolute must for any e-commerce store. As well, keep an eye on the images’ behavior on different devices and different browsers.

What some e-commerce stores do is providing a zoomed-in product image so the shopper can see the product details. This contributes to increasing the product’s value and keeping the customer interested.

Poor CTAs

We all know call-to-action buttons. They are responsible for encouraging customers to perform certain actions on the site: add the product to the cart, proceed to the cart, view offers, etc.

CTA buttons are basically the beacons of an e-commerce store that navigate the users and help them reach the desired point in the best manner.

However, some e-commerce stores have problems with their CTAs. The most common issues are:

• CTAs are not visible enough: they blend with the page background and can hardly be noticed.
• The message of a CTA button is not convincing.
• Poor placement choice: the button cannot be spotted.

The main rule of a good CTA: make it noticeable. Use bright colors, avoid ghost buttons, and place the CTA near the important page elements (like price or product image).

As well, try personalizing your CTA buttons. People are tired of clichés like “Shop now” – instead, try incorporating your products into the CTA message.

Complex navigation

The UX part of your design is aimed at helping the shoppers discover the products in a convenient and easy manner. Unfortunately, many e-commerce stores have complex navigation that serves as a major reason for shoppers to leave the store.

The issues with navigation include complex filtering, incorrect categories organization, confusing CTA buttons, incorrect organization of the homepage, and much more.

The main thing to remember about navigation is that it has to create a seamless and frictionless sales funnel. And for that, you need to think about the customer’s journey and outline the main points of interaction between the user and the site.

To analyze the performance of your store and identify problem areas, use Google Analytics. This tool will help you see which pages see the highest bounce rate and how the shoppers behave on your site.

Lack of search optimization

Search can be referred to navigation issue but we shall look at it separately.

One of the biggest issues with search is no return of results.

There may be different reasons for no search results: the user incorrectly typed the product name or the product may be out of stock. But whatever the reason is, do not leave the user with “Sorry, no matches found” message.

More and more stores started adopting the strategy of placing their best-selling or relevant products in the results return. This lets the stores upsell or cross-sell and increase the chances for conversion.

A good idea would also be to incorporate the autocorrect for your search to eliminate the risk of no results found and add a popup with product suggestions.

And the last tiny advice on search UX: replace search icon with a search bar and place a hint text in it. Though seemingly simple, a search bar actually generates more conversions and encourages shoppers to use it.

Non-optimized checkout

Shopping cart abandonment is a big problem for almost all e-commerce stores. With an average cart abandonment rate of 75.6%, the e-commerce stores have to double-check their stores for the problem areas that discourage users from making a purchase. And checkout is the most sensitive area in the whole sales funnel.

Checkout is the place where the transaction happens and the order is placed. The user may roam your store forever but as soon as “Place the order” button is hit, there is no way back.

Or is it?

Lack of checkout optimization is what contributes to a high cart abandonment rate and leave you with a decrease in sales. Here is what users hate the most about the checkout:

• Too many steps in the checkout process
• Obligatory registration
• Not enough payment options
• Too many unnecessary fields in the checkout form

A user-friendly checkout has to have a minimal number of clear and justified steps. As well, add an option of a guest checkout so users can decide between registration or quick checkout process via an email or social media profile.

Many checkouts have too many fields that can be easily eliminated. Do you really need to have two address lines or one will be enough? As well, replace the “First Name” and “Last Name” fields with a “Full Name” one – the UX Playbook by Google claims that this change actually impacts the shoppers’ behavior.

Another thing that can help you raise the conversion is by adding security badges to the site. The presence of security badges builds trust and helps the users make a purchasing decision.

Non-responsive design & lack of mobile optimization

Different people prefer different browsers and devices – your task is to make the store design suitable for them all.

Of course, you don’t need to adapt the store for the first version of Internet Explorer but do some research and see which browsers and devices are the most popular with your target audience. The store should look and perform equally well on all needed browsers and devices.

Another issue is mobile optimization. Considering the rise of mobile e-commerce and mobile-first indexing, introduced by Google, it seems like all e-commerce merchants should understand the importance of mobile and optimize the store correspondingly.

Yet, we can still go to an e-commerce store from a mobile device and see crooked images, lack of text alignment, or non-clickable elements.

So for all the e-commerce merchants out there, mobile optimization is a primary issue to resolve. And don’t forget that mobile UX is different from a desktop one: images have to be of exceptional quality, size of certain elements like CTAs should be bigger and the navigation has to be ultra-intuitive.

Final word

A good design of an e-commerce store implies that the store is user-friendly and aims to deliver an excellent customer experience. After all, your products may be beyond awesome – but how can customers know that if they are not even able to proceed to the category pages?

By taking care of your store design, you automatically take care of the customers too – and this will not go unnoticed.