Site Search Box Best Practices Part 2 – Size

Posted by Steve Groenier, March 15th, 2012 at 5:55 am PST
Categories: Site Search, Site Search Tips | 2 Comments »
   

In continuation of our series on site search box best practices, today we dive into the size of the search box.  In our analysis of search boxes of the top 50 retailers on the IR 500 we looked at two components of size.  The first was the overall space devoted to site search functionality.  This included things like any text in front of the search box, drop downs menus to refine the search by department and the search submit button. The second space we measured was the size of the search input box.  In both cases, we took the height X width to calculate the approx. total pixels.

Given the diversity in the search box placement we found in part 1 of our analysis, it should come as no surprise that we also found the size of the search box to vary wildly. The total pixels ranged from 29,820 at Barnes & Noble to 2,646 pixels at Gap. The average area for all 50 retailers came in at 10,859 and the retailer closest to this number was Kohl’s.

Largest Search Box Area – Barnes & Noble (29,820 pixels)
barnesandnoble-header-590

Smallest Search Box Area – Gap (2,646 pixels)
gap-header-590

Average Search Box Area – Kohl’s (10,859 pixels)
kohls-header-590

To get a better idea of the distribution in search box sizes among the top 50 retailers, here is a graph of the total pixels. Aside from the sharp decline with the first seven sites, the distribution was fairly even.

search-box-total-size

Here are some examples from the retailers with the most amount of space dedicated to search.

staples-header-590

amazon-header-590

officemax-header-590

newegg-header-590

Search Input Box Size

In our analysis of the input box size, we found a fairly wide distribution there as well. The largest input box was from Overstock.com and measured at 13,312 pixels while the smallest was Amway with just 1,632 pixels.  The average of all 50 retailers came in at 5,969 and CDW was the closest to that with 6,312.

Largest Search Input Area – Overstock.com (13,312 pixels)

overstock-header

Smallest Search Input Area – Amway (1,632 pixels)

amway-header

Average Search Input Area – CDW (6,312 pixels)

cdw-header-590

The distribution of search input box sizes among the top 50 retailers showed a fairly even spread from the highest to the lowest.

search-input-size

The biggest surprise for me with this analysis is just how far apart retailers are on the emphasis they give to the site search box.  I suspect that this is also an indication that there has been very little testing done on how the site search box impacts the customer experience and revenue.

The good news is that the tools to test this sort of thing continue to improve and become more accessible to retailers.  For SLI Systems customers, the capability to do A/B and Multivariate testing is already available. If you have conducted any tests on the size of your site search box please do share your findings in the comments below.

In Part 3 of this series, I will reveal what we learned about the default help text from our search box analysis.

   

2 Responses to “Site Search Box Best Practices Part 2 – Size”

  1. How Should Online Stores Design their Site Search Box? | Findwatt Says:

    […] Size of Search Box – How big should your search box be? My bias here is always toward a larger search box both in length and width, again like Amazon or Overstock. Length is important so the entire query can be seen on the screen. According to Steve size ranged from 2K pixels (Amway) to 29K pixels (Overstock) with the average at about 11K. My Advice: bigger is better. […]

  2. Website Search Says:

    The size will depend on the overall outlook of the site. If you have a minimalistic site, then you need to jive the search box so that it will be in uniform however, if you wanted your search box to be noticeable, then, you can have it in big sizes.

Leave a Reply