UI Rule #1: Focus on the first textfield

We’ve been making interactive web applications for since at least 1995, when Netscape shipped JavaScript (née LiveScript). Yet I still see the same basic usability mistakes on many websites.

I’ve started a list of the ones I think we should all agree on—a set of UI Rules, if you will. First on the list is one of the easiest to fix.

Rule #1. Focus on the first text field.

Most important for login and signup pages, but this rule applies to almost any form on any page (with the possible exception of pages with lots of separate forms). Why not save your users a click when they’re performing the primary action on a page?

Let’s look at some examples. I don’t mean to pick on any of these companies—my methodology here was picking randomly off the list of trending startups on AngelList.

The Fix

Developers often use JavaScript to solve this problem, but there’s an even easier solution—the autofocus attribute on input fields. It’s supported in all modern desktop browsers, but not on mobile (potentially for usability reasons according to this explanation from Wufoo).

Let’s all agree to follow this rule from now on—however you do it, focus on the first text field on the page. In almost every case, you’re saving your users time, which will lead to increased engagement and conversion rates. Together, we can make the Web a less frustrating place.