JD Sports - Main Navigation

Role
Sole designer. SEO, Trade, PM, research, engineering.
Scale
Over 10 million sessions a month
Origin
Self-initiated audit, not a handed-down brief
Validated by
28-day A/B test against the legacy navigation

Context

JD Sports' UK navigation handles over 10 million sessions per month. It is the primary routing layer across a trading calendar built around peaks like Black Friday, Christmas, and major sporting events. When it underperforms, the business feels it in revenue.

The brief arrived as an optimisation request. I assessed whether optimisation was the right response.

Proactive Reframing

Shortly after joining, I ran a self-initiated site-wide audit framed as real world vs. online world to evaluate if the digital architecture made the same intuitive sense as a physical store. It didn't.

While the business initially approached me with a minor optimisation request, my audit made it clear the issue was deeply structural, not visual. Over time, the nav had accumulated conflicting business logic: Trade wanted promotional links,SEO wanted ranked category pages, and the user had been forgotten. I used the audit data to reframe the brief from a simple optimization to a foundational architectural redesign, securing cross-functional alignment before design work began.

Stakeholder Resistance — SEO and Trade

SEO's concern was legitimate: structural change risked disrupting search rankings for high-value category pages that had accumulated link equity over years. Trade's concern was commercial control; they viewed the mega-menu as a primary promotional lever, and a cleaner architecture felt like losing that power.

I used data to reframe their commercial fears into shared design goals:

  • SEO: Data proved that nothing beyond link position 10 received meaningful clicks. Restructuring didn't hurt high-value pages; it removed the noise diluting them.

  • Trade: Data showed their massive featured product image generated less than 2% of clicks per category. A navigation with an 18% CTR wasn't a lever—it was a commercial failure.

The challenge became designing an architecture that reduced cognitive load, maintained SEO integrity, and gave Trade a highly visible, defined promotional space within a structure people actually used.

Research — A Finding That Changed Direction

My working hypothesis was that the navigation was simply overloaded. The existing structure ran to 8 top-level categories with up to 22 items per column. I paired with a researcher to validate this against Google Analytics and a targeted questionnaire.

The data confirmed the overload but surfaced a deeper qualitative insight: users weren't just confused about where items were—they felt JD was aggressively showing everything they owned rather than being relevant to them. For browsers and gifters, this was a failure of trust, not just usability.

This sharpened the design goal. Reducing link count was necessary, but the structure needed to feel edited and curated. The resulting 6 columns, maximum 12 items per column constraint came directly from where the research showed cognitive load tipped into total abandonment. It was an evidence-based decision, not an aesthetic one.

What I Decided Not to Build

During competitive analysis, I developed an alternative pattern: a side-slide drawer replacing the horizontal mega-menu to improve desktop browsing.

When raised with the squad, engineering flagged responsive complexity across breakpoints, and Trade flagged implementation risk during live trading. Most importantly, our research showed no signal that users were frustrated by the menu format itself—only by the chaotic architecture inside it. Changing the container without fixing the contents would have solved the wrong problem, so I made the data-driven call to set it aside.

Governance & Accessibility — Keeping It Clean

Delivering a clean navigation is one thing; keeping it clean through major trading peaks is another. I proposed and established a cross-functional working group (SEO, Trade, PM, and myself) to evaluate ongoing navigation changes against our agreed architectural parameters.

This governance framework directly saved our accessibility standards. During a major winter campaign, a campaign asset went live using ice-blue promotional text on a white background—a severe WCAG contrast failure that rendered the navigation link effectively invisible. Because the working group existed, we caught the failure, escalated it, and mandated WCAG color contrast checks as a permanent review step for all seasonal trading content.

Additionally, Trade continued to push for ad-hoc links around Black Friday and Christmas, but the framework held. Promotional links were successfully restricted to their defined, high-converting space.

Outcome

The redesign was validated through a live A/B test against the legacy navigation:

  • Navigation CTR increased from 18% to 32%.

  • A/B Test Revenue increased by £300k+ over the 28-day test period.

  • The structural architecture successfully held through two major trading peaks post-launch without degrading.

What This Changed Organisationally

  • Governance Model: The working group remains active post-launch, evaluating navigation changes through an agreed framework rather than ad-hoc stakeholder requests.

  • Commercial Standards: SEO and Trade now operate strictly within a defined promotional link allowance.

  • Accessibility Integration: WCAG color contrast reviews are now a mandatory requirement for all campaign assets touching the navigation surface.

Key Decisions I Personally Drove

  • Generated the brief from a self-initiated audit and successfully reframed the project from a minor optimisation to a full structural redesign.

  • Held SEO and Trade concerns in tension, using data to reframe commercial fears into shared goals.

  • Established the 6x12 maximum item constraint derived directly from user abandonment data.

  • Made the strategic call to set aside the side-slide navigation pattern when evidence proved it solved the wrong problem.

  • Proposed, established, and successfully embedded the cross-functional governance working group.

  • Used the governance framework to catch and resolve live WCAG accessibility failures from seasonal campaign assets.

Next
Next

JD Sports - Product Customisation