Let’s say you have a custom CMS for your online store. You ask this and that, and then comes the time when you need to add a search box. You use basic usability rules (place it at the top, big search box, big button, colorful button, simple text button – “search”), you might even add advanced things, such as auto-complete or advanced criteria for search. But what should you focus on on the results page? How should you make, functionality-wise, the search results page for an e-commerce?
See this video, which explains the things I say below:
- Use breadcrumbs for categories. The first suggestion I would have for a large e-commerce web site is to show a few categories at the top. For example, if I search for “8 GB of RAM” (my query), and this fills in perfectly a category called “RAM”, and you have a lot of products whose titles exactly match what I just searched for, show me, at the very top of the results, these breadcrumbs: “Home » PC Components » RAM” / “Home » Laptop accessories » RAM” / “Home » PC Components » RAM drives”. On the other hand, you should find solutions to avoid displaying breadcrumbs for categories which contain a lot of products, but in none of the product titles you find RAM (so, although you will probably have a lot of laptops with 8 GB of RAM, in neither the name of the category or the name of the products inside you will find “RAM”, so don’t show me bread crumbs for these”).
- Give me some options for filtering. But show me the categories which most closely match my query. So, in the above example, show me first options to filter the categories which have products which contain the word I searched for in the title. Also, let’s say I search for “canon printer”. The store should first match this to the category (“printers”), and then to the brand (“canon”). But what if there’s a video camera from Canon, which also has the option for printing still shots? I have two options for this:
- Either display only Canon printers, and then, at the end, have a link “see all the products which match the query”.
- Or display all the products, including the video camera from Canon which can also print still shots, but first put all the matching products in the Canon printers category.
- Use synonyms. If I search for “Intel processor” / “Intel CPUs” / “Intel CPU” / “Intel microprocessor” / “Intel microprocessors”, I should get the same data.
- Allow room for typos. If I type “Inteld” /”Yntel” / “Yntell ” / “Ynntel” / “Intell” / “Int3l” / “Ymtel” / “Ytel”, and you have no results to display, show me a message at the top: “We have no results for your query, “Ynntel”, we are showing you results for the closest match, “Intel”. And then display me first all the products you have on your store produced by Intel, and only afterwards the products which contain “Intel” (laptops, for example). How to find typos? Go to your Analytics software, and have it show you (if it doesn’t, set it to gather data, then revisit after a few weeks and you have some data) all of the searches which had no results displayed. Manually go through the list and find patterns such as these. Create replacement tables: “when user types Yntell, alwyas consider it’s Intel”. You should also allow for missing letters (“Itel”). Also, the room for error should match maximum 30% of the word, and you should have some rules, such as: nn = n, y = i, n = nn, and also a pattern with letters being close one to another on the keyboard (so, if Y type “Ymtek”, you should be aware that on a keyboard “m” is close to “n”, and “k” is close to “l”, thus “Ymtek” should actually be considered as a valid entry for “Intel”, since “Y” is also “I”). So, if I type “Aqvop”, instead of “laptop”, you should be giving up on closest match. This is very close to 50% rate of differenatiation. Also, there are priorities in a search. So, if I type something is closely related (you should make some rules, based on what I wrote above) to the title of a category / product / manufacturer on your web site, first show me those items. Also, you should also use synonyms for misspelled words: “prtble divice” should be treated the same as typing “laptop”. You should mostly be using alternative typing options when the page has no results. If you’re quite uncertain whether the user typed wrongly or he just really wants to find some “intell” products, show a “do you mean?” option.
- Your closest bet to displaying results would be relevance. The first displayed things should be the most relevant things. So, if type “laptop”, show me a breadcrumb or a link to “laptops” category on your web site. If I type “Sony laptop”, show me a link to Sony laptops sub-category (or the laptop category filtered by “Sony” producer). If I type “Sony Vaio SVE1513F1EW”, show me first that product whose title most closely matches the entry. If the product is no longer on your web site, show me the deleted product, with a clear marking of the fact that the product is not available for ordering. Also, have a “Sort by” option in the results page. The first option should be “Relevancy”, but you should also have options such as “sales”, “price low to high / high to low”, even alphabetically (although I’m not a big fan of this sorting mechanism).
- In an ideal world, you would have a mechanism for automatically learning from searches. So, if I type “Sony Vaio” and in the end I order a specific laptop, and two other people do the same thing, you should learn from this mechanism and the next time someone searches for “Sony Vaio”, you should display first the link to “Sony Vaio” laptops (sub-)category, but then, on the listing of the products themselves, you should first show me the Sony Vaio the three other people have ordered. Even if I click on “Sony Vaio” (sub-)category, that laptop should still be the first. But if I order another laptop, and this process gets repeated two times, you should learn from this, too.
- Display more information about the most important results on the page. Let’s say my query is, based on your evaluation, 80% certain that it is about a certain manufacturer / (sub-)category / product. Let’s say you know pretty much exactly what I want to search (I type “Sony Vaio laptops”, you know, pretty much, what you should show me). Should you, in this case, do a Google’s “I’m feeling lucky” kind of result, and directly send me to that specific page I want to go? I would say no, because there is still a small chance I only want to see a list of laptop accessories which contain “Sony Vaio laptops” in their description. In such a case, I would suggest you give a big space to the most prominent result, like already display a few characteristics of the product (if I search for “Sony Vaio SVE1513F1EW”), of display the most sold products from the manufacturer (if I search for “Sony”), or display the first products from the (sub-)category (if I search for “Sony laptops” or “Sony Vaio”), and after that space leave some room for the other results (or links to “see other products, in the following categories”). Google does this often with Knowledge Graph.
- You should also do your best to know different categories. If I type “ssd laptop”, you should know that this can either be a list of SSDs which can be installed on laptops, or laptops which have SSDs on them. In this case, you should first find a match in product category (in this case, the match is both for “laptop” category, and for “SSD” category). If a match has been found for the product title, you should now focus on finding a secondary match, on a filter. In this case, the filter in laptops should have “Laptops with SSDs” in it, and the filter for SSD should have “laptop-compatible SSDs”. Thus, since both of these queries match exactly my query, you should display the two (sub-)categories with equal importance.
- Learn from my history. If I type “ssd”, and browse the category and a few products, then I type “laptop ssd”, you should know that I’m not looking for a laptop with an SSD, but for SSDs which are meant to be used on laptops.
- Show me realated searches. If I type “sony laptops”, show me a link to search for “Sony ultrabooks” or “HP laptops”.
- Use category filters on your searches. If I type “laptop 15″, you should pretty much understand out of this that I’m looking for the laptops category, and I want to filter results to items with a diagonal of 15”. Show me some breadcrumbs to go to “Laptop” category, filtered by 15″ monitors. If search “laptop hybrid”, show me a link to go to “laptops” category, filtered by having internal hybrid disks.
- Try to match my query. Let’s say I type “laptop 8 gb”. The MB / GB / TB could refer to different things – RAM / hard-drive / processor cache / integrated video. But you should be the expert seller and know that most people don’t care and search for certain processor cache or integrated video memory. And RAM size is generally for a laptop in the area of 2 GB / 4 GB / 6 GB / 8 GB / 12 GB / 16 GB / 24 GB / 32 GB. SSDs start from 64 GB and to 250 GB. What’s more than 500 GB is a hard-drive. So, depending what I add after laptop, you should first focus on showing me results which closely match my query. So, the query for “laptop 8 gb” should display mostly results which have in them laptops with 8 GBs or RAM. “laptop 128 gb” should show laptops with SSDs of 128 GB. And “laptop 2 tb” should show me laptops with big internal hard drives. At times, you can’t be sure. 500 gb can be a very small hard drive or a very big SSD. Either give me two options at the beginning of my search results page (“we have, for your query, either laptops with SSDs of 512 GB, or hard drives with that capacity”), or directly show me a few products from each of these categories. See suggested searches on Amazon.com, by typing “laptop 4gb” / “laptop 256 gb” / “laptop 1 tb” on amazon.com search box (see my video).
- You should also learn from searches by manually looking over them. On a business level, if I type “pink laptop” and you show me no relevant results, and I exit the web site immediately, and two other people do the same thing, you should be learning from this. If I refine my searches: “Sony Laptop” » “Sony Laptop 8 GB RAM” » “Sony Laptop USB 3.0”, and I type a few queries like these, you show me no relevant results, I would exit the search quickly. Learn from this and be better next time.
- Start with the most important things. You might look at the above list and consider that it’s not worth the effort. I dare to say the it’s more difficult to imagine the “right” process of displaying results for a search query on an e-commerce web site, than actually implementing it. For this, I give you another tip – go to your Google Analytics and see which are the most searched-for terms on your web site. If people look for “sony laptops” and all they get is a list of random products, some of them Sony laptops, but also products which have the words “sony” and “laptops” in the product description, all mixed randomly, then perhaps you should fix this. Also, if a lot of people search for “soni laptops” and they get a “we have no results for your query” page, you should find a solution for this. Focus first on the products which bring you the most profits, the products with the most visitors, the products more searched for. Also, grab the low hanging fruits. It’s not that complicated to make a list of 100 combinations for writing “sony vaio laptops” (“sony vaio notebook” / “sony vaio netbook” / “sony vaio porbable device” / “sony vaio portable computer” etc.), and having a dedicated result for this. So – for the list of producers, for the list of categories and sub-categories, for list of categories with filters, you should find it easy to display. In the end, you should get a result which should outcompete a site: search on Google easily, but mostly on specific things, such as a filtered category (display only laptops with 4 GB of RAM).
How’s the reality? Let’s go live. :)
I will do some searches on e shop, and generally search for these:
- sony
- sony vaio
- sony laptop
- Sony SVF1421ACXB
, and on Apple.com’s case, for:
- ipod nano
- iphone
- iphone 5s
- yphone
I took the • Average monthly unique visitors to U.S. retail websites 2014 | Statistic, and Topul celor mai mari retaileri online de IT&C | Ziarul Financiar – in Romania):
See this video, which details the things I write about below:
- Amazon.com:
- Amazon.com: sony
- I would prefer to have the number of filtered products in parenthesis;
- These are quite useful: “Related Searches: sony camera, sony headphones, sony xperia.”;
- The page has ads, but they’re related to the query;
- Amazon.com: sony vaio
- I would prefer to have “Computers & Accessories » Laptop Computers” written more prominently;
- Their filters are not 100% accurate;
- Sorting is based on category (choose a department to search); quite nice!
- Amazon.com:
- I actually like this: “Notebook Type: Laptop OR Ultrabook OR 2 in 1 Laptop/Tablet”;
- I don’t like these choices: “Brand: Sony / Thor / Bolkin … etc”; it should be obvious what I’m searching for;
- Amazon.com: Sony SVF1421ACXB
- Some products on the page are not related to the query;
- Amazon.com: soni
- They know what I mean;
- I like the fact that they also show results such as “sonic” or “soni”, among “Sony” results;
- Amazon.com: sony
- eBay.com:
- sony | eBay
- I like that they’re sorted by best match;
- All the products have “Sony” in their title;
- The category sorting is fine, with numbers in parenthesis, with the most prominent categories first;
- sony vaio | eBay
- I think for this search “Laptops & Netbooks (4,297)” should be more relevant than “Drives, Storage & Blank Media (100,776)”; the results on first page clearly indicate this!
- Very good filtering;
- sony laptop | eBay
- All the results are Sony laptops;
- Sony SVF1421ACXB | eBay
- Although this (and a few others) appears among the results: “19.5V 4.7A 90W Laptop Power Supply AC Adapter Charger for Sony Vaio SVF1421ACXB”, the page itself is still quite relevant;
- soni | eBay
- They understood my query;
- sony | eBay
- Apple.com:
- Apple – Search Results for ‘ipod nano’
- The top results are much too diferent than the rest, they look like an ad;
- The product image, while welcomed, is much too small;
- The results have no images;
- They have a lot of results with press info; not good!
- Apple – Search Results for ‘iphone’
- I think iPhone 5s is more popular than iPhone 5c, which is the first result displayed;
- Apps for iPhone seems totally unrelated;
- I don’t like the display in columns;
- The font is too small;
- Apple – Search Results for ‘iphone 5s’
- Compare iPhone models has two different links, and it’s not relevant;
- Apple – Search Results for ‘yphone’
- They don’t seem to consider that “yphone” is similar to “iphone”, but they do offer this as a suggestion, which is fine;
- Apple – Search Results for ‘ipod nano’
- Walmart.com:
- sony – Walmart.com
- The first page of results is pretty good;
- I like the fact that they put in bold characters the “Sony” word;
- The font is a little small;
- sony vaio – Walmart.com
- It shows quite a few accessories, instead of the required product; on the other hand, I do expect a brick & mortar business to sell more accessories than an online store (I think people tend to buy small value items more from brick & mortar stores);
- I like the fact that the Sponsored Products are very un-obtruding;
- sony laptop – Walmart.com
- I like the “Only at Walmart” badge! Powerful message!
- Very good to have a “Choose my store” option;
- sony svf1421acxb – Walmart.com
- They’re nowhere near in here;
- soni – Walmart.com – When I wrote “soni”, Walmart.com wasn’t sure: “Did you mean “sony” or “sonic” ?”. So, I typed “sonee”: sony – Walmart.com, and Walmart “said”: “Showing result for sony, search instead for sonee”.
- Quite good, and since they did have some results, even for “soni”, they did the right thing;
- Perhaps I would add in such a page a photo with the brand logo (Sony);
- sony – Walmart.com
- Target.com:
- sony at Target
- While all the products on the first page are Sony-related, they somewhat “feel” as if they do not belong there;
- There is plus sign (reminding me of “target”, somewhat), but it’s very small, it’s hard to read what’s on the page; they have a “views” option, but the standard is too small for my taste;
- They don’t discriminate when they show filtering options; Sony has 267 products, right beneath it are 3 brands with one item, then there’s another brand with 31 items; that’s an illogical way of showing things; on narrowing by category, they have 3 categories with 100+ items, and 5 categories with
- sony vaio at Target
- It’s got no relationship with what I searched, but, still, I think it’s OKish;
- I filtered the results based on price, and don’t seem to have any option of cancelling my selection;
- sony laptop at Target
- They have two Sony laptops, one is on the 2nd position, the other one is the last on the list;
- They show me 5 keyboards with the same price and different color; I would look for solutions to not occupy this much of screen estate with this;
- Sony SVF1421ACXB at Target
- There should be a search box in the error page; there should also be an option to quickly search for “Sony” on the page;
- This: “guests who searched ‘sony svf1421acxb’ also viewed.” is very good;
- soni at Target
- No suggestions to search for different things;
- sony at Target
- eMAG.ro – A Romanian retailer, for the end (they are the biggest – Topul celor mai mari retaileri online de IT&C | Ziarul Financiar – in Romania):
- Cautare: sony – eMAG.ro
- Very little variety in the first page; although they do have laptops, and probably they do have sales for those products, no laptop is displayed;
- Almost no filtering (very few options – category & seller);
- No option to sort by sales/popularity;
- I like the fact that they combine multiple products based on color;
- It’s the first retailer to have “add to cart” right from search results; it’s a different mindset; :)
- The current branding (World Cup) is too big for my taste;
- The page is clean and easy to understand;
- Cautare: sony vaio – eMAG.ro
- Zero filtering;
- No related searches;
- The first product displayed on the page is a refurbished one; not so good; it’s a 1000 USD+ product, people who buy this might not be as interested in refurbished products;
- Cautare: sony laptop – eMAG.ro
- The results page is extremely good – first laptops, then auxiliary products; great job!
- Cautare: Sony SVF1421ACXB – eMAG.ro
- No results; the page doesn’t have a search box, a list of links which are related to the search (it does give me links, but they’re totally unrelated); the store could have easily broken the search query in two, find that they do have sony products, and at least give me a link such as “Look for «Sony» products on our web site”;
- The “Sort by” and “Display as” options on the page seem un-welcomed on a page with no results;
- The bare minimum would be to have a link to the homepage, which is missing;
- Cautare: soni – eMAG.ro
- Although they give no sign of suggesting that “soni” might actually be “sony”, they do give some relevant results to “soni”, so the page is OKish; not perfect, but OKish;
- Cautare: sony – eMAG.ro