Improve mobile form usability—turn off autocorrect
By Nicholas Gracilla · January 10, 2018 · 3 minute read
Topics: User Experience
Simple but ubiquitous WiFi login forms create frustrating usability issues for mobile users. Get it right, and your thoughtfulness and ease-of-use will extend to your brand, too.
“People hate filling out web forms, especially on mobile devices… We’ve found that by correctly using autocomplete attributes on your forms, users complete them up to 30% faster.” Ido Green, Google Chrome developer advocate
Everyone agrees: filling out forms on mobile devices is a nightmare. And while autocorrect, when correctly used, can help, it nearly always frustrates users when logging into a WiFi network. Here are three recommendations to improve mobile form usability for WiFi credentials. Follow these recommendations, and you can make getting online a breeze for your customers. You’ll provide an excellent service experience that extends goodwill towards your brand.
Turn off autocorrect defaults for username and password fields that change regularly.
WiFi login forms typically ask for a username and password that changes—the entered values never repeat for access codes that expire, and thus shouldn’t be cached, suggested, or corrected. There are four kinds of autocorrect behaviors that should be turned off.
Autocomplete allows a browser to complete values, based on values the user has entered before. Potentially helpful for “Last name,” but a real hassle for “username” when that is randomly assigned.
Auto-correction uses your keyboard dictionary to spellcheck words as you type, and automatically corrects misspelled words for you. The often funny (and occasionally NSFW) damyouautocorrect.com chronicles the text message mayhem that can come from this. But it’s nearly always wrong to autocorrect a username or password field: the latter often a random string of letters or numbers.
Apple introduced auto capitalize in iOS 5, and it quickly spread to other operating systems and browsers, like Chrome for Android. It’s hard enough to type a complex password like “b4&RqZ”—having the device Helpfully Correct It To “B4&RqZ” and fail authentication unnecessarily frays nerves. Set it to none for usernames and password fields that use codes.
Mobile devices attempt to keep us on the spelling-and-grammatical straight-and-narrow. The spellcheck behavior typically underlines words and phrases with a red line and may offer a contextual menu to help the user correct it. But on a password field, and probably a username field, it’s nearly always wrong. It creates additional visual noise and user interface confusion for the user.
Don’t mask password fields.
Jakob Nielsen says it best: masking passwords with a row of bullets typically doesn’t increase security, but it does cost business do to login failures. WiFi passwords are hard enough to enter already: masking the user’s feedback only makes them more difficult to use. See Design thinking: even WiFi passwords can support your brand message for thoughts on how even Wifi passwords can be secure, usability minded, and brand-friendly.
Use sensible, brand supported form design.
2005 is calling, and it wants its tables back. I don’t know why so many WiFi web forms have labels and fields set in a table. I suspect many 10-year-old hardware systems continue to “just work,” even as the design standards from back then feel like a real dinosaur today.
So often, these forms bring attention to themselves: “HOT SPOT INTERNET SERVICE,” for example, does nothing to help the user (who already knows what she’s trying to log into) or the brand. How about a helpful brand reminder? “Free WiFi by Hotel Chicago”, as well as a branded splash page after login, does a lot more to remind the user in a friendly way of the useful service you provide.
Neoteric Design helps businesses plan, develop, and improve websites and web applications. We are experts at modern content management systems, user experience design, Ruby on Rails web applications, and API-driven integrations. We clarify business challenges, develop user-centered solutions, and deliver high-quality, well-tested work ready for ongoing growth.
For more information, contact us.
Thanks! Feel free to send us a comment.
Sorry! Tell us how this could be better.
Was this helpful?