They define the scope of your store
One of the biggest issues I see when looking at stores (especially newer ones) is the lack of categories in the header. This is the main way for users to grasp the scope of your store. They scan your main categories and get an idea of what you’re offering.
I recommend listing your main product categories in your menu’s level one. Show them directly in the menu (on both desktop and mobile).
Up to 10 menu items
In my experience, you can fit up to 10 categories in the menu, but less is more. 10 items become overwhelming. It’s best to have 3 -7 menu items. If you have too many, show the best selling ones and have a ‘More’ menu item for the rest.
Other important pages besides categories
The exception to this recommendation is if you have several other very important pages besides your product categories which you also want to list in the level one of the menu. In that case, you can have a “Shop” or “Departments” or “Products” menu item then the other non-category menu items.
One problem with this approach is that by hiding the product categories under a single menu item, users are likely to accidentally hover another menu item, or leave the hover area (which closes the menu).
On mobile, make sure those categories and the post-sale menu items (Order Tracking, customer support…) fit on one screen. So you may want to have an expandable “More” item to reduce your total number of menu items.
Some data:
- 18% of ecom sites have a single menu item (e.g. “Products”) under which all their product categories are displayed, which causes a couple of issues.
- About 25% of all desktop users and 70% of mobile users infer the type of site they landed on (when landing on the homepage directly) by scanning the menu and homepage.