{"id":7480,"date":"2017-08-22T09:49:00","date_gmt":"2017-08-22T09:49:00","guid":{"rendered":"https:\/\/blog.mageworx.com\/?p=7480"},"modified":"2022-11-09T10:31:44","modified_gmt":"2022-11-09T10:31:44","slug":"how-to-make-ecommerce-category-pages-sell-7-live-examples","status":"publish","type":"post","link":"https:\/\/www.mageworx.com\/blog\/how-to-make-ecommerce-category-pages-sell","title":{"rendered":"How to Make eCommerce Category Pages Sell? 7 Live Examples"},"content":{"rendered":"\n<!-- SEO Ultimate (http:\/\/www.seodesignsolutions.com\/wordpress-seo\/) - Code Inserter module -->\n<!-- Google Tag Manager (noscript) -->\r\n<noscript><iframe src=\"https:\/\/www.googletagmanager.com\/ns.html?id=GTM-5DTCW7B8\"\r\nheight=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"><\/iframe><\/noscript>\r\n<!-- End Google Tag Manager (noscript) -->\n<!-- \/SEO Ultimate -->\n\n<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Reading Time: <\/span> <span class=\"rt-time\"> 6<\/span> <span class=\"rt-label rt-postfix\">minutes<\/span><\/span><p>The majority of eCommerce store owners spend most of their time either on optimizing the <em>homepage <\/em>or on creating <em>well-organized<\/em> and <em>brushed-up product pages<\/em>.<\/p>\n<p>While the above-mentioned pages are surely important, there\u2019s another page type, the potential of which is often ignored and overlooked by online merchants.<\/p>\n<p>I\u2019m talking about <strong>category pages<\/strong>.<\/p>\n<p>Basically, these are <em>individual website pages<\/em> that <em>structure website taxonomy<\/em>. In online stores, categories and sub-categories are normally used to classify products or services by grouping them together in one place.<\/p>\n<p>Category pages help in <em>improving store navigation<\/em>, <em>usability<\/em> and <em>internal search mechanisms<\/em>, which all results in enhancing the overall customers\u2019 shopping experience. What is more, while playing the role of a transit point, a category page can be optimized to solidify visitors\u2019 purchase intent and convert them into buyers.<\/p>\n<p>From this article, you will learn how to <em>avoid the most common mistakes<\/em> while creating pages of this type. Also, we\u2019ll tell you <em>how to improve the efficiency<\/em> of your existing site categories and subcategories.<\/p>\n<p><!--more--><\/p>\n<h2>Category Page Content<\/h2>\n<p>The ugly truth is that most of eCommerce category pages are short on content. In the majority of cases, there\u2019s only a list of products and a tiny amount of content (that is usually taken from the actual product pages).<\/p>\n<p>Meanwhile, injecting some useful and unique content in there can make these page rank better and bring you an extra portion of targeted traffic.<\/p>\n<p>Also, being optimized, category pages will let you <em>tell <\/em>your store visitors<em> more about your product and brand<\/em>, answer frequently<em>&nbsp;asked questions<\/em>, and <em>usher them through the conversion funnel<\/em>.<\/p>\n<h3><em><strong><a href=\"https:\/\/www.mageworx.com\/magento-2-ultimate-sales-boost.html\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-14811 size-full\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2016\/05\/banner_sales-boost_2.png\" alt=\"Mageworx Ultimate Sales Boost extension for Magento 2\" width=\"690\" height=\"360\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2016\/05\/banner_sales-boost_2.png 690w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2016\/05\/banner_sales-boost_2-600x313.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2016\/05\/banner_sales-boost_2-250x130.png 250w\" sizes=\"auto, (max-width: 690px) 100vw, 690px\" \/><\/a>Content Types &nbsp;<\/strong><\/em><\/h3>\n<p>It\u2019s generally believed that maximum what can be added on category pages is an extended description.<\/p>\n<p>However, a big number of eCommerce websites proved that you can successfully use practically any type of content there.<\/p>\n<p>So category pages can come with:<\/p>\n<ul>\n<li>a detailed description of category products,<\/li>\n<li>eye-candy hero images,<\/li>\n<li>engaging image sliders,<\/li>\n<li>banners that announce global store sales or specials,<\/li>\n<li>sections with featured products and services,<\/li>\n<li>a \u2018New Arrivals\u2019 section,<\/li>\n<li>videos that tell how to select the most suitable category product or how to use it the right way,<\/li>\n<li>use cases,<\/li>\n<li>case studies,<\/li>\n<li>an \u2018Expert Advice\u2019 section,<\/li>\n<li>FAQ,<\/li>\n<li>and even storytelling.<\/li>\n<\/ul>\n<p>Below is a couple of examples that tell how to use the abovementioned content types on category pages.<\/p>\n<p>On the main category, <strong><em>Urban Outfitters<\/em><\/strong> uses eye-candy imagery to introduce different brands and types of clothes. Image is clickable.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-14632 aligncenter\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final.png\" alt=\"\" width=\"808\" height=\"872\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final.png 808w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final-556x600.png 556w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final-768x829.png 768w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final-250x270.png 250w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final-696x751.png 696w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.09-PM-final-389x420.png 389w\" sizes=\"auto, (max-width: 808px) 100vw, 808px\" \/><\/p>\n<p>Also, down this page, they have \u2018<strong><em>New Arrivals<\/em><\/strong>\u2019 and \u2018<em><strong>Now on Sal<\/strong>e<\/em>\u2019 sections.<\/p>\n<p>But the most interesting thing is at the very bottom of the page. There, there\u2019s a section with relevant blog articles and <strong><em>user-generated content<\/em><\/strong> \u2014 a <em>feed of Instagram posts<\/em> with the company\u2019s branded hashtag.<\/p>\n<p>Thus, the brand is creating somewhat that unites all its customers \u2014 <strong>a<em> dedicated community of its fans<\/em><\/strong>. In the community, everyone can share their own story and get feedback from like-minded people.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-7489 aligncenter\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.27-PM.png\" alt=\"eCommerce category pages optimization\" width=\"839\" height=\"740\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.27-PM.png 839w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.27-PM-600x529.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.03.27-PM-768x677.png 768w\" sizes=\"auto, (max-width: 839px) 100vw, 839px\" \/><\/p>\n<p>If you drill down to the subcategory level, you\u2019ll see a great example of <strong><em>video content usage<\/em><\/strong>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-7491 aligncenter\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.09.27-PM.png\" alt=\"Using videos on eCommerce category pages\" width=\"949\" height=\"600\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.09.27-PM.png 949w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.09.27-PM-600x379.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-4.09.27-PM-768x486.png 768w\" sizes=\"auto, (max-width: 949px) 100vw, 949px\" \/><\/p>\n<p>In the videos, <em>Urban Outfitters<\/em> interviews their regular customers and asks them for an opinion about a certain brand.<\/p>\n<p>By adding all this extra content, <em>Urban Outfitters<\/em> aims at engaging with site visitors and customers, educating them and providing with all possible information about the chosen group of products.<\/p>\n<p>Another great example of using the content on category pages comes from <strong><em>13 Things<\/em><\/strong>.<\/p>\n<p>These guys managed to successfully use <em><strong>storytelling<\/strong><\/em> right on the category pages. Their stories natively blend with the category page layout, even despite being placed at the top of it.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-7498 aligncenter\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/foliage.jpg\" alt=\"Story telling on eCommerce category pages\" width=\"600\" height=\"315\"><\/p>\n<h3><em><strong>Content Placement<\/strong> <\/em><\/h3>\n<p>The biggest challenge you may face when adding content on category pages is finding the right spot for it.<\/p>\n<p>On the one hand, putting too much content <em>above the product grid<\/em> may push category products down the page. That may confuse shoppers and lower this page conversion rates. On the other, if you add content <em>at the bottom of such a page<\/em>, no one is ever going to find it.<\/p>\n<p>Truth be told, <em>there\u2019s no universal recipe for finding an ideal place for content on a category page<\/em>.<\/p>\n<p>The placement depends on a page layout and the type of content you\u2019d like to add. Below, are some examples.<\/p>\n<p>Bright <strong>hero shots<\/strong> are better to display <em>at the top of this page<\/em>. Same is with <strong>image sliders<\/strong> and<strong> banners<\/strong> with special offers. (clickable)<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-14794\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1.png\" alt=\"\" width=\"1200\" height=\"556\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-600x278.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-768x356.png 768w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-250x116.png 250w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-696x322.png 696w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-1068x495.png 1068w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/final-1200x556-1-906x420.png 906w\" sizes=\"auto, (max-width: 1200px) 100vw, 1200px\" \/>As for <strong>featured products and brands<\/strong>, your mobile app <strong>ads<\/strong>, they can be placed either at the top or in the middle of your category page. There&#8217; they don&#8217;t switch visitors&#8217; attention from the main content and add extra valuable details to it.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7501\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/2.png\" alt=\"ecommerce category page optimization\" width=\"1341\" height=\"865\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/2.png 1341w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/2-600x387.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/2-1200x774.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/2-768x495.png 768w\" sizes=\"auto, (max-width: 1341px) 100vw, 1341px\" \/><\/p>\n<p>Product use cases, <strong>expert advice, <\/strong>and <strong>FAQ sections<\/strong> look better in the <em>middle<\/em> or <em>at the bottom of this page<\/em>.<\/p>\n<p>If you are going to add a <em>detailed text description of a certain product group<\/em> (with <a href=\"https:\/\/www.mageworx.com\/magento-2-seo-extension.html\" target=\"_blank\" rel=\"noopener noreferrer\">SEO in mind<\/a>), it\u2019s generally advised to add it <em>at the bottom of a category page<\/em>, in order not to distract attention from the products you are selling.<\/p>\n<p>This is how we did it on the <strong><a href=\"https:\/\/www.mageworx.com\/\">MageWorx<\/a><\/strong> website (clickable).<\/p>\n<p><a href=\"https:\/\/www.mageworx.com\/magento2-extensions\/product-management-extensions.html\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7502\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/3.png\" alt=\"ecommerce category pages\" width=\"1643\" height=\"886\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/3.png 1643w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/3-600x324.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/3-1200x647.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/3-768x414.png 768w\" sizes=\"auto, (max-width: 1643px) 100vw, 1643px\" \/><\/a><\/p>\n<h3><em><strong>Content quality&nbsp;&nbsp;<\/strong> <\/em><\/h3>\n<p>Whatever content you may create for your website, <em>quality is always the key factor<\/em>. Content for category pages is not an exception.<\/p>\n<p>Even if you are going to write a generic description for your category, bear in mind that you\u2019re creating <em>content for humans<\/em>, not<em> a filter copy for the search engines<\/em>.<\/p>\n<p>Below are the good and bad examples of a category page description.<\/p>\n<p><strong>Bad<\/strong><\/p>\n<p><em>\u201cYou are in the [CATEGORYNAME] category! Here you you can find [CATEGORYTAGS] and other great [CATEGORY_NAME] products.\u201d <\/em><\/p>\n<p><strong>Good<\/strong><\/p>\n<p><em>[STORENAME] offers a wide range of [PRODUCTNAME], ranging from entry-level options under $50 (e.g. [BRANDNAME], [BRANDNAME]) to cutting-edge, advanced solutions starting from $500 and designed by [BRANDNAME], [BRANDNAME]. \u2028\u2028<\/em><\/p>\n<p><em>With such an extensive choice, choosing the right option can be a daunting task. That\u2019s why we\u2019ve created a [PRODUCTNAME] buying guide (link) that describes all the trending solutions, their features and pricing.<\/em><\/p>\n<p>Don\u2019t just waste space on your category page by adding useless content there.<\/p>\n<p>Instead of a cloud of a keyword staffed texts for the search engine bots:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7503\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/ebags-seo-768x535.png\" alt=\"category page optimization\" width=\"768\" height=\"535\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/ebags-seo-768x535.png 768w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/ebags-seo-768x535-600x418.png 600w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/p>\n<p>add something that your customers can really appreciate.<\/p>\n<p><em><strong>Nosto<\/strong><\/em>, for instance, uses the area below the list of their services to promote their eBook: (clickable)<\/p>\n<p><a href=\"https:\/\/www.nosto.com\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7504\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-5.45.56-PM.png\" alt=\"Optimizing ecommerce category pages\" width=\"1385\" height=\"790\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-5.45.56-PM.png 1385w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-5.45.56-PM-600x342.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-5.45.56-PM-1200x684.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-17-at-5.45.56-PM-768x438.png 768w\" sizes=\"auto, (max-width: 1385px) 100vw, 1385px\" \/><\/a><\/p>\n<p>By doing so, they are killing two birds with one stone. First, they educate site visitors, help them better understand their services. Second, they capture emails of prospective customers.<\/p>\n<p>So whatever content you may add to your store category pages, make sure it brings value to your visitors and customers.<\/p>\n<h2>Optimizing Images<\/h2>\n<p>When visiting brick-and-mortar stores, you may have noticed that they actively use signs and banners that hang around different departments. These visual aids help to drag customers attention to something important or inform them about their current location.<\/p>\n<p>Images on eCommerce category pages play a similar role.<\/p>\n<p>Category graphics can be effectively used to:<\/p>\n<ul>\n<li>tell customers where they are,<\/li>\n<li>inform site visitors about<em> discounts, specials or loyalty program benefits<\/em>,<\/li>\n<li>update customers on your <a href=\"https:\/\/www.mageworx.com\/magento-2-advanced-product-options-suite.html\" target=\"_blank\" rel=\"noopener noreferrer\">product offerings<\/a> (<em>new arrivals, featured products<\/em>, etc.),<\/li>\n<li>add <em>extra polish<\/em> and <em>professionalism<\/em> to your site.<\/li>\n<\/ul>\n<p>Thus, images on category pages can improve the overall site navigation and multiply their conversion rates.<\/p>\n<p>However, if used the wrong way, category graphics can completely ruin your customers\u2019 shopping experience. Below are the things to take into account when adding visuals on eCommerce category pages.<\/p>\n<h3><em><strong>Don\u2019t use hero shots that take up the entire 1st screen<\/strong> <\/em><\/h3>\n<p>As said above, images on category pages should <em>improve navigation<\/em> and <em>help customers understand where they are<\/em>.<\/p>\n<p>Using too big hero shots pushes the main category page content down, so site visitors may get confused (especially on their mobile). Large images push down the main content, so it&#8217;s unclear what such a page offers.<\/p>\n<p>Ideally, category hero images should <em>cover not more than 2\/3 of the 1st screen <\/em>both on mobile and desktop devices (so that at least some <em>products<\/em> could be visible on the 1st screen) and <em>vividly illustrate<\/em> what a category below is about.<\/p>\n<p><em><strong>Gaiam<\/strong><\/em> and <em><strong>Sephora<\/strong><\/em> are good examples of using hero images on category pages. The former clearly shows what a customer finds down the page. The latter lets immediately understand that this is a page of certain cosmetics <a href=\"https:\/\/www.mageworx.com\/shop-by-brand-magento-2.html\" target=\"_blank\" rel=\"noopener noreferrer\">brand &#8211;<\/a> they display the brand&#8217;s logo, motto and the company\u2019s main products right above the products feed.<br \/>\nImages are clickable.<\/p>\n<p><a href=\"https:\/\/www.gaiam.com\/collections\/active-sitting\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7507\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/5.png\" alt=\"5\" width=\"1356\" height=\"766\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/5.png 1356w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/5-600x339.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/5-1200x678.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/5-768x434.png 768w\" sizes=\"auto, (max-width: 1356px) 100vw, 1356px\" \/><\/a><\/p>\n<p><a href=\"https:\/\/www.sephora.com\/bite-beauty?icid2=meganav_brands_featuredbrands_bite_desktop_080117_link\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7508\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/4.png\" alt=\"4\" width=\"819\" height=\"859\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/4.png 819w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/4-572x600.png 572w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/4-768x806.png 768w\" sizes=\"auto, (max-width: 819px) 100vw, 819px\" \/><\/a><\/p>\n<h3><em><strong>Be consistent with the images you use for categories&nbsp;<\/strong> <\/em><\/h3>\n<p>Psychologically, a category page is perceived be a site visitor as a <em>perceptual unit<\/em>. Hence, when it comes to filling it with imagery, such factors as <em>consistency<\/em>, <em>cleanliness<\/em> and organization become crucially important.<\/p>\n<p>Just compare this example:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7511\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/uniform-product-images_myntra.png\" alt=\"\" width=\"731\" height=\"301\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/uniform-product-images_myntra.png 731w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/uniform-product-images_myntra-600x247.png 600w\" sizes=\"auto, (max-width: 731px) 100vw, 731px\" \/><\/p>\n<p>with this one:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7512\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-4.52.00-PM.png\" alt=\"ecommerce categories\" width=\"1399\" height=\"637\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-4.52.00-PM.png 1399w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-4.52.00-PM-600x273.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-4.52.00-PM-1200x546.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-4.52.00-PM-768x350.png 768w\" sizes=\"auto, (max-width: 1399px) 100vw, 1399px\" \/><\/p>\n<p>In the former case, we see images with different male models who are striking different poses. They are wearing T-shorts of different brands, fits, neck styles and graphic types. Looks like those photos were made in different times, in different surroundings. All that makes this category page look quite inconsistent.<\/p>\n<p>In the latter example, on the contrary, we can see a well-organized, consistent range of products of the same fit and neck style, all put on a homogeneous background. Such an approach definitely improves the look-and-feel of an eCommerce category page and eases perception of its visual content.<\/p>\n<p>Although the latter case is not somewhat all eCommerce stores should obligatory implement (as some stores may have unique designs, page layouts, etc.), it\u2019s definitely a good example to follow.<\/p>\n<h3><em><strong>Use .Gif \/ Video Previews<\/strong> <\/em><\/h3>\n<p>You\u2019ve probably heard of (or may be already using) <em>a zoom out product image preview<\/em>. This feature allows customers to take a closer look at a chosen product by adjusting its image size.<\/p>\n<p><strong>Video<\/strong> or .<strong> Gif preview<\/strong> lets you further extend this functionality and display any product in action. What is more, this way, you can display any product from various angles.<\/p>\n<p>Product video previews can be displayed upon mouse-over, right in the product catalog.&nbsp; Here is how <a href=\"https:\/\/s7d2.scene7.com\/is\/content\/aeo\/productvideos\/0438_1140_537_v_317x406_o.ogg\" target=\"_blank\" rel=\"noopener noreferrer\">American Eagle implemented that<\/a>:<\/p>\n<p><a href=\"https:\/\/www.ae.com\/women-jeans\/web\/s-cat\/6430042?cm=sUS-cUSD&amp;guide=jean&amp;navdetail=mega:womens:c3:p2\" target=\"_blanc\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7513\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-11.26.05-AM.png\" alt=\"\" width=\"1270\" height=\"874\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-11.26.05-AM.png 1270w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-11.26.05-AM-600x413.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-11.26.05-AM-1200x826.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-21-at-11.26.05-AM-768x529.png 768w\" sizes=\"auto, (max-width: 1270px) 100vw, 1270px\" \/><\/a><\/p>\n<h2>Bottom Line<\/h2>\n<p>By adding the right content and imagery to your site categories, you\u2019ll help your visitors get a clear idea of what you are selling and what they can get on your website. Plus they might find some products they were not aware of before.<\/p>\n<p>In the next<em> article<\/em>, we\u2019ll tell you how to <strong>optimize store categories<\/strong> in terms of <strong>SEO<\/strong> and <strong>mobile<\/strong>.<\/p>\n<p>Check out for updates on our blog \u2014 &#8220;Optimizing Category Pages for SEO and Mobile&#8221; article is coming<em> next week<\/em>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Reading Time: <\/span> <span class=\"rt-time\"> 6<\/span> <span class=\"rt-label rt-postfix\">minutes<\/span><\/span>The majority of eCommerce store owners spend most of their time either on optimizing the homepage or on creating well-organized and brushed-up product pages. While the above-mentioned pages are surely important, there\u2019s another page type, the potential of which is often ignored and overlooked by online merchants. I\u2019m talking about category pages. Basically, these are [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":7541,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[428,291],"tags":[56],"class_list":{"0":"post-7480","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-ecommerce","8":"category-e-marketing","9":"tag-seo"},"_links":{"self":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/7480","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/comments?post=7480"}],"version-history":[{"count":47,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/7480\/revisions"}],"predecessor-version":[{"id":16427,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/7480\/revisions\/16427"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/media\/7541"}],"wp:attachment":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/media?parent=7480"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/categories?post=7480"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/tags?post=7480"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}