Designing forms for mobile

This post was first published in 2008 on ‘Forms that Work’ – the companion website for Caroline’s book with Gerry Gaffney Forms that Work: designing web forms for usability. It was updated in 2011.

We’ve changed our advice and recommend designing for mobile first

Nokia X6 phone
photo of Nokia X6 : John Karatatsanis, creative commons licence

For a long time, we said ‘just say NO’ to forms on mobiles. In the days of WAP, they were too awful to contemplate.

Now – we agree with Luke Wroblewski. Design for mobile first. It’s much easier to make a successful mobile design work as a web form rather than the other way around.

Chui Chui Tan has shared some useful resources

Good place to start? Try Chui Chui Tan:

A couple of specific points to consider for mobile design

  • Text entry is difficult: Whichever type of phone you use, entering text on a mobile device isn’t easy. A recent study by Blink looked at typing on four types of mobile devices, and found no real advantage for any of them. Users get familiar with their current device, and prefer its method. A summary of the study is no longer available (2025).
  • Put labels above the fields:The Baymard Institute points out one way you can help users: put the labels above the fields. Then they can see the label as they type on the narrow mobile window. Ideally, do a responsive design so that if the user switches the screen to landscape, the labels switch themselves to the left of the fields. More details of their advice: Mobile Form Usability: Place Labels Above the Field

#forms #formsthatwork