navigation bar

I'm working on this e-commerce website where we have introduced a kids category and it seems that a lot of real estate on the navigation bar is wasted as users mostly browse only for one gender. So instead of having each gender as separate links, it would make sense to have a kind of toggle button similar to language select that remembers the choice throughout the visit. I'm concern though that this UI may not be very fashionable.

Any suggestions on what would be the best control to use here while still matching the fashion-based theme of the website?

  • Hiding the information within a drop down menu is not recommended, user needs to click to reveal (to see) the options. It also adds up additional step in the user flow. I would suggest to keep your menu as it is.
    – Ades
    Jan 20 '15 at 4:19
  • Aren't women/men/kids 3 distinct categories? Not sure how a toggle makes sense.
    – DA01
    Jan 20 '15 at 17:43
  • There's a secondary issue here too...does this site divide adult clothing into gender but not children's? Why is 'kids' one category but adults are split in two?
    – DA01
    Jan 20 '15 at 17:50

I'd present the user with a pop up on load so they can select the gender at first, like this:

Want to filter options?

  • all
  • kid
  • men
  • women

and remember the chosen option .

Please note that I didn't use the "gender" term since it's too restrictive for some people and it makes no sense to have a "gender" for kids, or even worse, choose all for gender (which could mean "see all genders" or "I'm multi gender")

Now, let's say the user has chosen "women", thus I'd have a bar like this:

enter image description here

and the icon would simply be a trigger to hide/show options in a checkbox so the user can choose more than one option, like "kids" and "women"

color and icon choice are optional, but I strongly suggest to have a different color for that item so the user is aware the results are being filtered.

All this being said, while you can use the solution, I'd never hide the options unless there's a real issue with them. But of course, if you choose to keep the nav, there will be additional concerns since you'll need to make sure the chosen option is clearly stated


Why not do something like this and just make it a drop down box:

  • 'kids' isn't a gender.
    – DA01
    Jan 20 '15 at 17:44
  • 1
    @DA01 - corrected. Jan 20 '15 at 18:07

Probably not the answer you wanted to hear but...

Perhaps people are browsing just the womens or just the mens because the UI encourages/enforces gender binaries. I think your proposal would only increase this effect.

Focusing on item/style would be much more beneficial.

  • If you look at most fashion e commerce website you will see separate sections for each gender
    – Blue Ocean
    Jan 21 '15 at 6:55
  • Yes, I know. I'm just not convinced that it's good UX Jan 21 '15 at 7:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.