42244

econsultancy_xml

According to <a href="http://www.fastsearch.com/The_Importance_of_Performance_in_eCommerce_Search_WJh1m.pdf.file">figures</a> from Fast Search (pdf), 30% of shoppers will use the search box on an e-commerce site outright, while a further 30% of those that have failed to find what they want through the navigation will turn to site search. So how can you make their lives a bit easier? Here are a few tips... Size of the search box The trend is for customers to enter longer search queries of two or more words, while those that are looking for the model number of a specific TV or laptop will also tend to enter longer strings. This means bigger search boxes may be needed. The text box should ideally hold around 30 characters / 5 words. If customers type longer queries in, then the text will simply disappear from view. This is no disaster, but having a longer search box makes it easier for customers to edit their search terms in case of misspellings. Kelkoo, for instance, has opted for a large search box with plenty of room for longer terms: <img alt="Kelkoo search box" src="http://farm3.static.flickr.com/2404/2738603276_fb3d1b9497_o.jpg" /> Make it easy to find The search box should be prominently placed on the page. Many websites have tended to stick it at the top right, but placing it in the centre will make it easier to find for shoppers. Comet has just released a new version of its homepage, with a much more prominent (and larger) search box. This decision was made after the retailer found that the search box was an effective conversion tool. Here's the old one, placed to the right of the page: <img alt="Old Comet search box" src="http://farm4.static.flickr.com/3248/2738621316_93e2f4c634_o.jpg" /> While in the new beta homepage, it is impossible to miss: <img alt="Comet - new search box" src="http://farm4.static.flickr.com/3049/2738621428_476305dddb_o.jpg" /> Offer prompted search When typing keywords into search boxes, customers have to describe the product in a few words, as well as guessing how the e-commerce site will have listed this item. This is an excellent way of making site search easier for customers by suggesting terms as they are typing, as with Google Suggest. Users can find what they want with minimal effort. Borders.co.uk has used this feature in its recent website revamp: <img alt="Borders autosuggest search tool" src="http://farm4.static.flickr.com/3192/2738605038_5e937a0d01_o.jpg" /> Allow customers to limit the scope of their search If customers are searching through a website with a large number of products, users may prefer to narrow their focus to a particular section of the site. Amazon is a good example of this; with its tool you can limit your search to one of 18 categories, making it more likely that results will be relevant: <img alt="Amazon search box" src="http://farm4.static.flickr.com/3070/2737766687_f073784c12_o.jpg" /> Clearly label the search box For most shoppers, it will be obvious what the search box is, but there is no reason to make people that are not as web-savvy work harder than necessary. Waterstones labels its search tool in a nice and clear way, although it has chosen to place its box on the left hand side of the page: <img alt="Waterstones search box" src="http://farm4.static.flickr.com/3228/2738604754_d50023a72f_o.jpg" /> Place the cursor in the search box when the page loads This is a small detail, but one that can make it easier for customers to start searching on your site. Google and the other major search engines all do this, speeding up the overall process for users. Not all e-commerce sites do this though. Kelkoo and Amazon both ensure that the cursor is automatically in the search box when the page loads, while for sites including M&S and Next, the user has to move the mouse and click before typing. Remove existing text from the search box A lot of sites, such as the example below from Marks & Spencer, place text inside the search box to further explain its function. When you click on the box, the text automatically vanishes, leaving you free to type in your search term. <img alt="M&S search box" src="http://farm4.static.flickr.com/3099/2738748146_cd2b2c40e3_m.jpg" /> Failure to do the latter part can be a frustration for customers, as it means they have to delete the existing text before entering their own search term. Thankfully, not many sites do this, though <a href="/blog/2586-site-review-disneystore-co-uk">Disney's UK store</a> is one offender. Related research: <a href="http://econsultancy.com/reports/web-design-best-practice-guide">Web Design Best Practice Guide</a> Related articles: <a href="/blog/2121-ten-site-search-tips">Ten site search tips</a> <a href="/blog/086-the-symbiosis-of-brand-trust-and-optimised-on-site-search">The symbiosis of brand trust and optimised on-site search</a>

<FormattedContent xmlns="http://www.e-consultancy.com/schema/formattedContent/"> <Paragraph>According to <Link URL="http://www.fastsearch.com/The_Importance_of_Performance_in_eCommerce_Search_WJh1m.pdf.file" Window="Self">figures</Link> from Fast Search (pdf), 30% of shoppers will use the search box on an e-commerce site outright, while a further 30% of those that have failed to find what they want through the navigation will turn to site search.</Paragraph> <Paragraph> <Quote>So how can you make their lives a bit easier? Here are a few tips... </Quote> </Paragraph> <Paragraph> <Emphasis>Size of the search box</Emphasis> </Paragraph> <Paragraph>The trend is for customers to enter longer search queries of two or more words, while those that are looking for the model number of a specific TV or laptop will also tend to enter longer strings. This means bigger search boxes may be needed.</Paragraph> <Paragraph>The text box should ideally hold around 30 characters / 5 words. If customers type longer queries in, then the text will simply disappear from view. This is no disaster, but having a longer search box makes it easier for customers to edit their search terms in case of misspellings.</Paragraph> <Paragraph>Kelkoo, for instance, has opted for a large search box with plenty of room for longer terms: </Paragraph> <Paragraph> <Image AlternateText="Kelkoo search box" Source="http://farm3.static.flickr.com/2404/2738603276_fb3d1b9497_o.jpg"> </Image> </Paragraph> <Paragraph> <Emphasis>Make it easy to find</Emphasis> </Paragraph> <Paragraph>The search box should be prominently placed on the page. Many websites have tended to stick it at the top right, but placing it in the centre will make it easier to find for shoppers.</Paragraph> <Paragraph>Comet has just released a new version of its homepage, with a much more prominent (and larger) search box. This decision was made after the retailer found that the search box was an effective conversion tool.</Paragraph> <Paragraph>Here's the old one, placed to the right of the page:</Paragraph> <Paragraph> <Image AlternateText="Old Comet search box" Source="http://farm4.static.flickr.com/3248/2738621316_93e2f4c634_o.jpg"> </Image> </Paragraph> <Paragraph>While in the new beta homepage, it is impossible to miss: </Paragraph> <Paragraph> <Emphasis> <Image AlternateText="Comet - new search box" Source="http://farm4.static.flickr.com/3049/2738621428_476305dddb_o.jpg"> </Image> </Emphasis> </Paragraph> <Paragraph> <Emphasis>Offer prompted search</Emphasis> </Paragraph> <Paragraph>When typing keywords into search boxes, customers have to describe the product in a few words, as well as guessing how the e-commerce site will have listed this item.</Paragraph> <Paragraph>This is an excellent way of making site search easier for customers by suggesting terms as they are typing, as with Google Suggest. Users can find what they want with minimal effort.</Paragraph> <Paragraph>Borders.co.uk has used this feature in its recent website revamp:</Paragraph> <Paragraph> <Image AlternateText="Borders autosuggest search tool" Source="http://farm4.static.flickr.com/3192/2738605038_5e937a0d01_o.jpg"> </Image> </Paragraph> <Paragraph> <Emphasis>Allow customers to limit the scope of their search</Emphasis> </Paragraph> <Paragraph>If customers are searching through a website with a large number of products, users may prefer to narrow their focus to a particular section of the site.</Paragraph> <Paragraph>Amazon is a good example of this; with its tool you can limit your search to one of 18 categories, making it more likely that results will be relevant:</Paragraph> <Paragraph> <Image AlternateText="Amazon search box" Source="http://farm4.static.flickr.com/3070/2737766687_f073784c12_o.jpg"> </Image> </Paragraph> <Paragraph> <Emphasis>Clearly label the search box</Emphasis> </Paragraph> <Paragraph>For most shoppers, it will be obvious what the search box is, but there is no reason to make people that are not as web-savvy work harder than necessary.</Paragraph> <Paragraph>Waterstones labels its search tool in a nice and clear way, although it has chosen to place its box on the left hand side of the page: </Paragraph> <Paragraph> <Image AlternateText="Waterstones search box" Source="http://farm4.static.flickr.com/3228/2738604754_d50023a72f_o.jpg"> </Image> </Paragraph> <Paragraph> <Emphasis>Place the cursor in the search box when the page loads</Emphasis> </Paragraph> <Paragraph>This is a small detail, but one that can make it easier for customers to start searching on your site. Google and the other major search engines all do this, speeding up the overall process for users.</Paragraph> <Paragraph>Not all e-commerce sites do this though. Kelkoo and Amazon both ensure that the cursor is automatically in the search box when the page loads, while for sites including M&S and Next, the user has to move the mouse and click before typing.</Paragraph> <Paragraph> <Emphasis>Remove existing text from the search box</Emphasis> </Paragraph> <Paragraph>A lot of sites, such as the example below from Marks & Spencer, place text inside the search box to further explain its function. When you click on the box, the text automatically vanishes, leaving you free to type in your search term.</Paragraph> <Paragraph> <Image AlternateText="M&S search box" Source="http://farm4.static.flickr.com/3099/2738748146_cd2b2c40e3_m.jpg"> </Image> </Paragraph> <Paragraph>Failure to do the latter part can be a frustration for customers, as it means they have to delete the existing text before entering their own search term. Thankfully, not many sites do this, though <Link URL="/blog/2586-site-review-disneystore-co-uk" Window="Self">Disney's UK store</Link> is one offender.</Paragraph> <Paragraph> <Emphasis>Related research:</Emphasis> <LineBreak /> <Link URL="http://econsultancy.com/reports/web-design-best-practice-guide" Window="Self">Web Design Best Practice Guide</Link> </Paragraph> <Paragraph> <Emphasis>Related articles:</Emphasis> <LineBreak /> <Link URL="/blog/2121-ten-site-search-tips" Window="Self">Ten site search tips</Link> <LineBreak /> <Link URL="/blog/086-the-symbiosis-of-brand-trust-and-optimised-on-site-search" Window="Self">The symbiosis of brand trust and optimised on-site search</Link> </Paragraph> </FormattedContent>

2008-08-06T12:51:00+01:00

econsultancy_xml

While many web shoppers may prefer to browse through a website using the navigational links, the importance of the search tool should not be overlooked. If shoppers arrive at your site with a clear idea of what they want, then using the search box is the obvious option. This also indicates a clear intent to purchase, so the tool has the potential to convert well.

<FormattedContent xmlns="http://www.e-consultancy.com/schema/formattedContent/"> <Paragraph> <Emphasis>While many web shoppers may prefer to browse through a website using the navigational links, the importance of the search tool should not be overlooked.</Emphasis> </Paragraph> <Paragraph>If shoppers arrive at your site with a clear idea of what they want, then using the search box is the obvious option. This also indicates a clear intent to purchase, so the tool has the <Quote>potential</Quote> to convert well.</Paragraph> </FormattedContent>

false 2671

366108

Tips on site search box design false

2008-08-12T09:30:00+01:00

tips-on-site-search-box-design

2009-04-30T02:17:25+01:00

1760