Which websites and apps do you use the most? Are you spending hours a day wandering the landscape of social media via Facebook and Instagram? Maybe your way of relaxing after a long day of work is some therapeutic online shopping.
Think about this—your favorite site or app suddenly stops functioning the way you are used to. You cannot find what once was simple information because the structure has changed. My guess is that if your favorite sites are difficult to navigate, you’re probably already looking for new ones. Ones that easily move you through their system, showing you pertinent information and variety without clouding the page. This weaving structure is called User Experience Design and it shapes every moment while you are browsing.
User Experience Design, UXD for short, ensures that your website is intuitively structured, understandable, and behaves appropriately. It is made up of several layers including strategy, scope, information architecture, page structure, and visual design. Simply put, it makes your site better.
For our purposes, we are going to focus on the latter three of that list as they are the physical components of your site. However, before you dive into all of that, you need to know your customers and your market. Strong UX strategy does not come out of thin air, but rather is created through customer interviews and competitive analysis. It makes certain that you are creating something worthwhile for your customers. This step, though simple, is crucial to creating great UX.
Now, let’s talk about 5 principles for better eCommerce design.
It’s important to understand the difference between your customers, and in eCommerce there are two distinct types: explorers and seekers. Explorers roam the digital aisles of your store, observing offerings and gaining familiarity with your brand and products. Seekers are determined—they know what they are looking for and seek it out directly.
In order to create positive user experiences, it is imperative to constantly balance these two characters. How do you do so? The answer is actually pretty simple: Navigation and Search.
The Explorer isn't tied to a particular product but rather prefers to see options and variety. Navigation doesn’t just help them find certain products, it also helps them know what is available. It presents customers with all the categories and types of products in stock, allowing users to sift through them efficiently. This is particularly helpful to first-time customers who may be unfamiliar with a website’s offerings. In a study done by the Baymard Institute, researchers found that 25% of desktop and 70% of mobile users use the homepage to get an understanding of what a site offers—this includes the navigation. Furthermore, they found that not displaying product categories in the main navigation creates severe issues for customers.
That means if you aren't establishing the proper navigation your run this risk of losing a significant amount of customers.
Search is usually geared to the seeker—one who is returning to a site and knows what they want. Unfortunately, there are many ways a customer may use your search – for a product, to ask a question, or using a synonym.
Amazingly, 70% of eCommerce websites require users to use the exact phrase or jargon that is on the site. Here’s a practical example: a search may not return any results for “blow dryer” if the product is called “hair dryer.”
Thankfully, there are tools that empower you to present a better search experience by handling synonyms, visual results, and similar products. Two of our favorites have been Klevu or Nextopia—both of which offer top-notch search experiences for your customers.
The important thing to remember about search and navigation is that they work in harmony. The various different types of navigation help a customer find what they’re looking for, anchor them to a location within the website, or help them narrow down a list of products. While search can help them find the product in their own words or with their own modifiers.
Have you ever heard the phrase, a picture is worth a 1,000 words? This couldn’t be more true for an eCommerce website. Investing in quality imagery and video will do more for your products than any flowery product description ever will. This is especially true on your product page. In fact, there are different kinds of images. You heard that right, different kinds! From compatibility and sizing photography, to lifestyle and customer generated pictures, all of these types of imagery can help tell the story of your products and answer questions for your customers.
Video is also increasingly important to the success of your website. The Baymard Institute found that 41% of visitors will watch a video on a product page. This is a massive chunk of would-be customers who could be won over by a well made video that shows off your products in the best light.
Don’t forget, these elements are stronger when they are complimented by well written copy that is clear and simple.
While image and video are certainly king when it comes to displaying products, it’s just as important to ensure that the text you have on a page is valuable and descriptive. The most obvious benefit is for SEO and accessibility purposes.
The big thing to understand about text is that your average customer probably won’t read all of it. In fact, only 16% of users are going to read it word-by-word, whereas 80% of them will scan it. On a page without any headings or bullets, users will naturally use an F-Pattern to scan a page. The more you can break up your text into small, digestible pieces, and use headings and short paragraphs the more likely your users are to read all the text.
This way of breaking up content can have two major benefits: The first being that you can pair text with imagery and video—which reinforces benefits or features of your products. Second, it ensures that you know exactly why someone would want to buy this product and what they are getting for it.
Consistency comes in many forms but perhaps it is most important in structure. It’s imperative to choose a category structure that works for all products. This means making sure that all your product pages have the same types of content across the board. Consistency is also revealed in your language and tone. Do you have a millennial-driven brand? You may use more slang and simpler phrases.
Another important place to create consistency is in the accessibility of your site. Accessibility refers to the act of ensuring that all of your users, even with those with disabilities that may require assistive technologies, can use your site. A common accessibility feature is creating high-contrast text which makes the copy more legible. At Gauge, we strive for an AA rating overall especially with color contrast, text size, and form field functionality. However, accessibility goes beyond just readable your text. It’s about adding alt tags for images to assist those with screen readers. It’s about enabling those who can’t use a mouse to navigate between form fields (spoiler: this is also great for people who can use a mouse).
Furthermore, when your website behaves, looks, and feels consistent it can make your brand feel more competent and trustworthy.
This last and most obvious UX principle is speed. It is perhaps the most noticeable issue and can lead to high page abandonment. Speed isn’t just a technical issue, it’s a UX issue too. By understanding response time limits, you can accurately understand if you are providing a great experience for your customers.
Traditionally, 0.1 seconds to 100 milliseconds will feel instantaneous to a user. This is what you should strive for regularly. A one second load time won’t feel instantaneous but will keep the user in their flow—they know the computer is working, but are patient with the system. Once you hit between three and ten seconds, users start to wish it was faster. At that point, you are looking at your customers abandoning the site.
Providing a speedy, responsive website is critical in establishing trust and competency with your customers.
These are only five of the many principles that can make a great eCommerce website. And while these are critical, recurring issues I see on websites, they aren’t the only things.
So the question is, what should you do?
Start by evaluating your own site. Ask yourself, “how easy is it for a user to find a product via the main navigation alone? Can someone use a synonym for your products in the search bar?” Ask potential or existing customers what they think and ask them to try to accomplish these tasks. If you want to know how much time people spend on your site, setup a tool like HotJar and start recording pages to see where people look and how far down the page they go. These can give you good indications as to how captivating your imagery and content is.
To get a leg up consider working with a design agency or have an in-house designer. Ask them about these issues. What do they think you need to do to improve the UX of your site? How many issues do they see? When you work with a new agency, ask them about the most common UX issues they see and what they do to solve them. That way you know you’re getting someone who is truly focused on the customer experience and the growth of your business.