<img height="1" width="1" style="display:none" src="https://q.quora.com/_/ad/ad9bc6b5b2de42fb9d7cd993ebb80066/pixel?tag=ViewContent&amp;noscript=1">

6 Quick Tips for Loading Products in Search Results

November 12 2018

If search results lead to more than 50 or so results, its best NOT to load all products at once. This is mainly to do with potential performance issues. 

While each have their drawbacks, most ecommerce sites rely on either Pagination Links, Load More Buttons and Endless Scrolling for loading additional products in search results.  

Here are 6 tips you can follow to make sure you provide the best performing search experience for your customers. 

Design a frictionless shopping experience for your users. Download our 'Search  and Navigation UX Design Guide'.

These 6 tips are taken directly from our Search and Navigation UX Design Guide:

  1. Show the total number of products in the list at the top 

  2. Use “Load More” button instead of "Endless Scrolling” and pagination links. Endless Scrolling encourages extensive scrolling by the user and often takes focus off of the best results. Pagination links are rarely used and if too many pages are displayed it can often discourage the user from browsing the list.

  3. When using dynamic loading (i.e. endless scrolling), the default number of products is 50-100 items for categories (fetched in sets of 20), 25-75 for search and 15-30 for mobile. If using "load more” button or pagination, 20-30 items per page should be the limit. 

  4. Don’t give the option of choosing how many products can load, or of adjusting the number. Use dynamic loading and a contextually dependent number of products (e.g. dynamic number depending on relevance score of search results). 

  5. Pre-fetch a number of products during the loading time, usually 5-10

  6. Avoid fatigue, halt the scrolling process at 100-150 products

Navigation UX Design Guide

 

DOWNLOAD THE GUIDE

The guide includes tips for designing category structure, facets and filters, autocomplete, product lists,  hover and hit thumbnails, loading products, and search box

Download our 'Site Search and Navigation UX Design Guide'

Topics:

eCommerce Site-Search
eCommerce Design
Search & Navigation
UX

Subscribe to our newsletter

Subscribe to our newsletter