Main navigation

Main navigation turns a catalog structure into routes shoppers can actually use. The business outcome is not more menu links. It is a reliable first move from a broad need toward a useful product scope.

The decisions in this module cover what deserves top-level exposure, what a parent category does, how nested menus open, and how the same hierarchy behaves without desktop hover. They belong together because changing one control can alter both the destination and the shopper’s understanding of the catalog. Baymard’s research supports making broad parent headers real destinations and preventing accidental desktop menu activation.¹

Start with structure, then interaction. Confirm that the menu represents the current catalog and that every parent has a useful destination. Only then tune the hover, click, tap, and keyboard behavior. A smooth menu cannot repair a false hierarchy.

Module diagnostic

Choose one broad category. Reach it using a mouse, keyboard, and phone. Follow the parent destination, open every child level, cross the header toward search, return with Back, and repeat while logged out. Record dead labels, accidental openings, hidden branches, duplicated routes, and destinations that do not match their label.

Small assignment

Write one navigation behavior brief for the highest-impact failure. Name the label, destination, submenu control, desktop pointer behavior, keyboard behavior, mobile fallback, owner, and acceptance sequence. If the current behavior is correct, record the verified route and move on.

Evidence and further reading

1. [1]“Homepage & Navigation UX Best Practices 2025,” Baymard Institute, https://baymard.com/blog/ecommerce-navigation-best-practice. Supports clickable parent headers for broad browsing and deliberate hover behavior in desktop navigation. Accessed August 23, 2026.