Gender options

My colleague Sander van Lambalgen at got me thinking about the “gender selection”-pattern in web forms. This pattern is fairly simple, but the discussion I had today does shine a new light on the matter. How is this properly used? Why are there so many bad examples? A while back I came to the conclusion that providing a default option for selecting a gender is not a good idea. Although Jacob Nielssen‘s pattern says a radio group should always have a default, I think it’s not the right way to communicate with your users. Luke Wroblewski’s on the other hand says it’s ok to make an exception to the rule, and I’m all for it, especially in this gender-selection case. Make exceptions to make it work! The discussion I had with Sander was about having only two options in selecting a gender. Usually you have two options; Male or female. Nowadays, as our society accepts more diversity, it seems like a good time to evaluate the gender options in a web form. The first decision to make is what you want to know from your users and what you are going to do with this data. Do you need to know the sex of the user, or is gender more relevant? Most of the cases it’s irrelevant, so just don’t ask. When you decide it’s important to ask this type of information from your user, the next step is to think of the options. It’s obvious to say, but it’s not an option to ask if someone is male or female. We need to add additional options depending on the context and the organisation asking this information. There are a multitude of different terms that can be used to describe gender.

    These include:
  • female
  • male
  • genderqueer
  • androgyne
  • neuter
  • third gender
  • intergender
  • genderfuck
  • nongender
  • agender
  • nonbinary
  • transsexual or trans
  • butch
  • femme
  • male-to-female (MTF)
  • female-to-male (FTM)
  • questioning
  • ally

In some instances it’s even better to use checkboxes instead of radio buttons. That way users can submit more options depending on how they feel. When you do decide to go with a limited list, it might be an useful to include an “Other…” option so users can specify it for themselves. A big improvement in your “gender-form” is to use a more friendly label: “I identify my gender as…” is more suited for this type of question. Copy always a big difference and in this case it empowers people to be who they want to be. UX patterns provide designers with a set of best practices to help solve our UX-problems. Although the examples are inspiring, they all have their own context. A pattern is not the automatically the solution to your interface problem, simply because the rest of the world uses it that way. The digital world is in a constant change so it’s time to challenge the UX patterns and rethink if the solutions you came up two years ago, still work. Let’s do some pattern-hopping, and find some alternatives for what you believed was true. Maybe it still is, but it can’t hurt to get some fresh inspiration. Etsy’s register form:

Etsy’s register form

I found that Etsy does a good job, not preselection and including a “I’d rather not say”- option. I think this is gonna be my new best ux pattern… For now…