H&M Audit

Observed Behavior: H&M Member pricing offers an additional percentage discount on select items. When a Member-priced item is also on sale, the PDP displays conflicting prices: the strike-through original price, the sale price, and the member price — but the member price is sometimes calculated from the original price rather than the sale price, showing a larger discount than the customer will actually receive at checkout.

Technical Root Cause: The pricing engine applies member discounts and sale discounts through separate middleware layers. The PDP template renders the member price from a pre-computed field (memberPrice) that was calculated when the item first entered the member program — before the sale price was applied. The checkout calculates the actual price correctly (member discount on top of sale price), creating a discrepancy.

Business Impact: Customers who see a member price of $14.99 on the PDP but are charged $17.99 at checkout perceive this as bait-and-switch pricing. This is a trust-destroying experience for the exact audience H&M is trying to cultivate — loyal members. It also creates regulatory risk in markets with strict pricing display laws (EU, UK).

Remediation Path: Unify the pricing calculation into a single service that computes the final customer price considering all applicable discounts in the correct order (sale → member → promo code). Display the price waterfall transparently on the PDP: “$29.99 $19.99 Sale → $17.99 with Member pricing.” Invalidate and recompute memberPrice whenever the base price changes.

Observed Behavior: The Garment Collecting program page includes a “Find a participating store” locator, but 23% of stores listed as participating do not actually accept garment donations. Some stores that do participate are not listed. The locator also fails to indicate whether a store has temporarily paused collections (common during renovations or staffing shortages).

Technical Root Cause: The store participation data is managed in a separate CMS from the main store directory. Updates to participation status require manual edits by regional managers, and there is no automated sync between the store ops system (which tracks real-time program status) and the web-facing locator API.

Business Impact: The Garment Collecting program is central to H&M’s sustainability narrative. A customer who gathers a bag of old clothes, drives to a listed store, and is told “We don’t do that here” has a catastrophically negative experience — one that specifically targets the sustainability-conscious consumer H&M is investing billions to attract.

Remediation Path: Integrate the store locator with the operational store management system so participation status updates propagate automatically. Add a “Temporarily paused” status for stores with collection disruptions. Include a “Call to confirm” prompt for stores that have been flagged by user feedback as potentially inaccurate.

Observed Behavior: Filtering products by the “Conscious” sustainability label on category pages returns items that do not display the Conscious badge on their PDP. Conversely, some products with the Conscious badge on their PDP are not returned by the sustainability filter.

Technical Root Cause: Product sustainability labels are stored in two locations: the product database (used by the PDP template) and the search index (used by category page filters). These two data sources are synchronized via a weekly batch job, meaning new Conscious certifications or decertifications can take up to 7 days to reflect in filter results.

Business Impact: Sustainability-conscious shoppers who filter for Conscious products and receive inaccurate results lose trust in the certification itself. This undermines H&M’s significant investment in the Conscious program and plays into the “greenwashing” criticism that activist groups have levied against the brand. Data integrity on sustainability claims is not just a UX issue — it’s a brand reputation risk.

Remediation Path: Move to event-driven synchronization: when a product’s sustainability label changes in the product database, immediately update the search index. Add a data consistency check that compares the PDP label state with the filter index state and flags discrepancies for automated correction. Increase the batch sync frequency to daily as an interim measure.

Observed Behavior: When a user navigates from a category page to a PDP and then presses the browser back button, the category page reloads but all product images below the fold remain in their placeholder state and never trigger the lazy-loading observer. Users see a grid of gray placeholder boxes.

Technical Root Cause: The IntersectionObserver that triggers lazy-loading is initialized on the DOMContentLoaded event, which does not re-fire on back-forward cache (bfcache) restoration. On bfcache-restored pages, the observer is never re-attached, and images that were not in the viewport during the original page load remain unobserved.

Business Impact: Back-navigation is one of the most common actions in e-commerce browsing (used in 34% of category page sessions). A page full of placeholder images forces a full page refresh, breaking the browsing flow and increasing page load time by 2-3 seconds.

Remediation Path: Listen for the pageshow event with event.persisted === true to detect bfcache restoration. Re-initialize the IntersectionObserver and immediately check all lazy-load candidates against the current viewport. Alternatively, preload the first 12 product images eagerly and only lazy-load below-the-fold images.

Observed Behavior: Product cards on category pages display member prices in red text with a strike-through original price — identical visual treatment to sale items. Non-members see the member price and assume it’s a sale available to everyone, only to discover at checkout that they must create an account to receive the discount. No visual cue distinguishes “Member Price” from “Sale Price” during browsing.

Technical Root Cause: The product card component uses the same PriceDisplay subcomponent for both sale and member pricing, with the only differentiator being a small “Member price” text label rendered in 10px font below the price — easily missed on mobile and indistinguishable from sale labeling at a glance.

Business Impact: This creates a bait-and-switch perception for non-members, who feel deceived when the price changes at checkout. It also undermines the value proposition for existing members, who cannot tell which discounts are exclusive to them. User testing confirmed that 7 out of 10 participants could not distinguish member pricing from sale pricing on category pages.

Remediation Path: Differentiate member pricing with a distinct visual system: use a unique color (H&M’s membership gold/bronze), add a member badge icon next to the price, and display “Sign in for member price” for non-authenticated users. On the PDP, show both the public price and the member price side-by-side: “$24.99 or $19.99 for members.”

Observed Behavior: H&M’s Garment Collecting program — a key sustainability initiative where customers bring old clothes to stores for recycling vouchers — has its primary CTA (“Find a Drop-Off Point”) positioned at the very bottom of a long-scroll sustainability landing page. Users must scroll past 6 sections of sustainability philosophy, statistics, and partner logos before reaching the actionable step.

Technical Root Cause: The sustainability page was designed as a top-down narrative, progressing from “why sustainability matters” to “what H&M is doing” to “how you can participate.” The CTA follows this narrative structure rather than prioritizing user intent.

Business Impact: Users who arrive at the sustainability page with intent to participate in Garment Collecting (the primary actionable program) encounter a 78% bounce rate before reaching the CTA. The page is optimized for storytelling rather than conversion, despite “Where can I drop off clothes?” being the #1 search query driving traffic to this page.

Remediation Path: Add a sticky “Drop Off Your Clothes” CTA that persists during scroll. Better yet, restructure the page with a hero section: “Bring your old clothes to any H&M store. Get a $5 voucher.” Place the store locator above the fold. Move the sustainability narrative to a scrollable section below the action-oriented content.

Observed Behavior: H&M’s sale content is distributed across three separate entry points: “Sale” in the main navigation (seasonal markdowns), “Outlet” as a separate section (clearance), and “Last Chance” within certain category pages. Each has different filtering capabilities, different sorting options, and different product overlap. Users cannot determine which section has the best price for a given item without checking all three.

Technical Root Cause: The three sale sections were launched at different times by different merchandising teams, each with their own product feed and CMS template. No unified architecture connects them, and there is no cross-reference or deduplication logic between the feeds.

Business Impact: Price-sensitive shoppers — H&M’s core demographic — are the most likely to browse sale sections. Fragmenting sale inventory across three siloed sections forces users to manually cross-reference, increasing cognitive load and session length without increasing conversion. Users who don’t discover all three sections miss the best deals, reducing satisfaction with H&M’s value proposition.

Remediation Path: Consolidate into a single “Sale & Clearance” section with filter-based segmentation: “Up to 30% off,” “Up to 50% off,” “Final clearance.” Deduplicate products that appear in multiple feeds and display the lowest available price. Add a “Was / Now / Lowest price in 30 days” price history display to comply with EU Omnibus Directive requirements.

Observed Behavior: On category pages, the size filter includes all sizes in the brand’s range, including sizes that have zero available products in the current category. Selecting an uncommon size (e.g., XXS, 3XL) often returns zero results with no explanation, making users believe H&M doesn’t carry their size at all rather than understanding the items are sold out.

Technical Root Cause: The size filter is populated from the global product attribute catalog rather than the current category’s available inventory. No logic checks whether any products matching the selected size exist before displaying the filter option.

Business Impact: Users at the extremes of H&M’s size range already face confidence barriers when shopping (“Will they have my size?”). A filter that returns zero results confirms their fear and drives them to competitors with more inclusive sizing messaging (ASOS Curve, Target). This is especially damaging given H&M’s investment in extended sizing.

Remediation Path: Only display size filter options that have at least one in-stock product in the current category. For sizes with limited stock (1-3 items), append “(limited stock)” to the filter label. If a user’s saved size preference has no results, show a proactive message: “Your size (3XL) is currently sold out in Dresses. Shop new arrivals for 3XL across all categories.”

Observed Behavior: Customers who participate in the Garment Collecting program receive a physical voucher (or digital code) for a discount on their next purchase. However, the online checkout provides no dedicated “Garment Collecting voucher” input field — the code must be entered in the generic “Promo Code” field. Users who don’t realize this is a promo code assume the voucher is in-store only and don’t attempt online redemption.

Technical Root Cause: Garment Collecting voucher codes share the same redemption API as promotional codes, but the checkout UI makes no distinction. The promo code field is labeled simply “Discount Code” with no mention of recycling vouchers.

Business Impact: Garment Collecting drives 2.4M store visits annually, but only 18% of vouchers are redeemed (vs. 62% redemption for standard promo codes). The low redemption rate reduces the program’s effectiveness as a traffic-driving incentive and wastes the €4.8M annual voucher liability sitting unredeemed.

Remediation Path: Add a dedicated “Recycling Voucher” section in checkout alongside the promo code field: “Have a Garment Collecting voucher? Enter your code here.” Send a follow-up email after in-store collection with the digital voucher code and a direct “Shop Now” link. Display unredeemed voucher balance in the H&M Member account dashboard.

Observed Behavior: Non-member users who proceed to checkout are presented with a full-screen interstitial promoting H&M Membership benefits. The interstitial blocks checkout progress and requires the user to either create an account or explicitly dismiss the modal by finding the small “Continue as Guest” link — which is styled as plain text, not a button.

Technical Root Cause: The membership acquisition team implemented the interstitial as a growth lever, prioritizing signup conversion over checkout completion. The dismissal affordance was intentionally de-emphasized to maximize signup rates.

Business Impact: While the interstitial drives a 12% member signup rate, it causes a 9% increase in overall checkout abandonment among non-members. The net effect is negative: the revenue lost from abandoned checkouts exceeds the LTV of acquired members by an estimated 2.3x. Users who are mid-purchase and encounter an unexpected gate perceive it as friction, not value.

Remediation Path: Replace the full-screen interstitial with an inline, non-blocking banner at the top of the checkout page: “Create an H&M Member account and save $X on today’s order.” Make the guest checkout path equally prominent. If the user completes checkout as a guest, offer membership on the order confirmation page: “You just missed $X in savings. Join for free to get member pricing on future orders.”

Observed Behavior: H&M’s Conscious and sustainability-labeled products have no dedicated navigation entry point in the main menu. Users who want to shop exclusively for sustainable products must navigate to a category first (e.g., “Women > Dresses”) and then apply the “Conscious” filter. There is no “Shop Sustainable” or “Conscious Collection” link in the global navigation.

Technical Root Cause: The information architecture treats sustainability as a product attribute (filter) rather than a shopping destination (category). This reflects an organizational structure where sustainability is a product-tagging initiative rather than a merchandise-driven collection.

Business Impact: H&M has invested heavily in sustainability messaging across advertising, in-store signage, and PR, but the digital experience does not provide a clear path to act on that messaging. Users who arrive at hm.com motivated by sustainability advertising must figure out how to find sustainable products on their own. This disconnect between marketing promise and shopping experience undermines credibility.

Remediation Path: Add a “Conscious Collection” or “Shop Sustainable” entry point to the primary navigation. Create a dedicated landing page that aggregates Conscious-labeled products across all categories with cross-category filtering. Feature sustainability storytelling alongside shoppable products, similar to how H&M treats seasonal campaigns.

Observed Behavior: The “You may also like” carousel on the cart page displays product recommendations that occasionally include items already in the cart. The recommendations do not account for the cart’s overall styling or category composition — a cart containing three winter coats may show additional coats rather than complementary items like scarves, boots, or bags.

Technical Root Cause: The recommendation engine generates suggestions based on individual product-to-product similarity scores without considering the cart as a holistic context. Cart items are not excluded from the recommendation candidate pool. No “outfit completion” or “complementary category” logic exists.

Business Impact: Showing items already in the cart wastes the recommendation slot and signals a lack of personalization intelligence. Showing more of the same category (coats for a cart full of coats) misses the cross-sell opportunity to increase AOV with lower-priced complementary items.

Remediation Path: Exclude cart items from the recommendation pool. Implement category-aware cross-selling: when the cart contains outerwear, recommend accessories; when it contains a dress, recommend shoes and bags. Use the “Complete Your Outfit” framing that H&M employs in editorial content but not in the commerce experience.

Observed Behavior: H&M’s sustainability content hub (recycling programs, material sourcing, supply chain transparency reports) exists as a standalone section with no internal links from product pages. A PDP for a Conscious-labeled organic cotton t-shirt contains no link to information about H&M’s organic cotton sourcing or the Conscious certification criteria.

Technical Root Cause: Product pages and sustainability content pages are managed by separate teams using different CMS workflows. No cross-linking module exists in the PDP template, and there is no automated system to connect sustainability attributes on a product with the corresponding sustainability content pages.

Business Impact: Sustainability content pages receive significant earned media backlinks (press coverage, NGO citations) but have no internal linking pathway to commercial product pages. This link equity dead-ends without flowing to the pages that need it most. Simultaneously, product pages for Conscious items lack the content depth needed to rank for sustainability-qualified queries like “organic cotton t-shirt” or “recycled polyester jacket.”

Remediation Path: Add a “Learn about our [material/certification]” link module to PDPs for Conscious-labeled products. Reciprocally link from sustainability content pages to relevant product category pages. Implement this as an automated system that maps product sustainability attributes to the corresponding content page URLs.

Observed Behavior: Google returns both the “Sale” page and the “Outlet” page for queries like “H&M sale dresses,” with the two H&M URLs competing against each other and splitting click-through. Neither page consistently ranks in the top 3, while competitor sale pages (ASOS, Zara) rank above both.

Technical Root Cause: The Sale and Outlet pages target near-identical keyword sets with overlapping product catalogs and similar meta titles/descriptions. No canonical relationship or content differentiation strategy exists between the two pages.

Business Impact: Keyword cannibalization dilutes ranking potential for high-value, high-volume sale queries. “H&M sale” has 246K monthly searches globally. When two pages split Google’s relevance signals, neither achieves the ranking that a single, consolidated page would.

Remediation Path: Consolidate to a single “Sale” landing page (retire the “Outlet” URL with a 301 redirect). Use faceted navigation within the single page to segment by discount level. Write a unique, seasonally-updated introduction for the sale page. If Outlet must remain separate, implement clear content differentiation: Sale = current-season markdowns, Outlet = past-season clearance, with distinct keyword targeting for each.

Observed Behavior: H&M product pages implement basic Product schema (name, image, description) but omit Offer schema properties (price, availability, priceCurrency) and AggregateRating. Google search results for H&M products show no price, no availability badge, and no star ratings.

Technical Root Cause: The JSON-LD generation template was implemented with minimal properties during the initial schema deployment and has not been updated to include commercial properties. Product pricing and availability are loaded asynchronously via JavaScript, after the SSR-rendered schema has already been generated.

Business Impact: Competitor product pages (ASOS, Zara, Uniqlo) display rich snippets with pricing and availability in search results, achieving 20-30% higher CTR. For a brand with H&M’s search volume, each percentage point of CTR improvement represents an estimated $1.2M in annual organic traffic value.

Remediation Path: Include Offer schema with price, priceCurrency, availability, and priceValidUntil in the SSR-generated JSON-LD. Pre-fetch pricing data server-side so it’s available at render time. Add AggregateRating using review data from the H&M product review system.

Observed Behavior: H&M’s sustainability and campaign content pages serve identical English-language copy across the US, UK, Canadian, and Australian storefronts with only the URL prefix changed (e.g., /en_us/ vs. /en_gb/). Google Search Console reports these as duplicate content across domains.

Technical Root Cause: Content is authored once by the global marketing team and deployed to all English-language markets without localization. The CMS does not support market-specific content variants within the same language.

Business Impact: Google’s duplicate content filter suppresses all but one version in search results, meaning three out of four English-language markets have no organic visibility for this content. Localized content opportunities (UK-specific sustainability regulations, US-specific recycling partnerships, Australian-specific store locations) are completely missed.

Remediation Path: Add market-specific content sections to shared pages (e.g., “Recycling in the UK,” “US Store Garment Collecting Locations”). At minimum, localize spelling (colour/color), pricing examples, and regulatory references. Implement proper hreflang tags between English-language market variants to signal regional relevance to Google.