Web Design Agency Tip: How to Create Effective Mobile Web Forms

Nicole Krosnowski

Senior Designer

People are often hesitant to fill out forms, especially on mobile devices. Smartphones have small screens, so zooming in and out, clicking on drop-down menus and inputting email addresses can be a real headache. If a form asks too many questions or is difficult to fill out, users often have no problem leaving.
 
Of course, you don’t want people leaving your site because your forms are awful. I’m here to teach you a few tips and tricks on how to create effective web forms on mobile devices. If you’re not sure what works for your audience, remember, A/B testing is your friend.

Minimize the Number of Fields
Think carefully about the information that you need from prospects. The shorter the form, the better. Consider that every field takes effort. Forms that are too long and complicated are a top reason why people leave during checkout, so look for ways to reduce fields. You can always ask prospects for more information at a later time.

Distinguish Optional Fields
Some fields may not be necessary but can be a huge help when personalizing content. I don’t necessarily recommend optional fields, but they can be a useful alternative. Clearly distinguish these fields so that users know they are optional. The best way to do this is by putting “Optional” next to the field as opposed to an asterisk.

Automate Actions
Another way to make mobile forms more effective on your lead generating website is by automating certain actions. This cuts down on user error, too. There are a few ways to achieve this goal:

  • Autocomplete fields
  • Autocapitalize the first letter in a field (with the exception of password fields)
  • Autocorrect misspelled words (turn if off for unique fields)
  • Autofill personal details, such as credit card info  

Ask for Email Addresses and Passwords Once
I cringe when a form asks me to repeat my email address or password. I get why they do this, but many users copy and paste anyway. Plus, research shows that asking for an email address more than once doesn’t lower the chances of getting a fake address. Bottom line: Only ask for emails and passwords once (or at least give the option to show the password).

Explain Why You Need Sensitive Information
People are getting more selective about who they share their information with, and understandably so. If you need something sensitive, such as a phone number or home address, explain why this is the case underneath the field (in 100 characters or less). Also, remind users that their information won’t be shared with anyone else.

Use Sliders and Matching Keyboards
Many forms ask users to provide a range of values. Instead of using two fields - “from” and “to” - use a sliding scale instead. This is easier and more intuitive for users. To continue on with a user-friendly form, include keyboards that align with what the user is doing. For example, when filling out a credit card number, the keypad should show numbers only.
 
It’s up to designers to create forms that are inviting, easy to understand and easy to fill out. By giving attention to your mobile forms, you can make the proper adjustments and create forms that your audience will be happy to fill out!

About the Author: Nicole Krosnowski

Nicole is a Designer at SEMGeeks. She is a Jersey girl who loves to “go down the shore” and spend her time at the beach. Nicole is a creative thinker, fueled by iced coffee and innovation. She loves to stay up to date with the latest trends in fashion and technology and uses this as design inspiration. With experience in web design, digital design and advertising, she approaches each project with a designer’s careful eye and a marketer’s strategic thought process.

Talk With Our Team to learn more about this...

Comments?

We Love to Educate

Get our stellar design & marketing
tips sent right to your inbox.