Mr, Ms or Mx? Inclusive form design for gender diversity

Is it time for forms to include gender diversity?

Think about a form that you filled out recently, or indeed a form on your website. It’s likely you were asked for your title and your gender. It’s also highly likely that you were only given very binary answer options to these questions, for example, male or female may have been the only choices available to you for your gender. But what if you don’t fit that mould? What if you don’t identify yourself as male or female? Should we be opening up form answers to be more inclusive?

Form Example

Times have changed. Things are no longer black and white when it comes to gender identification. The proportion of the UK population who define as non-binary when given a choice between male, female and another option is 0.4%, which is 1 in 250 people (Titman, 2014).

For young Millennials and Generation Z, the proportion increases even more. Brought up with the internet and social media, their awareness of gender and acceptance of differences contributes to their challenge of traditional stereotypes.

“A lot of older people aren’t as used to talking about non-binary genders as my generation are, so a little more patience is needed for them, I guess” says Allie, 21.

When it comes to gender, young people are the most open minded and non-defining. They see their identity, including their gender, as fluid. In research by the J Walter Thompson Innovation Group, it was discovered that:

  • 80% of Generation Z (13-20 year olds) believe gender doesn’t define a person
  • 70% feel strongly that public restrooms should be gender neutral
  • >44% by clothes designed for their gender
  • 56% know someone who is gender neutral and refers to them as ‘they’ as opposed to ‘he’ or ‘she’

As marketers and designers, it’s easy to add a gender question to our forms and make it mandatory in order to collect data and market our products more effectively. But asking a non-binary person this question and forcing them to choose an option may be seen as offensive, hurtful and yet another reminder to them of how they aren’t accepted.

Let’s look at some statistics:

  • 46% of non-binary people felt the need to hide their identity as non-binary while accessing NHS services
  • Over a third of people said that they were to some extent the ‘other’ gender, ‘both genders’ and/or ‘neither gender’ Joel et al. (2014)
  • 19% of people disagreed with the statement ‘you are either a woman or a man’ and a further 7% were not sure (YouGov)
  • A survey of 79 non-binary people in the UK found that the vast majority reporting feeling uncomfortable (100%) and unsafe (94%) being non-binary in the UK

HSBC now give customers the option of a range of titles, including “Ind”, which stands for individual, meaning free of gender, and “Mre”, an abbreviation for “mystery”. In total they’ll offer 10 gender-neutral titles. However, we noticed that their website only offers Male and Female as options, meaning customers have to contact HSBC directly to change their gender (not the ideal user experience).

It’s important that digital experiences aren’t excluded from non-binary options.

With regards to your business, the risk is that your form and the experience it provides may turn people away or at the very least they’ll be left with a poor impression of your company.

So what can we address this within form design?

1 Use Mx

There are lots of gender-neutral options in use, however, the most prevalent is the use of ‘Mx’. Mx is short for Mixter, however don’t confuse this to mean a mix, it’s simply a way of identifying that a person doesn’t associate themselves as either gender.

2 Remove your Gender field

As with any form, you should always question the value of requesting data from the user. You may have a question about gender in your form that doesn’t actually provide you with enough value to warrant keeping it. In this case, remove it altogether.

3 Use ‘Other’ but use it with caution

It surprised us to see the BBC using ‘Other’ as their alternative gender choice when signing up to use the iPlayer. If this applied to you, how would you feel being categorised in the Other category? Sure they have a ‘Prefer not to say’ category but what if you want to state your gender but can’t? As a public funded organisation, one that ensures it’s services are accessible and inclusive, we would expect them to be more inclusive in how they handle questions on gender.

Use ‘Other’ with caution

4 Change the field type

If you want to represent all possible gender options, the issue is there are a lot! To keep things simple you may need to think about changing the control you use. For example, you could have a free text field, with auto-suggest. Or you could offer further options once ‘Other’ is selected (see below example from the NHS).

Change the field type

Cambridge University suggest the field is left open for the user to type in their answer (see their recommended example below).

“I would say I am gender fluid but also non-binary and trans. My gender is an evolving thing, like my sexuality, the more I explore it the more it changes. The only reason why I feel I should put a label on it is just to make it easier for other people.”

Payton Quinn, age 24

It’s important to present your gender question in an inclusive way to help non-binary people feel welcome to describe themselves as something other than men and women.

5 Make it optional

Consider if you really need this field to be mandatory. Could you change it to optional? Or could you add the option of ‘Prefer not to say’?

6 Provide reassurance of privacy

People may feel uncomfortable disclosing their gender and wonder why you want to know and what you will use it for. Providing a simple explanation can help to eliminate their concerns.

7 Consider using pronouns

Facebook have an interesting way of asking for ‘Custom’ gender. Once selected, the user is free to type in not just one gender identity, but multiple. They also select their preferred pronoun (see below).

Facebook

8 Watch your copy too!

When people don’t identify with male or female, they don’t feel comfortable being referred to as ‘he’ or ‘she’. Remember to use ‘they’ or ‘ze’.

You might also like:

Get your FREE Mobile UX Checklist
Increase your checkout conversion: 6 tips from real world user tests

Increase your checkout conversion: 6 tips from real world user tests

Mobile eCommerce UX Conversion

Are you losing too many potential customers at the checkout stage? You’re not alone. According to recent research (Baymard 2016), more than 68% of users abandon an online purchase.

Why is that? Account creation, long and complicated checkout, hidden fees and security issues are popular reasons for abandonment.

Here at Keep It Usable, we’ve been conducting research with users for a long time and we regularly see the same issues, frustrations and concerns when purchasing online.

Below we’re sharing with you the top 6 things you can do that are fundamental for improving your checkout UX and conversion.

Tip 1: Ensure delivery info and costs are visible throughout

UX Checkout Abandonment Conversion

When customers have decided to buy something from your website, the next thing they want to know about is delivery. This can be split into two parts:

Delivery information: How long will it take to arrive? Can I get it by this date? Do they deliver to me?

Delivery cost: How much is it going to cost to deliver?

Customers assess the above information alongside the cost of buying the item to determine if it’s worth going ahead with the purchase from your site or if they need to compare the price on other sites. On many websites, delivery information is not easy to find! When it’s not on the product page, often people assume it will be on the basket page. If it’s not there, some continue to checkout to check for the info, others start to look for a delivery information page (often on the footer). It’s then when things start to get messy! They struggle to find the info, they struggle to get back to the item they were looking at and it disrupts the experience resulting in them being more likely to leave.

And some of you are really doing yourselves a disservice as you’re offering free delivery or free next day delivery if you spend a certain amount (which we know converts), but you’re not making this clear enough to users where it matters most – in the basket. Don’t assume that just because you have messaging elsewhere that you don’t need to keep confirming that message along the whole user journey.

Example: Harvey Nichols

Harvey Nichols clearly display delivery information in the basket, where users expect to see it. All the available options are clearly listed, and as opposed to needing to navigate to another page to see more detailed info (such as on asos.com), each option can be easily clicked to expand more delivery details.

Harvey Nichols eCommerce Checkout

Tip 2: Checkout as a guest is a must-have

(but persuade people to sign up at the end!)

One thing that we constantly observe is that people do not want to be forced to create an account in order to buy from you. Users expect to be able to checkout as a guest, especially for single item purchases.

Users become frustrated and annoyed when they are forced to create an account because

  • If this is their first purchase from your site, they don’t know if they’ll buy from you again so for them, it’s not worth the perceived effort of signing up.
  • They assume they will be sent marketing emails (in their words ‘spam’) and they don’t want them.
  • They believe it is time-consuming. Although often the time that it actually takes to checkout as a guest is pretty much the same as needed for signing up (mostly, the only additional information required to create an account is a password).

So, what can you do? The easiest solution is to persuade them to sign up after they’ve checked out as a guest. Simply present them with a password box to create an account.

You should also remember to tell them why they should sign up. What’s going to motivate them the most? The fact that they can track their order? Get a special discount off their next purchase? Buy future purchases more quickly and easily? If you conduct regular research with your customers you should know what will appeal to them the most, if not, ask them 🙂

Asos offer the option to ‘Continue to checkout’ or sing up using a social account. This is a clever idea – they know their target audience are active social networkers!

ASOS Checkout Conversion UX

 

Tip 3: Short and easy checkout process

During user testing we consistently observe that users feel overwhelmed when they get to a page with a lot of fields to fill out.

It boils down to two main issues:

  • The number of fields they’re required to complete.
  • They feel uncomfortable with the information they’re being asked to give.

We know that you want to know as much about your customers as possible, but this comes at a price – your conversion. The majority of the time, they don’t understand why they have to provide so many details, such as phone number, gender or other personal information just to buy a new pair of shoes or handbag.

Only present required fields and relevant information, in order to avoid giving the impression that the form is longer than it really is.

Your customer doesn’t want to fill out lots of information and they don’t understand why you want to know personal information. When asking for additional information, provide some help text to explain why this is required: for example, we know that people don’t like to leave their phone number, so at the side of the phone number field explain that they will receive text alerts when the order is dispatched. This will reassure people and motivate them to progress through the checkout.

Example from ASOS:

ASOS know their users dislike giving away their mobile number, so they give a clear reason that is focussed on the user benefit ‘delivery updates’.

Mobile UX

Tip 4: Provide information in the shopping basket

Giving customers the right information at the right time can minimise confusion, eliminate surprise, increase confidence and motivate them to complete the purchase.

When your users add a product to the basket, show them details about what they are buying, stock availability, delivery options, return policies, security indicators or payment options. Users should have immediate access to all of this key information directly from their shopping basket in order to reduce their anxiety and the frustration of not exactly knowing what to expect.

Example: Marks and Spencer

Marks & Spencer Basket Conversion

Tip 5: Make navigating your checkout easy and simple

It’s important not to assume that people go through your checkout in a linear manner. In reality, users navigate back and forth to previous steps to double check and edit information.

So, you need to make sure that during your usability testing you do a full test of your checkout navigation – how easy is it to go back to previous steps and edit information? Is it easy to do on mobile or do people skip back too far and lose the information they’ve already entered?

Accordion checkouts and the problem with mobile interaction

32% of checkouts are in the accordion style (Baymard, 2016). This approach is liked because it provides all the checkout steps in individual expanding and collapsing sections, presented on a single page. Having all the checkout steps in one page encourages users to review their information and lessens navigation.

It has also a positive impact on users’ perceived length of the whole checkout process: providing all the steps on one page, makes them feel that the checkout is shorter.

Although this approach is popular, accordion checkouts can cause major problems with mobile users. On desktop, users can simply click into each section of the accordion, however, on mobile users are most likely to use their back button to navigate back to previous sections but this causes them to go back a screen, resulting in them losing all of the information they have just entered and becoming very frustrated! At this point you’re likely to lose them to a competitor who provides a better checkout experience.

Example: Walmart

Walmart’s accordion provides a summary of each collapsed section with a simple ‘Edit’ button. The summary means users can easily see and double check their information without navigating back into the section.

Walmart checkout

 

Tip 6: Use trusted logos and symbols to convert

The average user’s perception of a website’s security is largely determined by their gut feeling, which is to a large extent the consequence of how visually secure the page looks. Basically, it’s all about looks! Authentication/security logos, such as ABTA and ATOL for travel websites or the VISA authentication logo for general e-commerce websites, provide users with the peace of mind that they will be protected. We also observed that users tend to feel safer when they can pay through Paypal because they know that they will be refunded if anything goes wrong.

People will also look out for a lock symbol either on the page or in the address bar – to them that means the page is secure.

ASOS is a well-known brand but nevertheless, they are very careful to reassure users throughout the whole checkout process. They provide a security logo even before users have started to enter their information. The logo is further reinforced by a note which reassures users that their personal data will never be used or posted on their behalf.

Example: Harvey Nichols

Harvey Nichols use the Norton logo and the accepted card logos to increase trust.

eCommerce Payment Card Types for Conversion UX

Example: Marks and Spencer

 Secure Checkout UX

Marks and Spencer go a step further by adding the lock symbol to their call-to-action button, and they’ve clearly thought about the persuasiveness of the copy too ‘Checkout securely’.

 

Need more help?

Need some expert help to increase your conversion? Want to understand your customers better and how they use your website across platforms so you can align your strategy with their needs, increase the effectiveness of your marketing and convert traffic better?

We’ve done so much user testing of websites and checkouts over the years for many brands, we know what works and what doesn’t work to convert traffic into loyal customers. We can also optimise your checkout across platforms – is your mobile experience not converting as well as it should?

Get in touch with us for a chat about your challenges and goals to reveal how we can help you to achieve them.

 

Psychology of Social Networks: What makes us addicted?

Psychology of Social Networks

Have you ever thought about the number of times you check social networks? Is it a few times a week? Once a day? Seventy-two percent of online adults use social media and the average user spends 23 hours a week on social media – that’s the equivalent of a part time job!

We are living in the social media era.

– 2 billion worldwide social network users

– 500 million tweets sent every day

– 70 million images uploaded on Instagram every day

– 300 hours of video uploaded per minute on YouTube

What makes us so addicted?

Social networks are an extension of ourselves.

Communication occurs during interaction, and our need to be connected and interact with others is universal and unavoidable; hidden behind this social instinct there is the even more powerful necessity of giving sense and meanings to our world. Being in touch with others, allows us to create social universes made of symbols – e.g. language, numbers, gestures, emoticons 🙂 – and social rules, which are shared and understood by everybody.

Social validation is an important part of being human. A Facebook ‘Like’ or a Twitter ‘Favourite’ is a social signal that makes us feel good.

Fear Of Missing Out (FOMO) is a large driver of social network use, particularly for those aged thirty and under. Sixty-seven percent of users say that they’re afraid they’ll “miss something.” Dr Stephanie Rutledge explains:

We have a brain wired for collaboration, compromise, restraint, comprehending and managing one’s place in shifting-alliances. We notice when others are doing something that excludes us. It will trigger some primitive survival responses. People under 30 are still in the period when they are establishing their own lives, developing personal and professional identities, becoming economically viable (creating alliances), etc. Their focus will of necessity be social.

Ego needs a platform to showcase itself and social networks are the perfect answer. Eighty percent of our online conversations are self-disclosure, compared to 30 to 40 percent of offline conversations. We live in a ‘Me’ society with an obsession of the ‘self’ that drives us to update our status and tag ourselves in photos (but only those that we look good in of course).

Social comparison and self esteem increase. People compare themselves to assess feelings, strengths, weaknesses, abilities and perspectives. Having your social connections reaffirmed makes you feel good.

Brain chemistry. Social networks are physically addictive as well as psychologically. A study from Harvard University showed that self-disclosure online fires up a part of the brain that also lights up when taking an addictive substance, like cocaine.

Communication is to be human

One cannot not communicate (Watzlawick & the Palo Alto School, 1967) is one of the reasons adopted in social and clinical psychology. The social world is socially constructed through interactions between people: roles, rules, categorisations, stereotypes, normality, deviance are results of human sharing, the outcome of our being humans.

Woman on mobile phone

Social networks have the power to amplify this human nature. They have broken the barriers of distance and time, of presence and visibility. They expand the possibilities of sharing and playing identities. They fulfil the most deeply human need of finding a psychological distinctiveness and self-definition in a social context.

They become stages where observing, examining, take part to the “social staging”; the script interpreted is made by interactional dynamics, social rules, emotions and so on;

An extension of our offline world

Facebook profiles become teenagers’ “virtual bedrooms” (Hodkinson and Lincoln, 2008), meant as virtual environments to be personalised, to meet peers and play at adulthood. Several studies demonstrate that users experience the interaction on social media as an extension of their offline social relationships, as a supplement to their real life, and not as a substitution of it.

Social networks are an extension of our most deep psychological instinct, being social

Social networks become stages with no time and no space.

In conclusion, “all media are extensions of some human faculty” (Marshall McLuhan). Social networks are an extension of our most deep psychological instinct, being social.

Social Media

Need help or advice?

If you’d like to know more about UX psychology and how it can help you, contact our UX experts for free, friendly, no-ties advice.

Other posts you may find interesting:

10 psychology techniques to drive behaviour
Behaviour modelling: How to make dogs drive cars and users click buttons

References
  • Paul WatzlawickJanet Beavin BavelasDon D. Jackson (1967). Pragmatics of Human Communication: A Study of Interactional Patterns, Pathologies and Paradoxes. Norton & Company Inc, NY.
  • Tajfel, H. (1974). Social identity and intergroup behavior. Social Science Information,13, 65-93. 
  • Hodkinson, P., Lincoln, S. (2008). Online Journals as Virtual Bedrooms? Young People, Identity and Personal Space. Young, 16(1) pp.27-46.
  • McLuhan, M. (1964). Understanding Media: The Extensions Of Man. London: Routledge & Kegan Paul.