Should your form field length be consistent or vary?

Screen Shot 2013-07-24 at 8.23.49 AM

Time and time again, user research studies show that varying the length of your form fields will improve conversion rates and lower user error. Why? Because the length of the field allows the user to estimate how long the input should be.

This means the length of the input should correspond to the length of the field. Leaving the fields a consistent length might look more tidy or more designed, but this is one of the many cases where usability trumps visual aesthetics.

How do we know how long to make our fields? A few notes.

  1. The letters “m” and “w” are particularly long. You can use these letters to consider how many pixels in width to make the field. It’s good to test this with your own type and stylesheets. Also note that Windows tends to render fonts a bit wider than Mac or Linux.
  2. Some fields are easy to know the expected length. This includes fields such as colors, dates, times, numbers, and selections.
  3. Some fields are more difficult to estimate. In general, aim to account for 99% of users. Here’s some 99%’s for a few common types of fields.
    • 99% of first names are less than or equal to 10 characters long
    • 99% of last names are less than or equal to 10 characters long
    • 99% of email addresses are less than or equal to 32 characters long
    • 99% of passwords are less than or equal to 12 characters long
  4. You can use your own database to calculate the 99% inclusion for your own form fields.

Thoughts, questions? Let us know in the comments!