{"id":98616,"date":"2024-08-22T09:06:00","date_gmt":"2024-08-22T13:06:00","guid":{"rendered":"https:\/\/www.crazyegg.com\/blog\/?p=98616"},"modified":"2026-01-06T15:13:12","modified_gmt":"2026-01-06T23:13:12","slug":"product-hero-image","status":"publish","type":"post","link":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/","title":{"rendered":"5 Required Steps for the Perfect Product Hero Image"},"content":{"rendered":"\n<p>A product hero image is a large and visually distinctive image of a product that shows the item in the best possible light, including its brand, what it does, and how it helps customers solve their pain points.<\/p>\n\n\n\n<p>Puma, one of the largest shoe manufacturers in the world, has a great example of how to use a product hero image effectively and with style.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"242\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98618\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example-300x108.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Puma uses its most vibrant and eccentric colorway from the LO LAVA basketball shoe line to promote their uniqueness and make the pair stand out<\/li>\n\n\n\n<li>The dark and mysterious background accentuates the kicks\u2019 colors, materials, and modern shape, providing a striking contrast between the product itself and the shapeless court it\u2019s up against<\/li>\n\n\n\n<li>An orange demarcation line in the middle ascribes positive feelings to customers who want to buy the MB.03 LO LAVA, compared to smartly manufacturing fear of missing out (FOMO) for visitors who decide to opt out of the deal<\/li>\n<\/ul>\n\n\n\n<p>With product hero images, it\u2019s important to use them purposefully and sparingly. Otherwise, you risk overwhelming, confusing, and preventing your customers from purchasing an item in the first place.<\/p>\n\n\n\n<p>Here\u2019s a list of the five most important steps for using the perfect product hero image in your digital marketing campaigns. Let\u2019s begin.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. Use Product Hero Images at the Right Time<\/h2>\n\n\n\n<p>In a sense, we\u2019re all intuitively aware of how to use regular product images. However, utilizing the full potential of a product hero image (with a strong emphasis on the &#8220;<strong>HERO<\/strong>&#8221; part) requires positioning it to become the focal point of the page.<\/p>\n\n\n\n<p>In fact, this isn\u2019t your standard ecommerce page where almost everything goes. It\u2019s a dedicated marketing page for the product, and, as such, it should <strong>REALLY<\/strong> stand out.<\/p>\n\n\n\n<p>Generally speaking, ecommerce product pages, category pages, and most marketing should use standard product images. For example, not all shoes deserve a <a href=\"https:\/\/www.crazyegg.com\/blog\/hero-image\/\">hero image<\/a> and are better served on their regular category page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"413\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181507\/Ecommerce-Product-Page-Example.png\" alt=\"\" class=\"wp-image-98619\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181507\/Ecommerce-Product-Page-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181507\/Ecommerce-Product-Page-Example-300x184.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p>Assigning a special hero status to all products will make customers skeptical of your marketing, and, ultimately, reduce your conversion rates.<\/p>\n\n\n\n<p>Conversely, when you\u2019re building a dedicated marketing page to hype a quality product you know has the potential to become a best-seller, then it\u2019s worth spending that extra time to convert it to a product hero image at the top of the page.<\/p>\n\n\n\n<p>This example from JBL perfectly illustrates the power of an expertly crafted hero image in combination with an irresistible value proposition:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"309\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181538\/JBL-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98620\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181538\/JBL-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181538\/JBL-Product-Hero-Example-300x137.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The two distinctive quadrants clearly summarize the product\u2019s use cases and how customers can personalize its aesthetic to fit their lifestyle<\/li>\n\n\n\n<li>The lively and vibrant colors invite audiophiles to take action and recommend the page to their friends and associates<\/li>\n\n\n\n<li>A short and catchy slogan on the right-hand side points to a carefully placed call-to-action (CTA), improving the time users spend on the page and increasing the chances for a conversion<\/li>\n<\/ul>\n\n\n\n<p>Another great example comes from leading laundry detergent manufacturer Tide:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"339\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181605\/Tide-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98621\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181605\/Tide-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181605\/Tide-Product-Hero-Example-300x151.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A spotless white background signalizes a stain-free experience using the power of impactful visual design<\/li>\n\n\n\n<li>A short and concise copy suggests the product\u2019s suitability for beginners and seasoned professionals alike<\/li>\n\n\n\n<li>In a single frame, the product hero image demonstrates what the product is, what it does, and how to use it<\/li>\n<\/ul>\n\n\n\n<p>Lastly, let\u2019s consider a product hero image example from DIOR\u2014a world-renowned makeup, accessories, and fashion house:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"253\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181629\/DIOR-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98622\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181629\/DIOR-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181629\/DIOR-Product-Hero-Example-300x112.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The inclusion of a celebrity immediately draws the user\u2019s attention to the image, acting as an online stamp of approval that goes beyond a simple product endorsement<\/li>\n\n\n\n<li>The careful selection of colors showcases the brand\u2019s knowledge of its target audience, how to win them over, and how to turn them into repeat customers<\/li>\n\n\n\n<li>As the leading fragrance, Miss Dior is the perfect candidate to receive the hero image treatment over other DIOR products<\/li>\n<\/ul>\n\n\n\n<p>Following these tips will help you decide when to go all in on a product image to make it a true hero image, versus letting it be a standard product image as part of your regular inventory listing.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2. Make Sure The Entire Page Supports The Image<\/h2>\n\n\n\n<p>The page layout, or how different web elements on your page are set up, shouldn\u2019t overshadow your product hero image. If the page layout, the overall graphic design, and your site\u2019s infrastructure don\u2019t support the product hero image, your product hero image is going to have a reduced positive impact on potential conversions and sales.<\/p>\n\n\n\n<p>For example, Rachael Ray\u2019s<strong> <\/strong>pet food brand Nutrish<strong> <\/strong>does this well:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"266\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181651\/Nutrish-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98623\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181651\/Nutrish-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181651\/Nutrish-Product-Hero-Example-300x118.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The typography, colors, and margins in the product hero image work perfectly in unison with the other web elements on the page\u2019s layout, reducing unnecessary friction in the customer\u2019s journey<\/li>\n\n\n\n<li>A playful font and a lively product packaging invites pet owners to become loyal brand ambassadors<\/li>\n\n\n\n<li>A simple top navigation menu complements the main banner and makes it easier for both prospective and repeat customers to navigate the site<\/li>\n<\/ul>\n\n\n\n<p>Audio equipment manufacturer Sennheiser goes for a more stylistic approach, but still achieves the same goal:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"347\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181717\/Sennheiser-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98624\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181717\/Sennheiser-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181717\/Sennheiser-Product-Hero-Example-300x154.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A stylized and retouched product hero image in the left quadrant, paired with a lifestyle product hero image in the right quadrant, all make for an unforgettable customer experience that works well with the page\u2019s main layout<\/li>\n\n\n\n<li>An inconspicuous, five-item menu in the upper-left corner helps to guide the visitor in what they\u2019re looking to find<\/li>\n\n\n\n<li>A short and simple tagline neatly fits below the product headline and points to a thoughtfully positioned CTA, guiding the visitors\u2019 attention to the most important elements on the page<\/li>\n<\/ul>\n\n\n\n<p>Alienware, a high-end gaming laptop manufacturer, opts for a more traditional approach:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"349\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181742\/Alienware-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98625\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181742\/Alienware-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181742\/Alienware-Product-Hero-Example-300x155.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A separate user interface (UI) enables customers to examine their favorite product features through the combination of static images and embedded video animation\u2014all fully supported by the page\u2019s main layout<\/li>\n\n\n\n<li>Muted and dark colors emphasize the brand\u2019s stylistic choices, signalizing grit, perseverance, and power; these are some of the most common keywords associated with the gaming industry and gamers in general<\/li>\n\n\n\n<li>Alienware is purposefully catering to the gaming audience, choosing to demonstrate product features, and capabilities, and build quality over something like a lifestyle-based product hero image setup<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">3. Get Professionals to Help<\/h2>\n\n\n\n<p>If you have a product that is selling exceptionally well or makes people stay longer on the page and purchase other items alongside it, then it\u2019s time to start thinking about creating a dedicated product hero image for that product.<\/p>\n\n\n\n<p>For real-world, physical products such as furniture, electronics, or sports equipment, it\u2019s a good idea to get in touch with an experienced product photographer. They\u2019ll capture the product\u2019s essence and present it in the best possible light for your customers to see.<\/p>\n\n\n\n<p>For example, here\u2019s food and beverage giant PepsiCo promoting its popular sugar-free soda can:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"383\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181808\/Pepsi-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98626\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181808\/Pepsi-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181808\/Pepsi-Product-Hero-Example-300x170.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A-grade-level product photography, coupled with professional image retouching and graphic design, turn this marketing example into a highly memorable experience<\/li>\n\n\n\n<li>An oversized logo accentuates Pepsi\u2019s world-renowned and instantly recognizable brand<\/li>\n\n\n\n<li>A dark, single-color background provides maximum impact with the lowest effort possible, something that even brands with a low marketing budget can recreate by using a simple product photography setup<\/li>\n<\/ul>\n\n\n\n<p>For promoting more abstract products like software, games, or legal services\u2014get help from a professional graphic designer or a seasoned illustrator. Talented designers know how to format, package, and sell intangible products and intellectual services with the help of smart visual design.<\/p>\n\n\n\n<p>A great example of effective visual design comes from SaaS portfolio link tool maker Linktree:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"383\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181836\/Linktree-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98627\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181836\/Linktree-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181836\/Linktree-Product-Hero-Example-300x170.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A concise and bold headline accompanies a visually descriptive overview of the tool, the two different approaches building a thorough summarization of the creator\u2019s product<\/li>\n\n\n\n<li>Gentle colors and a deliberate copy placement draw attention to the key elements on the page, making it more likely for visitors to convert<\/li>\n\n\n\n<li>Every element on the landing page serves a specific purpose and is there for a reason, which is the fundamental rule of good UI design<\/li>\n<\/ul>\n\n\n\n<p>You can find quality product photographers and experienced visual designers in three main ways:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>By browsing through their portfolio on platforms such as Instagram, Pinterest, Etsy, and Shopify<\/li>\n\n\n\n<li>By using keywords relevant to your industry on Google, Bing, or DuckDuckGo<\/li>\n\n\n\n<li>By visiting freelance marketplaces like Fiverr, Upwork, and Toptal<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">4. Decide To Highlight a Specific Feature or the Product as a Whole<\/h2>\n\n\n\n<p>With product hero images, you have the freedom to promote a specific product feature or opt to showcase the entire product as a whole.<\/p>\n\n\n\n<p>If your product is an evolution of previous products, either stemming from in-house research and development or a competitor\u2019s last-gen product iteration, you\u2019ll want to highlight a single, unique product feature to get ahead in the digital marketing arena.<\/p>\n\n\n\n<p>The more you\u2019ll be able to differentiate yourself from your competitors, the better the chances of your product outselling their alternatives outright.<\/p>\n\n\n\n<p>Apple does a great job at this:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"322\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181929\/Apple-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98628\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181929\/Apple-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181929\/Apple-Product-Hero-Example-300x143.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>By focusing on a single feature, Apple communicates a steady evolution in its iPad product line both for its new and loyal customer base alike<\/li>\n\n\n\n<li>Gradual product improvements warrant a less aggressive marketing approach, which is smartly reflected through an inconspicuous product hero image design and a brief, descriptive copy<\/li>\n\n\n\n<li>The benefit of a thin electronic device is superbly illustrated through the use of visual cues and illustrative text, giving shoppers a sense of gradual improvement and scale<\/li>\n<\/ul>\n\n\n\n<p>Conversely, if your product is truly innovative or it\u2019s really about telling the story of the whole, show the entire product as beautifully as you can.<\/p>\n\n\n\n<p>Here\u2019s an example from groundbreaking brain-interface pioneer Neuralink:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"675\" height=\"360\" src=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21182011\/Neuralink-Product-Hero-Example.png\" alt=\"\" class=\"wp-image-98629\" srcset=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21182011\/Neuralink-Product-Hero-Example.png 675w, https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21182011\/Neuralink-Product-Hero-Example-300x160.png 300w\" sizes=\"(max-width: 675px) 100vw, 675px\" \/><\/figure>\n\n\n\n<p><strong>Why it\u2019s great:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The visibility of the entire product, albeit in successive layers, is a clear indication of an innovative and forward-thinking device that treads new ground<\/li>\n\n\n\n<li>Site visitors can experience all the device\u2019s features, major components, and technical capabilities by scrolling through the presented implant layers<\/li>\n\n\n\n<li>A single-sentence copywriting approach for each layer of the implant serves as the perfect introduction for the layperson who wants to know more, which is important since the Neuralink device isn\u2019t commercially available yet and its future depends on the success of its clinical trials<\/li>\n<\/ul>\n\n\n\n<p>Lastly, if you\u2019re trying to promote nuanced and complicated products, you might have to pick a single piece out of necessity. Showering your audience with countless features, abstract benefits, or questionable lifestyle improvements will have the opposite effect and deter them from buying your product.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">5. Get Feedback<\/h2>\n\n\n\n<p>Putting your digital marketing strategies to the test is always welcome, but, in this case, there\u2019s simply no need to do that.<\/p>\n\n\n\n<p>For example, you can get away without conducting A\/B testing on your product hero images. In our experience, this type of test is unlikely to move the needle in any measurable way and it has limited impact on product conversion rates over the long haul.<\/p>\n\n\n\n<p>However, this doesn\u2019t mean that you should give up on picking the best product hero image for the job, especially if you\u2019re working with several image variants and can\u2019t decide on which one to use.<\/p>\n\n\n\n<p>Instead, try to get honest feedback from your colleagues about the look, feel, and effectiveness of your new illustrations. Later, you can use this data to sort your product hero images from candidates that got the least attention to those images that received the most praise.<\/p>\n\n\n\n<p>This is a great, quick way to weed out any confusing options and upload a product hero image that will entice visitors into buying your products or subscribing to your service. And it will cost you next to nothing if even that.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A product hero image is a large and visually distinctive image of a product that shows the item in the best possible light, including its&#8230;<\/p>\n","protected":false},"author":279,"featured_media":98618,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","_lmt_disableupdate":"","_lmt_disable":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[876],"tags":[],"class_list":["post-98616","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-website"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>5 Required Steps for the Perfect Product Hero Image<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"5 Required Steps for the Perfect Product Hero Image\" \/>\n<meta property=\"og:description\" content=\"A product hero image is a large and visually distinctive image of a product that shows the item in the best possible light, including its...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/\" \/>\n<meta property=\"og:site_name\" content=\"The Daily Egg\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/crazyegganalytics\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-08-22T13:06:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-06T23:13:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png\" \/>\n\t<meta property=\"og:image:width\" content=\"675\" \/>\n\t<meta property=\"og:image:height\" content=\"242\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Hiten Shah\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hnshah\" \/>\n<meta name=\"twitter:site\" content=\"@CrazyEgg\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Hiten Shah\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/\"},\"author\":{\"name\":\"Hiten Shah\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/person\\\/c1969663812802521ba57624887e9df6\"},\"headline\":\"5 Required Steps for the Perfect Product Hero Image\",\"datePublished\":\"2024-08-22T13:06:00+00:00\",\"dateModified\":\"2026-01-06T23:13:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/\"},\"wordCount\":1991,\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/21181424\\\/Puma-Product-Hero-Example.png\",\"articleSection\":[\"Website\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/\",\"name\":\"5 Required Steps for the Perfect Product Hero Image\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/21181424\\\/Puma-Product-Hero-Example.png\",\"datePublished\":\"2024-08-22T13:06:00+00:00\",\"dateModified\":\"2026-01-06T23:13:12+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#primaryimage\",\"url\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/21181424\\\/Puma-Product-Hero-Example.png\",\"contentUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/21181424\\\/Puma-Product-Hero-Example.png\",\"width\":675,\"height\":242},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/product-hero-image\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Website\",\"item\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/category\\\/website\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"5 Required Steps for the Perfect Product Hero Image\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\",\"name\":\"The Daily Egg\",\"description\":\"Conversion Rate Optimization Made Easy\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\",\"name\":\"Crazy Egg\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/Crazy-Egg-logo-small.png\",\"contentUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/Crazy-Egg-logo-small.png\",\"width\":191,\"height\":100,\"caption\":\"Crazy Egg\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/crazyegganalytics\\\/\",\"https:\\\/\\\/x.com\\\/CrazyEgg\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/crazy-egg\\\/\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UCJNe_xmPi07YezxaqfoRVqg\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/person\\\/c1969663812802521ba57624887e9df6\",\"name\":\"Hiten Shah\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g\",\"caption\":\"Hiten Shah\"},\"description\":\"As co-founder and CEO, I have started multiple software-as-a-service (SaaS) companies since 2003 including Crazy Egg, KISSmetrics, and Nira. Sold my last startup (Nira) to Dropbox in 2024 and got my first ever job with a boss. I most recently worked on Product &amp; Growth for the AI Products @ Dropbox. I\u2019m now the CEO of Crazy Egg. Connect with me on LinkedIn or X\\\/Twitter.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/hnshah\\\/\",\"https:\\\/\\\/x.com\\\/hnshah\"],\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/author\\\/hiten\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"5 Required Steps for the Perfect Product Hero Image","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/","og_locale":"en_US","og_type":"article","og_title":"5 Required Steps for the Perfect Product Hero Image","og_description":"A product hero image is a large and visually distinctive image of a product that shows the item in the best possible light, including its...","og_url":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/","og_site_name":"The Daily Egg","article_publisher":"https:\/\/www.facebook.com\/crazyegganalytics\/","article_published_time":"2024-08-22T13:06:00+00:00","article_modified_time":"2026-01-06T23:13:12+00:00","og_image":[{"width":675,"height":242,"url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png","type":"image\/png"}],"author":"Hiten Shah","twitter_card":"summary_large_image","twitter_creator":"@hnshah","twitter_site":"@CrazyEgg","twitter_misc":{"Written by":"Hiten Shah","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#article","isPartOf":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/"},"author":{"name":"Hiten Shah","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/person\/c1969663812802521ba57624887e9df6"},"headline":"5 Required Steps for the Perfect Product Hero Image","datePublished":"2024-08-22T13:06:00+00:00","dateModified":"2026-01-06T23:13:12+00:00","mainEntityOfPage":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/"},"wordCount":1991,"publisher":{"@id":"https:\/\/www.crazyegg.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#primaryimage"},"thumbnailUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png","articleSection":["Website"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/","url":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/","name":"5 Required Steps for the Perfect Product Hero Image","isPartOf":{"@id":"https:\/\/www.crazyegg.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#primaryimage"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#primaryimage"},"thumbnailUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png","datePublished":"2024-08-22T13:06:00+00:00","dateModified":"2026-01-06T23:13:12+00:00","breadcrumb":{"@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.crazyegg.com\/blog\/product-hero-image\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#primaryimage","url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png","contentUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2024\/08\/21181424\/Puma-Product-Hero-Example.png","width":675,"height":242},{"@type":"BreadcrumbList","@id":"https:\/\/www.crazyegg.com\/blog\/product-hero-image\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/www.crazyegg.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Website","item":"https:\/\/www.crazyegg.com\/blog\/category\/website\/"},{"@type":"ListItem","position":3,"name":"5 Required Steps for the Perfect Product Hero Image"}]},{"@type":"WebSite","@id":"https:\/\/www.crazyegg.com\/blog\/#website","url":"https:\/\/www.crazyegg.com\/blog\/","name":"The Daily Egg","description":"Conversion Rate Optimization Made Easy","publisher":{"@id":"https:\/\/www.crazyegg.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.crazyegg.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.crazyegg.com\/blog\/#organization","name":"Crazy Egg","url":"https:\/\/www.crazyegg.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2015\/06\/Crazy-Egg-logo-small.png","contentUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2015\/06\/Crazy-Egg-logo-small.png","width":191,"height":100,"caption":"Crazy Egg"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/crazyegganalytics\/","https:\/\/x.com\/CrazyEgg","https:\/\/www.linkedin.com\/company\/crazy-egg\/","https:\/\/www.youtube.com\/channel\/UCJNe_xmPi07YezxaqfoRVqg"]},{"@type":"Person","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/person\/c1969663812802521ba57624887e9df6","name":"Hiten Shah","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/715288b6d07eff81ecae058546cd68eaf7d1931c1b0a5472ba035eae1198262c?s=96&d=mm&r=g","caption":"Hiten Shah"},"description":"As co-founder and CEO, I have started multiple software-as-a-service (SaaS) companies since 2003 including Crazy Egg, KISSmetrics, and Nira. Sold my last startup (Nira) to Dropbox in 2024 and got my first ever job with a boss. I most recently worked on Product &amp; Growth for the AI Products @ Dropbox. I\u2019m now the CEO of Crazy Egg. Connect with me on LinkedIn or X\/Twitter.","sameAs":["https:\/\/www.linkedin.com\/in\/hnshah\/","https:\/\/x.com\/hnshah"],"url":"https:\/\/www.crazyegg.com\/blog\/author\/hiten\/"}]}},"modified_by":"Lars Lofgren","_links":{"self":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts\/98616","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/users\/279"}],"replies":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/comments?post=98616"}],"version-history":[{"count":0,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts\/98616\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/media\/98618"}],"wp:attachment":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/media?parent=98616"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/categories?post=98616"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/tags?post=98616"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}