Designing an eCommerce site that customers love is not an easy process. On a high level, design requires a lot of resources to plan, adjust and implement but the final results from great UX are a product that users love.
Being a successful creative has a lot to do with the way you work, so it won't be weird if you do some mistakes. Below are some common UX Design Mistakes that Online Store has to consider if you don’t want to lose your sales.
Be sure to take careful note if your site is making any of the following mistakes, and try implementing A/B tests and to corrections to improve.
1. Lack Of Clear Value Proposition
A strong value proposition is your argument as to why customers should buy from you when they could buy from the competition. Value proposition is the #1 thing that determines whether people will bother reading more about your product or hit the back button. It’s also the main thing you need to test – if you get it right, it will be a huge boost.
In a nutshell, value proposition is a clear statement that:
- Relevancy: explains how your product or service solves your customers’ problems or improve their situation.
- Quantified value: deliver specific benefits.
- Unique differentiation: tell your customers why they should buy from you and not from your competitors.
Value proposition is something real humans are supposed to understand. It’s for people to read. The value proposition usually include a block of text (a headline, sub-headline and one paragraph of text) with a visual (photo, hero shot, graphics).
- A Headline (considerably with sub-headline): What is the benefits you are offering, just a short sentence that uses simple, clear language as to why an item is worth purchasing. It’s a promise of value that catches the visitors’ attention.
- Bullet Points: Lists the key benefits or features.
- Visual: Images are better than words, show the product, or a slider will catch the customers’ attention more effectively than words.
It’s tough to find perfect value proposition examples. Probably because it’s hard to create a great one. Here are some examples of an effective value proposition:
In this value proposition example, Stripe makes it clear that its web and mobile payment products are specifically made for developers and tech-savvy businesses.
In these simple statements, Bitly summarizes its three major services in a way that is not only easy to remember, but also cannot be misinterpreted.
In just two words, Evernote tells you the exact benefit of its product and shows it in action with three situations in its hero video.
The best value proposition is clear: what is it, for whom and how is it useful? If those questions are answered, you’re on the right path. Always strive for clarity first.
2. Tiny & Low-Quality Image
You may not know that variation 2 with the large images and product description viewable on mouse over was the winner. It resulted in a straight 9.46% increase in sales (96% chance to beat original).
So images will attract more visitors to your site. That much is clear. What’s more is that your site’s increased user engagement will result in longer visit times for users, allowing you more time to sell your product through both the content and the images. Dedicatedly if you are selling items that are mostly depending on looks, you should know by now that the visuals you use are the most important.
So, what makes a good image?
Defining the quality parameters of such an image is a complex process. Composition, clarity, brightness, resolution, strong contrast between foreground and background as well as a clean and uniform background are just some of the factors that need to be analyzed.
Using the right alt tags is often overlooked and can cost you high rankings.
Therefore, investing in high-quality product images definitely has a positive effect on your e-commerce success. Online customer expectations are quickly evolving and having the right images on your site is essential. Making sure they are high quality, presented in a consistent way and are also optimized for SEO is no longer optional but mandatory.
Investing in high-quality product images definitely has a positive effect on your e-commerce success.
3. No Visual Hierarchy Or Attention
Laying out your online store raises various questions. Your homepage serves as a hub for the best stuff on your online store, with components such as image sliders, shopping cart buttons, product thumbnails and buttons, and email marketing subscription forms.
Each is essential, but a lot of designers often forget the importance of organizing these elements in a logical hierarchy layout. If we take a look at some of the most creative, and successful, eCommerce stores, we can figure out a standard layout hierarchy, generating somewhat of a template for where each of these components sits on your page.
With a visual hierarchy in place, it's easy to navigate a website because actions begin to become recognizable due to the site's design. Your readers will be easy to recognize that what is clickable or unclickable. The keyword here is focusing on readability and navigability.
If you learn about the Fitt’s Law, you know the general rule that the eyes tend to be drawn to larger items which make them more clickable. So, elements should be made larger and stand out from the rest of the page.
All of the websites below are well designed. Each has its own style and, for our purposes, addresses a different level in the design hierarchy. Most naturally meet lower-level needs, but some are more concerned with higher levels and neglect some lower-level details.
The websites of Oliver James Gosling is single-page portfolios. It meets functionality and reliability needs, it is also aesthetically pleasing and start to meet creative needs. Oliver’s website has a “Back to top” link that moves down the page as you do.
4. Avoiding White Space
It is extremely important for designers to think about being clear with their layouts. Instead of complex layout, the simple one is the key to keeping the readers’ interested. A lot of elements, images, blocks, colors and different shape in a page can lead your visitors to bounce because they feel uncomfortable & illegible.
Whitespace is actually really important to web design because you can use it to improve readability and website performance. Not to mention, white space is part of the “less is more,” “make it simple”.
To include more white space in your designs and deliver a better result, start thinking about every detail of a page. Think about margins, header, footer, menus, images and captions, items in a list, words and letters. Think about all of these elements and start leaving more space between them, always keeping in mind that you want to create something elegant and clear while improving user experience.
Here are some examples of white space in store design for user experience.
Madebysofa uses white space to create a clean, minimalist look. This way, the emphasis is on website categories and links.
Philip House NYC features a lot of white space. The purpose here is to catch the eye and enhance some images and categories featured on the webpage.
White space is extremely important in web design for usability and readability and it emphasizes particular elements. Thinking about improving user experience and focusing on content is always a good way to go when designing a website. Whitespace can certainly help you deliver the experience that your client’s readers will enjoy, which usually leaves your client happy with the work you’ve done.
5. Not Mobile Friendly
It is estimated that in 2017, over 63.4 percent of mobile phone users will access online content, but there is not many online stores has this characteristic for optimizing. Well for starters, if you haven’t created a mobile website or introduced responsive features into your existing one, you are likely missing out on valuable SERPs rankings and traffic since the majority of your users will likely be visiting on their phones. So, it’s safe to say mobile is extremely important. Don’t forget about it when you sit down to hash out a UX design.
6. An Inadequate Site Search Engine
Site Search Engine is for those who know what they’re looking for. If a visitor know exactly what they’re seeking, they will opt to use the site search engine on the bottom of your page instead of sifting through categories and filters. That a large number of results come up may be nice unless half of them or more do not match with seekers’ expectation, which is truly an inconvenience.
Make sure the eCommerce software you’re using has a good built-in search engine, or look for plugins to extend its functionality. Ideally, a good site search engine should let users search by keyword, then refines the results based on categories suggested. Your users will feel more convenient if they can search the answer based on standards criteria (most popular, highest or lowest price,...)
Disgogs has excellent visual search suggestions which enable you to find related content and pages at a glance.
7. Poor Customer Service Options
This is similar to the hiding contact information. You need to make it easy for customers to get in touch with you if they have a problem or question. Otherwise, they will be likely to leave your page and even leave some unexpectedly bad reviews. Make it clear what the best way to contact you is if they have a technical question, a sales question, or they want to return an item.
Make sure that your FAQs page covers all of the common questions your customers might have, let them know how the return policy is and what they need to do, etc. A recommendation that a phone number, or a customer support form will increase their trust in your brand.
It’s never be done to have a perfect store design. Sometimes design is confused with decoration, but design is actually about helping your users do what they need to do and responding to their problems. Design isn’t for designers — it’s for users. Ultimately, we all design for our users and the easier a product we create for them is to use, the more likely they’ll use it.
Start Now: Creating Your Own Online Store with GemPages - The World #1 Drag & Drop Page Builder For Shopify