How to optimize your forms for mobile devices - A Video Workshop

8 tips to improve your mobile conversion

Looking to improve your form conversion?

Get an automated form health check for free showing you:

  • Friction causing abandonment
  • What's working well
  • Other areas for UX improvement

8 tips to improve your mobile conversion

Wondering why you are losing customers from your mobile site?

Watch our video session on optimizing mobile forms. Learn why people might be abandoning your mobile forms and what to do about it.

For more tips on how to improve form UX and conversion download our Big Guide to Form Optimization & Analytics.

Mobile Form Optimisation: Key Differences vs Desktop (Webinar Transcript)

Alun:
Okay everyone — hello and welcome today to our LinkedIn Live session.

Quick introduction first. I’m Alun, Managing Director of Zuko Analytics, and this is my colleague Adam. Adam, do you want to quickly introduce yourself?

Adam:
Hi, yeah. I’m Adam. I’m… well, I’ve actually got a new title now — I’m Head of Customer Success as of this week.

So yeah, I work alongside Alun looking at data, optimisation, recommendations, strategy — all that kind of stuff.

Alun:
And a well-deserved job title change as well!

So, just a little bit about Zuko before we move on to our topic today, which is all about how you optimise online forms — specifically comparing mobile forms to their desktop counterparts.

So if we click forward into the deck…

Zuko is a form analytics platform. We’ve been analysing and optimising forms for over 10 years, so we’ve got real expertise in the form game.

We also provide consultancy to a whole range of businesses on how to improve their form UX and conversion rates. And we’ve created a lot of content that we give away for free on our website — you’re more than welcome to go and have a look.

But what we thought we’d do today is: we often get asked about mobile forms, how they differ from desktop forms, and how to optimise them. So we’re going to do a short session to give you a few tips that we’ve picked up over the years.

Without further ado, I’ll hand over to Adam, who’s kind of our expert in this. I’ll jump in as we go, but Adam will be leading.

If you have any questions, feel free to drop them in the comments. Because this is LinkedIn Live there may be a delay, but we’ll get to them if we can.

So Adam — over to you.

Why Mobile Form Optimisation Matters

Adam:
Yeah, let’s jump in.

As Alun alluded to, optimising forms for mobile devices is really important — and the stats back it up. Over 60% of internet traffic is mobile traffic, so there’s a high chance that a large proportion of your form visitors are arriving on mobile.

Now, there are general principles of form optimisation that apply everywhere, but there are also specific things on mobile that you need to take extra care with because of how forms render on phones.

You’ve got a smaller screen, no mouse, no physical keyboard — it’s all touch. That creates challenges that are unique to mobile.

So today we’ll run through some of the most important mobile-specific optimisation tips.

Tip 1: Use a Single-Column Layout

Adam:
This one can cause debate online — but it’s the question of single column versus multi-column layouts.

For mobile, we’d strongly recommend using a single-column format.

It’s consistent, it’s what users expect, and it means they’re not having to scan around the screen wondering if there are fields hidden elsewhere. It reduces mental load and makes completion easier.

It’s not just about the fields either — you also need to think about important information around the form.

For example, on desktop you might have helpful copy on the right-hand side, such as “you’ll need your National Insurance number” or other supporting information.

On mobile, make sure that information doesn’t disappear just because the layout has changed. It’s just as important for mobile users as desktop users.

So your responsive design needs to ensure all key information appears properly on mobile too.

Alun:
Definitely. I can testify to this. I tried filling out some Italian government forms that were clearly built for desktop — they had three columns. On mobile it was an absolute nightmare to zoom in and even find the fields.

So yes, I’d definitely give that one a thumbs up.

Adam:
Yeah, I remember that one. It was particularly bad.

Tip 2: Avoid Long Single-Page Forms

Adam:
Second point: avoid long single-page forms.

It depends on the nature of the form, but for longer forms — like quote forms, mortgage applications, insurance forms — you don’t want users endlessly scrolling with no idea how long it’s going to take.

Instead, split the form into a multi-step form, and group questions together that are similar in nature.

Have five or six clear steps so users can progress without feeling overwhelmed.

It also reduces the amount of important content hidden under the fold, which is especially important on mobile.

You can also introduce progress indicators, like a progress bar. That helps users understand:

  • how many steps they have left
  • what kind of questions are coming next
  • how close they are to finishing

It manages expectations and keeps motivation higher.

Alun:
Yeah — and visually, the endless scroll effect is pretty bad. People scroll down, see it’s crazy long, and don’t even bother starting.

Adam:
Exactly. People see it and think: “How long is this going to take? I don’t have time.” And they just leave.

Breaking the form into bite-sized steps reduces that psychological impact.

Tip 3: Make Forms Finger-Friendly

Adam:
Tip number three: finger friendliness.

The finger is not a mouse. So you want to make it as easy as possible for users to interact with the form.

A key example is radio buttons and checkboxes. Often they’re far too small, and they become fiddly on mobile.

The recommended tap target size is 44 x 44 pixels, and you should also include spacing between options to reduce mis-taps.

This reduces unforced errors and improves the overall UX.

Another thing to consider is form formatting.

Sometimes designers introduce fancy scrollers or sliders that look good — like a scrolling selector for salary or loan amount.

But these can be difficult and frustrating on mobile, especially when the user needs to select precise increments.

A simple text input that triggers a numeric keypad is usually far easier than an interactive scrolling component.

So usability should take priority over aesthetics.

Tip 4: Use the Correct Mobile Input Types

Adam:
This is a big one: adapt your HTML input types for mobile.

Remember: mobile users don’t have a physical keyboard.

If you use a standard input type of text for a phone number, the phone will bring up a full keyboard instead of a numeric keypad. That adds unnecessary friction.

If you change the input type to tel, the user gets a numeric keypad automatically — big numbers, easier entry, fewer mistakes.

Similarly, for email fields you should use email, which brings up an “@” key and “.com” shortcuts.

There are lots of native input types you can use, such as:

  • number
  • month
  • date
  • time
  • datetime

It’s a simple change but makes a huge difference.

Alun:
And from our experience, about 40% of forms still don’t do this. So it’s a very common issue — and a very easy win.

Adam:
Exactly. It’s low-hanging fruit.

Tip 5: Avoid Tooltips — Use Visible Microcopy

Adam:
Tip number five: tooltips.

There are certain fields where users need reassurance or explanation — for example, email address, phone number, date of birth.

A lot of forms hide this information behind a tooltip icon — like a small question mark.

The problem is:

  • the icon is often too small to tap easily
  • users may not notice it
  • the tooltip can cover the field and obscure the input

So we recommend using fixed microcopy near the label instead.

If the explanation is important, don’t hide it. Make it visible.

That way, users don’t start asking: “Why are you asking for this?” and becoming suspicious or dropping out.

Tip 6: Avoid Dropdowns Where Possible

Adam:
Tip number six: avoid dropdowns if possible.

This is generally good practice across all forms, but it matters even more on mobile.

If you only have a few options — like title (Mr/Mrs/Ms) — radio buttons are usually better than a dropdown.

Dropdowns require extra taps, they cover the screen, and they increase the chance of selection errors. Radio buttons are faster, clearer, and easier.

That said, dropdowns are sometimes unavoidable — for example, selecting a country.

In those cases, make the dropdown searchable. Otherwise, mobile users have no choice but to scroll through hundreds of options.

Searchable dropdowns reduce friction dramatically.

Alun:
Another common dropdown issue is date of birth — especially year selection. People have to scroll endlessly to find their birth year.

A text input is often far easier than scrolling through a long list.

Adam:
Exactly. Always ask: “Is there an alternative?” And if there is, it’s usually worth using.

Tip 7: Improve Password Field UX

Adam:
Tip number seven: password fields.

We recommend including a masking/unmasking feature.

And on mobile, we’d often argue that unmasking by default is better.

Masking comes from an older security mindset — internet cafés, public shared computers, etc.

But on a mobile phone, users are often in a personal environment. If they can’t see what they’re typing, it increases mistakes, frustration, and password mismatch errors.

So allow users to see what they’re entering — but still give them the option to mask it if they prefer.

Tip 8: Use Mobile Native Features

Adam:
Finally: mobile phones have native features you can use to reduce friction.

For example:

  • Geolocation to preselect country fields
  • Camera scanning to capture passport or ID details instead of manual entry
  • QR codes to speed up verification
  • Biometrics (Face ID / fingerprint) as an alternative to passwords

Passwords are one of the biggest abandonment drivers we see in forms. Using newer technology to bypass that friction can make a big difference.

The goal is to reduce manual input and make the form as effortless as possible.

Next Steps

Adam:
That’s the main tips we wanted to cover.

If you want to learn more, we produce a lot of content and resources:

  • blog posts on form optimisation
  • white papers
  • guidance on mobile optimisation

We also have a form health check on our website, where you can upload your form and get an automated report on the good, the bad, and the ugly.

And we offer free trials of Zuko — 1,000 sessions — so you can try it out and see where users are struggling.

We also offer consultancy through workshops, written reports, and quick impact reviews.

So if you want support with your form optimisation journey, drop us a message.

Closing

Adam:
If you want to connect with us, you can add us on LinkedIn — our QR codes are on the screen. Drop us a message and we can continue the conversation there.

Alun:
Yeah — and if you’ve got any questions about forms, or just want an opinion, feel free to ping myself or Adam on LinkedIn.

Thanks Adam for that tour de force. Hopefully you’ll all agree those are practical tips you can apply to your own mobile web forms.

We’ll wrap it up now. Because it’s LinkedIn Live, questions tend to come through late — so if something occurs to you after watching this, send us a message.

Otherwise, enjoy the rest of your day, and hopefully we’ll speak on the internet soon.

Bye!

Adam:
Thank you — bye.

We wrote the book on form optimization!

"The best book on form design ever written - 80 pages of PURE GOLD"

Craig Sullivan, CEO, Optimise or Die
Two copies of the book 'The Big Guide to Form Optimization and Analytics' by Zuko with a laptop screen showing graphs on the cover.Guide dogs in training wearing harnesses inside a vehicle, with a man seated beside them.

Want to get started with Zuko?

Start a free trial that includes all features, or request a demo