Dear developer, your assumptions are wrong

by Stefania Mellai published on

As developers, validation of user input is one of the first things we are taught.
What we usually learn a lot later (or sometimes never), is to challenge our own biases and assumptions.

So, for example, we may think it would be a good idea to put some restrictions in an input field for a name:

<label for="name">First name:</label>
<input type="text" minlength="3" maxlength="20" id="name">

You might be surprised at discovering how many people in the world have names with just 1 or 2 letters (Read the article Inclusive name inputs – because not everyone is called Chad Pancreas by Bruce Lawson for examples), or maybe you can try to fit the full name of Pablo Diego José Francisco de Paula Juan Nepomuceno Crispín Crispiniano María de los Remedios de la Santísima Trinidad Ruiz Picasso in your poor name field.
Additionally, in many cultures of the world, no such thing as first name and last name separation exists, some people don't have any last name, and other similar cases.

But if you absolutely want to add some kind of validation, you can try with a pattern attribute:

<label for="name">First name:</label>
<input type="text" pattern="[a-zA-Z]{2,20}" id="name">

So... you're assuming names can only contain A-Z letters. What do we say then to Lee-Ann, Niccolò, Noëmi, and Mohammed-Ibrahim? We say “your name is invalid!”, of course.
At least, let's try to be more kind in the error messages.

a screenshot showing error message saying: "please enter a valid name"

It's also not very nice when your phone auto-corrects your name with a wrong value. You could consider adding an autocomplete attribute to the field, such as:

<label for="name">First name:</label>
<input autocomplete="name" autocorrect="off" spellcheck="false" id="name" />

There are a lot of things that we are not aware of, and thinking about all the possible edge cases and unusual scenarios can be really challenging. We should try to test with real users as much as possible or at least do some research on who they are / who they could be.

You can find more information about this validation problem on the W3C website, together with possible solutions and suggested best practices.

Check out awesome-falsehood to see more examples of wrong assumptions about names, phone numbers, addresses and so on.

About Stefania Mellai

Building software is a very special kind of artisanship, in which you create something from nothing. Stefania is a software engineer from Italy, that makes impalpable crafts using React, HTML and CSS, with a special eye on accessibility and good UX.

Twitter: @smellai
GitHub: smellai