Best Practice #2: Use chunking and grouping to increase scanability and learnability
So you’ve taken the mega-menu plunge and you now have more labels to fit into your drop-down. How do you make sure it doesn’t look like a mess of text?
There are a couple of options:
Grouping:
Create clear and logical groupings within the menu and give them prominent labels that can easily be scanned.
There are four elements to this approach
1. Logic: Groups have to be internally coherent and logical. Either they are all children of a common parent or somehow conceptually related in a way that is evident and quickly learnable.
2. Labeling: Use simple, unambiguous labels that convey the nature of each group. Decide if your labels will be “clickable” – is there a landing page behind them or is it just a visual way-finder? The mega-menus tend to discourage clicking on such intermediate levels, but marketing may want the space to provide category-level merchandising.
3. Volume: Follow general good practice on number of items in a category. We can thank cognitive science for an easy rule of thumb of 7 +/- 2, but I would say that in a mega-menu, space being limited, I would reduce that to 5 +/-2. This will reduce visual noise and fits well with best practice #1 (less is more).
4. Visual distinction: Use striking colors, increase white space between groups, use shading or dotted lines… anything that you can do to make a visual separation between the groups so that they eye can quickly skip from one group to the other without much thinking.
Let's look at some examples.