{"id":64320,"date":"2019-02-06T15:28:20","date_gmt":"2019-02-06T15:28:20","guid":{"rendered":"https:\/\/silicondales.com\/?p=64320"},"modified":"2019-12-09T14:44:44","modified_gmt":"2019-12-09T14:44:44","slug":"ecommerce-guide-to-ux","status":"publish","type":"post","link":"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/","title":{"rendered":"How to do eCommerce right: the Silicon Dales guide to UX for online retail"},"content":{"rendered":"<p>UX or User Experience in the context of online retail, means the ways an online store can be presented, laid-out and linked together to improve User Experience.<\/p>\n<p>The most obvious example we usually give to clients is making the buy button bigger, brighter and &#8220;above the fold&#8221;. However, there are entire teams dedicated to UX and an industry around the science of improving usability on eCommerce websites. Things can get really granular down to the proven best wording for a button and the exact font size and ratios for different elements in a website.<\/p>\n<p>It can help to bring some expertise in on these decisions, or skip the decisions and use a popular theme or platform where all these decisions will have been carefully combed over by experts.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_65 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<p class=\"ez-toc-title\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-662dc579b87ca\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"ez-toc-cssicon\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #0a0a0a;color:#0a0a0a\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #0a0a0a;color:#0a0a0a\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-662dc579b87ca\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#What_Google_Thinks\" title=\"What Google Thinks\">What Google Thinks<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#The_Silicon_Dales_Guide_to_UX\" title=\"The Silicon Dales Guide to UX\">The Silicon Dales Guide to UX<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Home_landing_page\" title=\"Home \/ landing page\">Home \/ landing page<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Clear_CTA_above_the_fold\" title=\"Clear CTA above the fold\">Clear CTA above the fold<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Have_descriptive_CTAs\" title=\"Have descriptive CTA&#8217;s\">Have descriptive CTA&#8217;s<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Clear_benefit-oriented_value_props_above_the_fold\" title=\"Clear benefit-oriented value props above the fold\">Clear benefit-oriented value props above the fold<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Dont_use_full_page_interstitials\" title=\"Don&#8217;t use full page interstitials\">Don&#8217;t use full page interstitials<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Remove_automatic_carousels\" title=\"Remove automatic carousels\">Remove automatic carousels<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Display_top_categories_on_homepage\" title=\"Display top categories on homepage\">Display top categories on homepage<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_legible_font_sizes\" title=\"Use legible font sizes\">Use legible font sizes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_social_proof\" title=\"Use social proof\">Use social proof<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Menu_Navigation\" title=\"Menu &amp; Navigation\">Menu &amp; Navigation<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Consolidated_menus\" title=\"Consolidated menus\">Consolidated menus<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Store_locator_buttons\" title=\"Store locator buttons\">Store locator buttons<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Click-to-call\" title=\"Click-to-call\">Click-to-call<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Keep_menu_options_on_one_page\" title=\"Keep menu options on one page\">Keep menu options on one page<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#For_main_product_categories_order_by_traffic_volume_If_using_sub-categories_organize_alphabetically\" title=\"For main product categories, order by traffic volume. If using sub-categories, organize alphabetically\">For main product categories, order by traffic volume. If using sub-categories, organize alphabetically<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Include_post_sales_activity_in_the_menu\" title=\"Include post sales activity in the menu\">Include post sales activity in the menu<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Search\" title=\"Search\">Search<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Include_search\" title=\"Include search\">Include search<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Make_search_visible\" title=\"Make search visible\">Make search visible<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-22\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_auto-suggestions\" title=\"Use auto-suggestions\">Use auto-suggestions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-23\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Implement_spelling_correction\" title=\"Implement spelling correction\">Implement spelling correction<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-24\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Always_return_results\" title=\"Always return results\">Always return results<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-25\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Include_previous_or_top_searches\" title=\"Include previous or top searches\">Include previous or top searches<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-26\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Category_Product\" title=\"Category \/ Product\">Category \/ Product<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-27\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#The_Next_example\" title=\"The Next example\">The Next example<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-28\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Have_a_value_prop_at_every_point_in_the_funnel\" title=\"Have a value prop at every point in the funnel\">Have a value prop at every point in the funnel<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-29\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Allow_users_to_sortfilter_large_number_of_products_easily\" title=\"Allow users to sort\/filter large number of products easily\">Allow users to sort\/filter large number of products easily<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-30\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Add_urgency_elements\" title=\"Add urgency elements\">Add urgency elements<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-31\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Have_price_info_above_the_fold_on_product_pages\" title=\"Have price info above the fold on product pages\">Have price info above the fold on product pages<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-32\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Secondary_CTAs\" title=\"Secondary CTA&#8217;s\">Secondary CTA&#8217;s<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-33\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#If_large_number_of_products_add_reviews\" title=\"If large number of products, add reviews\">If large number of products, add reviews<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-34\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Conversion\" title=\"Conversion\">Conversion<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-35\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Dont_redirect_into_checkout_after_adding_to_cart\" title=\"Don&#8217;t redirect into checkout after adding to cart\">Don&#8217;t redirect into checkout after adding to cart<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-36\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Limit_your_exit_points_at_checkout\" title=\"Limit your exit points at checkout\">Limit your exit points at checkout<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-37\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_pagination_or_a_progress_bar\" title=\"Use pagination or a progress bar\">Use pagination or a progress bar<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-38\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Re-iterate_value_proposition_at_conversion_point\" title=\"Re-iterate value proposition at conversion point\">Re-iterate value proposition at conversion point<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-39\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Have_descriptive_CTAs-2\" title=\"Have descriptive CTA&#8217;s\">Have descriptive CTA&#8217;s<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-40\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Allow_user_to_continue_on_another_device_by_emailing_or_saving_for_later\" title=\"Allow user to continue on another device by emailing or saving for later\">Allow user to continue on another device by emailing or saving for later<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-41\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Let_users_sign_up_with_social_accounts\" title=\"Let users sign up with social accounts\">Let users sign up with social accounts<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-42\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Allow_checkout_as_guest\" title=\"Allow checkout as guest\">Allow checkout as guest<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-43\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Add_value_prop_around_why_someone_should_create_an_account\" title=\"Add value prop around why someone should create an account\">Add value prop around why someone should create an account<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-44\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Form_Optimization\" title=\"Form Optimization\">Form Optimization<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-45\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Mark_required_fields_with_an_asterisk\" title=\"Mark required fields with an asterisk\">Mark required fields with an asterisk<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-46\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_inline_validation\" title=\"Use inline validation\">Use inline validation<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-47\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_autofill\" title=\"Use autofill\">Use autofill<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-48\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Reduce_number_of_fields\" title=\"Reduce number of fields\">Reduce number of fields<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-49\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Use_correct_keypads\" title=\"Use correct keypads\">Use correct keypads<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-50\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Dont_use_dropdowns\" title=\"Don&#8217;t use dropdowns\">Don&#8217;t use dropdowns<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-51\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Numerical_entry\" title=\"Numerical entry\">Numerical entry<\/a><\/li><\/ul><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-52\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#Conclusions\" title=\"Conclusions\">Conclusions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-53\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#What_Now\" title=\"What Now?\">What Now?<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"What_Google_Thinks\"><\/span>What Google Thinks<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/services.google.com\/fh\/files\/events\/pdf_retail_ux_playbook.pdf\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" class=\"aligncenter size-large wp-image-64321\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/01\/google-ecommerce-playbook-for-retail-1030x555.jpg\" alt=\"Google's eCommerce playbook for retail\" width=\"640\" height=\"345\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/01\/google-ecommerce-playbook-for-retail-1030x555.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/01\/google-ecommerce-playbook-for-retail-600x324.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/01\/google-ecommerce-playbook-for-retail-768x414.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/01\/google-ecommerce-playbook-for-retail.jpg 1580w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/a>Google has leaked its <a href=\"https:\/\/services.google.com\/fh\/files\/events\/pdf_retail_ux_playbook.pdf\" target=\"_blank\" rel=\"noopener noreferrer\">&#8220;UX Playbook for Retail&#8221; here<\/a> &#8211; but there&#8217;s also a <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/\" target=\"_blank\" rel=\"noopener noreferrer\">Fundamentals<\/a> site for developers, which is pretty clear. There&#8217;s loads of good stuff in the the retail playbook, accompanied by great case studies and mountains of data. It doesn&#8217;t get more straightforward than this, and the added payoff is getting good search engine placement for changes which also make your users happier.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"The_Silicon_Dales_Guide_to_UX\"><\/span>The Silicon Dales Guide to UX<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Silicon Dales has our own take on UX, based on our mid-market experience with businesses in the US, UK, Australia and occasionally also Canada, Switzerland and the Nordic nations. In the handy hints below, we take our background with predominantly WordPress and WooCommerce, as well as the data and conversations to which we have access, to answer your questions and present UX advice in a way which speaks to our client base.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Home_landing_page\"><\/span>Home \/ landing page<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>The home page or landing page should be a great place to navigate from &#8211; it&#8217;s where users will go back to if they get lost. Even in a distraction-free checkout, there&#8217;s still a link back to the homepage, so it should the most useful page possible, bearing in mind your users.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Clear_CTA_above_the_fold\"><\/span>Clear CTA above the fold<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-64492 size-large\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/above-the-fold-call-toaction-ux-1030x558.jpg\" alt=\"above the fold clear CTA on all devices\" width=\"640\" height=\"347\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/above-the-fold-call-toaction-ux-1030x558.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/above-the-fold-call-toaction-ux-600x325.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/above-the-fold-call-toaction-ux-768x416.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/above-the-fold-call-toaction-ux.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>A CTA is a &#8220;<a href=\"https:\/\/silicondales.com\/tag\/call-to-action\/\">call to action<\/a>&#8221; such as &#8220;buy now&#8221; or &#8220;sign up&#8221;. Putting this &#8220;above the fold&#8221; or visible within the screen without scrolling is key to improving conversion rates and making life easier for keen visitors who just want to buy your product or sign up to your offering.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Have_descriptive_CTAs\"><\/span>Have descriptive CTA&#8217;s<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<h4><img decoding=\"async\" class=\"aligncenter wp-image-64471 size-large\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/call-to-action-buttons-1030x558.jpg\" alt=\"Call to action buttons: &quot;Read More&quot;, &quot;Learn More&quot;, &quot;Book Now&quot;, &quot;Watch Now&quot;, &quot;Buy Now&quot; and &quot;Download&quot;.\" width=\"640\" height=\"347\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/call-to-action-buttons-1030x558.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/call-to-action-buttons-600x325.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/call-to-action-buttons-768x416.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/call-to-action-buttons.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/h4>\n<p>Try to be clear with your audience about what will happen when they click a button. Don&#8217;t be sneaky. Use standard phrases from buttons you see everywhere else: &#8220;Read More&#8221;, &#8220;Learn More&#8221;, &#8220;Book Now&#8221;, &#8220;Watch Now&#8221;, &#8220;Buy Now&#8221; and &#8220;Download&#8221;.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Clear_benefit-oriented_value_props_above_the_fold\"><\/span>Clear benefit-oriented value props above the fold<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Top value propositions would be things like same day delivery, collection tomorrow, &#8220;straight to your inbox&#8221;.<\/p>\n<p>It&#8217;s worth thinking about how your product or service fulfils a need for your customers and thinking about the clearest and most direct way to communicate this.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Dont_use_full_page_interstitials\"><\/span>Don&#8217;t use full page interstitials<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-64487\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/modal-window-interstitial-lightbox-1030x558.jpg\" alt=\"Modal window \/ interstitial \/ lightbox\" width=\"640\" height=\"347\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/modal-window-interstitial-lightbox-1030x558.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/modal-window-interstitial-lightbox-600x325.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/modal-window-interstitial-lightbox-768x416.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/modal-window-interstitial-lightbox.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>Other words for interstitials are lightboxes and modal windows. You know, those boxes that pop up and then you have to find the little &#8220;X&#8221;. Users are becoming &#8220;ad-blind&#8221; to these boxes anyway and there&#8217;s a movement against features like this which annoy users.<\/p>\n<p>Having said that, interstitials do assist conversion when used correctly and for an important announcement such as a closure or unavailability, they are a good way to ensure every user gets informed.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Remove_automatic_carousels\"><\/span>Remove automatic carousels<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-64647 size-large\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/no-carousel-1030x515.jpg\" alt=\"Remove rotating carousels\" width=\"640\" height=\"320\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/no-carousel-1030x515.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/no-carousel-600x300.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/no-carousel-768x384.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/no-carousel.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>Automatic carousels are image galleries which automatically flip through a roster of images or videos. From a UX standpoint, rotating galleries are distracting &#8211; and when a gallery item is useful, it&#8217;s not always possible to get it back once it&#8217;s gone! So choose which items you think will be of most interest to your users, and make them static.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Display_top_categories_on_homepage\"><\/span>Display top categories on homepage<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>You&#8217;ll know your most popular categories from sales data, <a href=\"https:\/\/silicondales.com\/tag\/google-analytics\/\">Google Analytics<\/a> and other metrics. Don&#8217;t frustrate your users by insisting on listing all the categories alphabetically when you know everyone on your site is after the Zebra section! Pick a handful of top categories &#8211; as many as can be displayed comfortably and usefully. Help your biggest fans get where they want to be as quickly as possible.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_legible_font_sizes\"><\/span>Use legible font sizes<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>This will vary according to browsers &#8211; take a look at the advice <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/design-and-ux\/responsive\/\" target=\"_blank\" rel=\"noopener noreferrer\">here.<\/a><\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_social_proof\"><\/span>Use social proof<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>If someone has clicked on a link and now wants to buy a product, they are being (quite rightly) encouraged by every consumer group in the world to just make a few basic checks on the veracity of the website before getting out their credit card. One of the very simple ways you can earn the trust of your new customers about the products or services on your site &#8211; or even that the site is a genuine retailer &#8211; is to provide social proof by displaying reviews and community engagement. There are plenty of integrations aimed at providing this in a scalable way. <a href=\"https:\/\/silicondales.com\/about-us\/contact-us\/\">Get in touch<\/a> for our recommendations.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Menu_Navigation\"><\/span>Menu &amp; Navigation<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<h4><span class=\"ez-toc-section\" id=\"Consolidated_menus\"><\/span><img decoding=\"async\" class=\"aligncenter size-large wp-image-65011\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200-1030x688.jpg\" alt=\"Woman on mobile\" width=\"640\" height=\"427\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200-1030x688.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200-600x401.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200-300x200.jpg 300w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200-768x513.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/woman-on-mobile-1200.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>Consolidated menus<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Pick your most important and popular items for the menu &#8211; don&#8217;t worry about showing everything. It&#8217;s important that the menu is easy to use.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Store_locator_buttons\"><\/span>Store locator buttons<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-65012\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/store-locator-on-smartphone-1200-1030x558.jpg\" alt=\"Store locator on smartphone\" width=\"640\" height=\"347\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/store-locator-on-smartphone-1200-1030x558.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/store-locator-on-smartphone-1200-600x325.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/store-locator-on-smartphone-1200-768x416.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/store-locator-on-smartphone-1200.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>UX is about bringing the important things to the fore &#8211; if you&#8217;re expecting visitors in person, make sure they can find your location easily &#8211; especially if they&#8217;re on the move using a smartphone. Put a store locator button in the menu and help direct people to your door.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Click-to-call\"><\/span>Click-to-call<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Again, from a <a href=\"https:\/\/silicondales.com\/tag\/mobile-first\/\">mobile-first<\/a> point of view, make it easy to hop straight on a call (if that&#8217;s what you want users to do). For call-heavy businesses, put a click-to-call at the top of every page<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Keep_menu_options_on_one_page\"><\/span>Keep menu options on one page<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Menu bloat is a sure-fire way to make a website unusable &#8211; especially on a smartphone. Keep the menu small enough to fit within the screen area.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"For_main_product_categories_order_by_traffic_volume_If_using_sub-categories_organize_alphabetically\"><\/span>For main product categories, order by traffic volume. If using sub-categories, organize alphabetically<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>The optimization only goes so far &#8211; give people what they want first, but then make everything else available in a traditionally organized way. Check your analytics to find the most visited categories and order them by popularity.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Include_post_sales_activity_in_the_menu\"><\/span>Include post sales activity in the menu<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>&#8220;Register&#8221; and &#8220;Sign In&#8221; are examples of post sales activity you might wish to include above the fold in the menu. Other post sales items include: customer service, exchanges &amp; returns, and My Account pages.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Search\"><\/span>Search<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-65010 size-large\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/search-on-smartphone-1200-1030x736.jpg\" alt=\"image\" width=\"640\" height=\"457\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/search-on-smartphone-1200-1030x736.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/search-on-smartphone-1200-600x429.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/search-on-smartphone-1200-768x548.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/search-on-smartphone-1200.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>There are many different ways to use search within a website from search, filter and sort through to specialized product searches. Auto-complete and spelling corrections also add to the complexity.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Include_search\"><\/span>Include search<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Make search available to all visitors to your online store, above the fold. It&#8217;s standard and a popular way for users to navigate.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Make_search_visible\"><\/span>Make search visible<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>A clear search icon next to the menu is the recommendation &#8211; especially for mobile.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_auto-suggestions\"><\/span>Use auto-suggestions<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Include both products and categories in the typing suggestions.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Implement_spelling_correction\"><\/span>Implement spelling correction<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Use auto-correct for common spelling mistakes.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Always_return_results\"><\/span>Always return results<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>This means that even if someone searches for something you don&#8217;t have, there will be a useful page for them to continue with their search. Offer top categories or a featured sale to entice your visitor to keep looking and potentially make a sale.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Include_previous_or_top_searches\"><\/span>Include previous or top searches<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Under a &#8220;recently searched&#8221; heading, for example, include your visitor&#8217;s recent searches or popular searches from all users to make it as easy as possible to get to a useful page.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Category_Product\"><\/span>Category \/ Product<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>On the category and product pages, there are further specific recommendations for UX.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"The_Next_example\"><\/span>The Next example<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Next are one of the major online clothing retailers in the UK, carrying inventory from other, additional, brands including Boden and Lipsy. They have a huge stock list and a busy website. Here&#8217;s how they&#8217;ve handled some of the important UX elements noted below:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-64655\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels.jpg\" alt=\"image\" width=\"487\" height=\"487\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels.jpg 952w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels-300x300.jpg 300w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels-100x100.jpg 100w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels-600x600.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels-80x80.jpg 80w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/next-product-page-screenshot-with-labels-768x768.jpg 768w\" sizes=\"(max-width: 487px) 100vw, 487px\" \/><\/p>\n<p>There are dynamically generated messages about recent purchases by other customers, which increases the sense of urgency, a clear value proposition &#8220;Collect today: Ready 1 hour&#8221; &#8211; which also adds to urgency, as well as a heart button &#8220;Add to favourites&#8221; which enables browsing users to save things they would like to look at later or on another device.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Have_a_value_prop_at_every_point_in_the_funnel\"><\/span>Have a value prop at every point in the funnel<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>An example might be &#8220;Free shipping on orders over $100 &amp; free returns&#8221;. Put this everywhere in your custom journey &#8211; including category and product pages.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Allow_users_to_sortfilter_large_number_of_products_easily\"><\/span>Allow users to sort\/filter large number of products easily<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Sort and filter are now becoming industry standard &#8211; they need to be in there if you have an online store. Many users love spending time looking through a large list of products in the right ballpark &#8211; make it as easy as possible with relevant filters such as colour or age group.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Add_urgency_elements\"><\/span>Add urgency elements<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-65013\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/3-days-left-hurry-up-1200-1030x515.jpg\" alt=\"3 days left hurry up sign\" width=\"640\" height=\"320\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/3-days-left-hurry-up-1200-1030x515.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/3-days-left-hurry-up-1200-600x300.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/3-days-left-hurry-up-1200-768x384.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/3-days-left-hurry-up-1200.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>Displaying how many items are left in stock or a countdown to when a sale ends are a good way to add urgency to a sale.\u00a0Think about quantity (&#8220;limited edition&#8221;), time limits and contextual limitations such as a buying event like Mother&#8217;s Day. Using data, it is increasingly possible to do things like displaying to users items which are selling particularly fast, or showing what has been bought in the last few hours.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Have_price_info_above_the_fold_on_product_pages\"><\/span>Have price info above the fold on product pages<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>The aim is to make a sale, so make sure the price is easily visible and enable your visitors to become customers as quickly as possible.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Secondary_CTAs\"><\/span>Secondary CTA&#8217;s<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Make it possible for your users to buy in different ways, by creating secondary Call-to-Action&#8217;s &#8211; especially those which facilitate &#8220;<a href=\"https:\/\/silicondales.com\/tag\/x-device\/\">X-Device<\/a>&#8221; activity. A wishlist, email or call button are all good ways to achieve this.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"If_large_number_of_products_add_reviews\"><\/span>If large number of products, add reviews<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Reviews are a great way to build trust in the product and the service. They also provide unique user-generated content and often provide an alternative perspective on a product, which isn&#8217;t present in the product listing.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Conversion\"><\/span>Conversion<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><img decoding=\"async\" class=\"alignright size-medium wp-image-62868\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2018\/07\/funnel-icon-300x300.jpg\" alt=\"funnel icon\" width=\"300\" height=\"300\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2018\/07\/funnel-icon-300x300.jpg 300w, https:\/\/silicondales.com\/wp-content\/uploads\/2018\/07\/funnel-icon-100x100.jpg 100w, https:\/\/silicondales.com\/wp-content\/uploads\/2018\/07\/funnel-icon-80x80.jpg 80w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>Conversion is turning a website visitor into a paying customer. &#8220;Conversion rates&#8221; refer to the number of people who complete the desired action against the number of visitors. So if you get a million visitors, but only 5 purchase a t-shirt, the conversion rate can be said to be low.<\/p>\n<p>A good way to measure conversion rates on a WooCommerce store, for example, is <a href=\"https:\/\/silicondales.com\/reviews\/google-analytics-pro-woocommerce\/\">Google Analytics eCommerce tracking<\/a> or Metorik. For help installing these, <a href=\"https:\/\/silicondales.com\/about-us\/contact-us\/\">get in touch<\/a>.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Dont_redirect_into_checkout_after_adding_to_cart\"><\/span>Don&#8217;t redirect into checkout after adding to cart<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>A popular request from our clients, redirecting to the checkout after the &#8220;add to cart&#8221; button is pressed is a slightly pushy way of ushering your customer on to payment. Instead, use a modal with options to allow users to stay on the product page, but still view their basket and choose whether to go to checkout.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Limit_your_exit_points_at_checkout\"><\/span>Limit your exit points at checkout<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Also known as a &#8220;distraction free checkout&#8221; &#8211; take out the usual elements from your site and make sure that checkout is all about checking out. Consider removing the sidebar and even the footer and menu from this step.The only links should be\u00a0homepage, back to cart or contact support &#8211; no menu in the part of the site.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_pagination_or_a_progress_bar\"><\/span>Use pagination or a progress bar<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>If there are more than 2 steps in the conversion flow, consider adding pagination or a progress bar. Reassure users that the process won&#8217;t last forever and that they&#8217;re nearly finished. Typical labels on the steppers would be: &#8220;Address, Payment, Order review&#8221; or &#8220;Delivery, Details, Payment&#8221;.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Re-iterate_value_proposition_at_conversion_point\"><\/span>Re-iterate value proposition at conversion point<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>This will usually be a free shipping or next day delivery banner, but could be something completely different such as &#8220;box of sparkles with every order&#8221;.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Have_descriptive_CTAs-2\"><\/span>Have descriptive CTA&#8217;s<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>This means really clear button text which explicitly describes what happens next: &#8220;Choose Click &amp; Collect&#8221; is a good example.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Allow_user_to_continue_on_another_device_by_emailing_or_saving_for_later\"><\/span>Allow user to continue on another device by emailing or saving for later<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Users will often browse on a handheld device, but complete the checkout on a desktop or another device which has, for example, some saved payment details. Make it as easy as possible for users to have a seamless experience across devices by connecting through wishlists and saving for later in their inbox.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Let_users_sign_up_with_social_accounts\"><\/span>Let users sign up with social accounts<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>92% of users give up if they don\u2019t remember a username or password. This also provides a great opportunity for social shopping and sharing after purchase.<\/p>\n<p>For WooCommerce store owners, there&#8217;s a handy extension for <a href=\"https:\/\/silicondales.com\/reviews\/introducing-the-woocommerce-social-login-woocommerce-extension\/\">social logins<\/a>.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Allow_checkout_as_guest\"><\/span>Allow checkout as guest<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Google says that 35% of users will abandon the checkout if a retailer does not offer guest checkout.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Add_value_prop_around_why_someone_should_create_an_account\"><\/span>Add value prop around why someone should create an account<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Offer perks such as a faster checkout next time, a rewards program and wishlists.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Form_Optimization\"><\/span><img decoding=\"async\" class=\"size-medium wp-image-64656 alignright\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/iphone-mockup-checkout-300x300.jpg\" alt=\"image\" width=\"300\" height=\"300\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/iphone-mockup-checkout-300x300.jpg 300w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/iphone-mockup-checkout-100x100.jpg 100w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/iphone-mockup-checkout-80x80.jpg 80w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/iphone-mockup-checkout.jpg 338w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>Form Optimization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Typing on mobile is hard. Make life easier for your users with these changes to your UX:<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Mark_required_fields_with_an_asterisk\"><\/span>Mark required fields with an asterisk<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>This allows users to skip unnecessary steps.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_inline_validation\"><\/span>Use inline validation<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>If the characters in the field don&#8217;t match what&#8217;s required &#8211; give a red error notice or tooltip helping your users correct their fields.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Use_autofill\"><\/span>Use autofill<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>27% of users abandon orders due to a \u201ctoo long \/ complicated checkout process\u201d.\u00a0Support browser assisted auto-fill and help get your users through checkout quicker.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Reduce_number_of_fields\"><\/span>Reduce number of fields<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>The best performing e-commerce sites have 6-8 fields, and a total of 12 form elements. The average retail checkout flow has 14.88 form fields. Here are some ways to achieve that:<\/p>\n<ul>\n<li>Remove optional fields<\/li>\n<li>Use full name instead of first\/last<\/li>\n<li>Hide company and address line 2 by default<\/li>\n<li>Hide billing by default &#8211; use the &#8220;Shipping same as billing address&#8221; ticky box<\/li>\n<\/ul>\n<h4><span class=\"ez-toc-section\" id=\"Use_correct_keypads\"><\/span>Use correct keypads<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-65014\" src=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/numerical-keypad-1200-1030x687.jpg\" alt=\"Numerical keypad on smartphone\" width=\"640\" height=\"427\" srcset=\"https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/numerical-keypad-1200-1030x687.jpg 1030w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/numerical-keypad-1200-600x400.jpg 600w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/numerical-keypad-1200-768x512.jpg 768w, https:\/\/silicondales.com\/wp-content\/uploads\/2019\/02\/numerical-keypad-1200.jpg 1200w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/>For phone zip and credit card make sure the correct keypad is available (numbers or letters). This cuts down on any frustration for users on mobiles.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Dont_use_dropdowns\"><\/span>Don&#8217;t use dropdowns<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>For inputs with fewer than 4 options, opt for radio buttons instead of dropdowns. Again, think mobile-first and try to make options as easy to select as possible on handheld devices.<\/p>\n<h4><span class=\"ez-toc-section\" id=\"Numerical_entry\"><\/span>Numerical entry<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Make it as easy as possible to enter the correct number on a mobile.\u00a0Use steppers, sliders, or open field input for numerical entry rather than large dropdowns.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Conclusions\"><\/span>Conclusions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Wow! That was a lot to digest, hey?! Let&#8217;s summarize the main takeaways from Google&#8217;s great big guide to UX, and incorporate these into our golden rules for eCommerce user experience:<\/p>\n<ul>\n<li>Make your most popular categories prominent<\/li>\n<li>Reduce fields in the checkout<\/li>\n<li>Include search with sort, filter and auto-complete<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"What_Now\"><\/span>What Now?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Knowledge is great. You know what to build, and maybe, you know how too. If you&#8217;d like to book an agency who does all of the above (and more) as a part of it&#8217;s DNA, then <a href=\"https:\/\/silicondales.com\/about-us\/contact-us\/\">contact us at Silicon Dales<\/a> about developing or optimizing your online store for more organic traffic and sales conversions.<\/p>\n<p><a href=\"https:\/\/silicondales.com\/about-us\/contact-us\/\"><button>Contact Silicon Dales Now<\/button><\/a><\/p>\n<p>(Hint: the above button is a clear &#8220;Call to Action&#8221;)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>UX or User Experience in the context of online retail, means the ways an online store can be presented, laid-out and linked together to improve User Experience. The most obvious example we usually give to clients is making the buy button bigger, brighter and &#8220;above the fold&#8221;. However, there are entire teams dedicated to UX &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"How to do eCommerce right: the Silicon Dales guide to UX for online retail\" class=\"read-more button\" href=\"https:\/\/silicondales.com\/tutorials\/ecommerce-guide-to-ux\/#more-64320\" aria-label=\"Read more about How to do eCommerce right: the Silicon Dales guide to UX for online retail\">Read more<\/a><\/p>\n","protected":false},"author":2,"featured_media":65008,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[9,4801],"tags":[5003,4987,4991,4994,4993,4992,602,4882,4989,5004,4990,4986,4985,4988,4488,5005],"acf":[],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/posts\/64320"}],"collection":[{"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/comments?post=64320"}],"version-history":[{"count":0,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/posts\/64320\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/media\/65008"}],"wp:attachment":[{"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/media?parent=64320"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/categories?post=64320"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/silicondales.com\/wp-json\/wp\/v2\/tags?post=64320"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}