Site-search lets you learn what your shoppers expect from you and shoppers who use sitesearch are more likely to convert than those who don’t. Provide sitesearch functionality and design your search box in such a way that it is easy to find and use.
1. SEARCH BOX
DESIGN
E C O M M E R C E
Design sitesearch that is easy to fin d and use
e C o m m e r c e U X D e s i g n a M i n e W h a t i n i t i a t i v e
2. 2e c o m m e r c e u x d e s i g n . c o m
Do you need to have sitesearch on your eCommerce
store?
Whether you are a large eCommerce store with a wide range of goods or a small one with simple
navigation, you definitely need to have sitesearch on your store as it would help you learn what your
shoppers expect from you and shoppers who use sitesearch are more likely to convert than those
who don’t. Even with a simple sitesearch feature you can better engage your visitors and drive
sales.
1
Time saved on category management everyday 2Hrs. See how
MineWhat brought an entire team onto one page.
L E A R N M O R E
3. 3e c o m m e r c e u x d e s i g n . c o m
Is your search box clearly visible and quickly
noticeable?
Let your shoppers hunt for products, not for your search box. Make your search box stand out so
that people can easily find it.
Sitesearch elements:
Avoid using only a submit button without the text field. That will make the search box hard to find.
Also avoid having only the text field without the submit button, not every user knows that they can
hit enter to submit.
Placement of the search box:
Position your search box away from all other boxes such as email signup. Place it consistently on
all pages except the checkout page. Top right, top center or in the main menu are popular positions
for the search box.
2
4. 4e c o m m e r c e u x d e s i g n . c o m
Size of the text field:
Along with making the search box more
prominent, a longer search field will also
allow the users see what they type which
would reduce errors. Make sure it can hold at
least 30 characters. Another thing you could
do is to look at your Site search data, find out
what your shoppers are searching for and
use that to decide what the optimal character
limit should be.
Contrast:
Make sure, the color of the input field
doesn’t make it hard to understand where
the search term should be typed in. Increase
the contrast between the site header, text
field and search button to increase the
prominence of the search box relative
to other elements.rather than a specific
category in order to avoid users searching
within a wrong category.
5. 1e c o m m e r c e u x d e s i g n . c o m
Is the search box easy
to use?
After you make your sitesearch easy to find,
make it usable.
Text in the search box:
Keep some meaningful text in the search box
and make it disappear on clicking so that the
users can enter their search term without any
confusion. If shoppers don’t find the desired
product in the search results, they might
search again with a slightly different search
term. So, keep their previous search term
in the search box so that they don’t have to
type the entire search term again.
3
6. 2e c o m m e r c e u x d e s i g n . c o m
Submit button:
The submit button should look different than
the input field and should either read search
or have a search icon. Show results even
when users press enter, but this doesn’t
mean that you can do away with the “submit”
button entirely.
Scoped search:
Though search scope is not necessary for
every eCommerce store, it is critical for large
stores with wide range of products. Allow
users to search within a particular category.
Default your search scope to entire store
rather than a specific category in order
to avoid users searching within a wrong
category.
7. 3e c o m m e r c e u x d e s i g n . c o m
Auto suggest:
Offer search suggestions as the user types in
a query. A dropdown with common searches
that will help reduce typos and avoid no
results found. It’s even better if you suggest
a few best-fit products along with thumbnail
images and price of the products suggested.
Land the shopper on the individual product
page if he clicks on any product suggestion.
category.
Read on to find out how a Shopify based luxury retailer increased
their landing page conversion by 200%.
L E A R N M O R E
8. P O W E R E D B Y
Product Analytics for eCommerce
The #1 eCommerce intelligence platform for your sales and marketing
teams.
Quickly spot what works and what doesn’t on your store. Drive more conversions.
www.minewhat.com >>
F R E E S I G N U P