When it comes to eCommerce and retail, a website’s internal search is one of its hidden treasures. Most of the eCommerce websites today seem to be using stemming and synonyms, at least in basic form..
During my tenure at Object Edge, I have managed the onsite search function for one of the largest online retailers in Latin America. When it comes to eCommerce and retail, a website’s internal search is one of its hidden treasures. It is often overlooked by online retailers and underutilized as a marketing tool.
According to Econsultancy:
These statistics show that onsite search is an important factor that affects business metrics. It therefore has become an increasingly important and essential component in a company’s digital strategy.
To further demonstrate the importance of onsite search, I tested and compared top eCommerce sites such as Amazon, Walmart, and Best Buy with some lesser-known retailers with whom I sometimes shop. Through this comparison, I have identified some of the most important search features that all online retailers should consider.
Visitors to an eCommerce site are there to look for products and services. But they shouldn’t be made to look for the search box!
The placement, size, and design of the search box are key factors that can start a user’s purchase journey on a positive note and should never be ignored.
Black Forest Decor is a great example of how simple search box improvements can make a significant difference. They made four major changes to their search field and saw a 34% increase in overall conversion rate of the site:
The best way for online retailers to optimize their search box is by testing different variations and seeing which one generates the most search queries and conversions.
Additionally, there are some best practices to abide by when developing and testing your search box.
Most online retailers place the search box near the top of the page, as this is where the majority of visitors expect to find the search box, like in this example from Walmart.
However, some retailers, perhaps while trying to maintain a cleaner design, tend to make their search boxes harder to spot, per the example from Abercrombie.
The optimum size of the search box depends on factors such as what kind of products are sold on the website, as well as user search behavior. The search box should be large enough so that users can see all the search terms they are typing, making it easier to correct any errors or misspelled words.
Amazon uses a search box large enough to accommodate large queries such as make, model, product codes, and so on.
The search box should have a clear call to action as we saw in the previous Black Forest Decor example. The space inside of the text box can be also be leveraged to explain what users can search for. It could be a simple text like “search by keyword or item #” so users know that they can do both. Or, it could contain more specific text that hints at the retailer catalog, like “Find anything for your home,” which Wayfair uses.
However, this default text that appears in the search text box should disappear as users click or start typing to enter their own search terms. Having to delete the default text before searching will get annoying for most users.
Autocomplete is a very useful functionality which can provide an improved search experience by reducing a lot of work for the users. According to this case study, Printerland, a UK printer and accessories retailer, saw four times more conversion rates by adding smarter search features to their site including autocomplete. In addition, customers who land on an autocomplete page suggestion are six times more likely to convert than those who don’t.
Home Depot’s website incorporates some of the autocomplete features to further contribute to a better user search experience:
Retailers can take advantage of today’s advanced autocomplete technologies to promote their products right in the search box and capitalize on merchandising opportunities while users are searching, (often known as Searchandising). This can be done with:
For example, Kohl’s shows the top products in suggestions along with product images:
Whereas Boden USA shows product description in autocomplete:
While the search box is critical, it’s not the only factor in onsite search optimization.
All of the efforts to optimize site search ultimately boil down to one goal: get customers the products they want, and get them fast. Filtering and sorting help to achieve just that!
However, according to a study conducted by Baymard institute, a staggering 34% of major eCommerce websites have a poor filtering experience. To provide a better user experience, online retailers should offer more than the basic site-wide filters like product category, price range, color, brand, and so on.
The key to site search success is to find the most relevant product in the least time - which means that filter and sort are your friends. Let’s consider some possible filtering options.
Category filters are filters that are specific to a particular category of products. All categories are not made equal.
For example: a “thread count” filter would make sense for “bed sheets” but does not mean anything in context of “handbags.” It would be more meaningful to have filters like “material,” “style,” etc., for handbags. It is interesting that 42% of the leading eCommerce sites do not even provide category-specific filters.
In the below example from Urban Outfitters, the website loses a majority of points when you get the same filters of “categories,” “size,” “color,” “brand,” and “price,” whether you search for “shoes” or “jeans.”
Macy’s, on the other hand, does show filters unique to categories like “denim fit,” “denim waist fit,” for the “jeans” category, and “shoe type,” “fabric content,” for the “shoes” category.
Customers should be able to apply as many filters as possible within the same filter type to get more refined and relevant results.
For example: as a customer looking for “jeans,” I might want to see my options for multiple price ranges. However, Urban Outfitters' website, as shown, would not let me do that. I would be forced to select only one price range filter at a time. Evidently, 32% of eCommerce sites do not have this logic implemented. Clearly, a lost opportunity!
eCommerce sites have traditionally had a left-hand side, vertical filtering bar. However, a new way has become increasingly popular in the last couple of years - Horizontal Filtering UI.
But does this new way actually perform better or is it just a trend? Let’s look into it: an eCommerce eye-tracking study confirmed that online shoppers tend to view the website in an F-pattern and are more fixated in the top parts of the website as compared to the sides.
Here's a heat map from the study, which shows accumulated eye-fixations of a typical online visitor.
Another research study showed that horizontal filtering performs well not only in terms of discoverability but also in utilization of site filters.
The Neiman Marcus website shows horizontal filters neatly. Though with one drawback - that the user doesn’t see all of their applied filters on the page, unless they click on individual filters.
Nordstrom, by comparison, has not only implemented the horizontal filtering UI effectively, but has also taken care of displaying all selected filters, further adding to a good user experience as shown below.
For all its benefits, horizontal filtering design has one major drawback, limited space! Therefore, this kind of design will work for only those types of businesses which naturally have few filters.
Almost every website offers sorting options on a site-wide search, like relevance, price low-to-high, price high-to-low and so on. Almost every website also ends up in a failure while trying to sort site-wide search results, with irrelevant results shown right at the top. I was surprised to find that key players like Amazon, Best Buy, AND Walmart also fail in this aspect.
For example: When you try to search for “sofa” and sort “price low to high” on Amazon, the results you get are not sofa!
Baymard Institute suggested a great solution to this problem: faceted sorting. Shown below is one way of implementing faceted sorting for our Amazon example above.
Here, the sorting suggestions include category-specific sort options such as “width,” “seating capacity,” “height,” within the scope of “sofas.” With this approach, instead of presenting the users with site-wide sort options like relevance, price, or user ratings, retailers can present category-specific sort types such as “capacity” for washing machines and “heel height” for boots.
Filtering and sorting in eCommerce websites is a vast topic and cannot be fully covered in a single article. However, the suggestions included in this article will hopefully provide some pointers for improvements.
Having good navigation capabilities with rich filtering and sorting is the first step towards making an eCommerce website more usable. However, that alone might not be enough to push the users to convert. The quality of search results is therefore very crucial.
Here are a few best practices to follow while serving the results to users:
On the search results page, the accuracy of the results is the most important. If a user searches for “black dress,” the website must provide the user with results for black dresses.
Also, the “begin with a bang” approach applies here. Retailers need to pay special attention to the first few results shown. Amy Africa, CEO of Eight by Eight (a B2B business which facilitates Online Sales Improvements) notes that: “Visitors look at six to eight things, but the majority of their attention will go to the first two. If the first two are incorrect, visitors will think your search function is broken.”
What about relevance? Are the results returned relevant to what users searched? Are the results returned relevant to business? It is important to find the right mix of user and business relevance.
Here are some of the questions that need to be answered for achieving the right relevance mix:
Users should know what the search was about, details on products (including product images, price, any available discounts, etc.) that they are trying to find on the search results page and how many results are shown per page.
Few websites keep loading the results on scroll without giving all the information to the user. Boden USA is one such example. Though it shows what the search was about (search results for “shirts” in the above example), it does not inform the users how many results were returned, and as one keeps scrolling, the results keep loading. While this might be a good approach for mobile since screen size is smaller, on desktop, it is better to limit the number of results shown on each page.
Today’s online users rely heavily on feedback from other users to judge the quality of products. When search results display the user ratings it increases users’ confidence and they are more likely to click on highly-rated products. Most websites today seem to be including user ratings in their search results pages.
As we shall see in the next section, there are a lot of ways online retailers can handle the misspellings and alternate phrases for products. Despite that, there is a very real possibility of users somehow landing on “No Results Page.”
First of all, it should be made obvious for the users that they have landed on a page with no results.
The next step then is to offer a path forward such as:
When users on Amazon hit a no results page, Amazon takes care of points 3, 4, 5 and 6 from the above list.
Nordstrom provides users with 2, 3, 4, 5 and 6.
It is unreasonable to expect that users will enter a perfectly formulated query. The internal search logic should therefore implement a broader query scope.
Yet according to Baymard Institute’s study, 34% of major eCommerce websites do not support search by product names, whereas 70% of the websites require search using website jargon.
Most often, users do not know the exact phrases or website jargon to search for in a website. Furthermore, they do not always know what they are looking for, and so they start with vague search terms. Sometimes they enter terms related to the use of items they are looking for or the occasion for which the item will be suitable.
For example, "prom dress,” or "casual shirt". Levi's website, however, does not return any results if a user searches for common terms like “casual shirt.”
The website doesn’t show the search term entered by the user, either.
It is important to accommodate realistic user synonyms and alternate terms especially if a website is highly technical and uses a lot of jargon. The search engine logic must go beyond exact titles and description, look for categories that products belong to, occasions or purposes products are used for, and so on.
As the saying goes, “to err is human.” Typos and misspellings are commonly observed when users search online. As previously noted, offering spell corrections in results as well as autocomplete, suggesting similar search terms, providing “did you mean . . .” results, and guiding users to modify the queries, all address misspellings and handle such errors. To go the extra mile, websites may also support homophones, which are words that sound the same, but are spelled differently, such as “piece” and “peace.”
Stop words include articles like “a,” “the,” “an,” prepositions like “of,” “for,” or conjunctions like “and,” “but.” These words negatively affect search relevance. One easy way to resolve this is to have a list of stop words in search, which will be ignored if found in user queries. Ignoring stop words can bring advantages like improving site performance and suppressing irrelevant results that contain these stop words.
In an eCommerce context, not using stemming and synonyms could result in a very bad user experience. Consider if a user searches for “tables” and the website does not return any results because all of its products have “table” in their product names or descriptions. Use of stemming can solve this problem.
Stemming refers to removing suffixes from words and reducing to morphological “stem.” In English, the terms “reduction,” “reduce,” and “reducing,” would all be stemmed to reduc.
However, stemming may not always be right for a website. It could sometimes get less relevant results. For example, a search for “university” could also return results with “universal” since both have the same stem.
Similarly, consider a situation where a user searches for “table” and the website does not return any results because all of its products have “desk” in product names and descriptions. Such problems can be solved by use of synonyms.
Most of the eCommerce websites today seem to be using stemming and synonyms, at least in basic form.
Though it is not possible to include all aspects of Onsite Search since it is such a broad topic, this article addresses the most common issues and ways to correct them.
If you’re looking to learn more about how you can optimize your onsite search, contact the team of experts at Object Edge for a free consultation call.
