Webinar: Bad Form Design Crimes

The biggest mistakes you could be making on your online forms

‍

Zuko has partnered with CRO expert Craig Sullivan to bring you the "Crimes of Form Design" webinar.

‍

‍

Craig takes you through some of the form disasters he has seen in his 20+ years of form optimization and how to avoid making those same mistakes. Alun Lucas, Zuko's Managing Director, then shares some of the top tips and advice from Zuko's top rated eBook on form analytics and optimization to help you improve your conversion rates.

Don't have the time to watch it all now? The rundown of the 16 form design crimes we take you through is below:

1. It’s a negotiation
2. Viewport problems
3. Lego for Forms
4. Device Compatibility
5. Usability Testing
6. Nasty Error Handling
7. Sucky Password Rules
8. Autocorrect & Keyboards

9. Heartless Validation
10. Pants Address Lookup
11. Breaking the Back Button
12. Confirm Email & Password
13. Dropdowns suck
14. Touch Target Issues
15. Text is Hard to Read
16. Go Native 4 Browser/Device

‍

Crimes of Form Design (Webinar Transcript)

Alun:
Okay — first of all, welcome everyone to Crimes of Form Design, presented by Zuko and our special guest, Craig Sullivan from Optimize or Die.

The idea today is that Craig will give you the benefit of his years of experience looking at bad forms. Then we’ll share our best tips on how to avoid these problems and improve your form conversion rates.

A little bit of housekeeping: you can drop questions at any time. We’ll handle them at the end so we don’t keep stopping and starting. But if you think of something halfway through, just put it in the Q&A.

Who are we?

So firstly, from Zuko — it’s myself… and I’m so sorry, Microsoft PowerPoint has just decided to stop.

Craig:
It’s okay — it’s going to restart. That’s fine.

Alun:
It didn’t like our pictures.

Okay, so: there’s myself, Alun, for those who don’t know me. I’m Managing Director at Zuko, and Lena, my colleague.

We’re around today and available to answer questions even after this session. Our details are on screen, so feel free to drop us an email any time.

For those of you who don’t know Zuko: we are the artist formerly known as Formisimo.

We launched in 2014 off the back of finding a lot of form frustration. We developed a form analytics product to help people understand when, where, and why people were dropping out of their forms, so they could do something about it based on data.

Zuko is the second evolution of our platform — so we call ourselves Zuko now for all intents and purposes.

So that’s us. I will now hand you over to Craig, who will start his section: Crimes of Form Design. Over to you, Craig.

Craig Sullivan: Crimes of Form Design

Craig:
Thank you very much for the introduction, Alun.

So what is my dark and slightly threatening talk about today? It’s about all the crimes of form design — all the things that you can get wrong that are going to make people angry, make people abandon, harm your business, and generally upset people.

This is going to cost money. So they’re crimes.

I’ve been geeking out on forms since 1999. There are very few of us dotted around the world who specialise in forms, but I’ve also been experimenting with them since 2004.

I help companies unlock latent value that they had no idea they had in the first place.

My forms journey started in 1999, in the dot-com boom, when I was building early-stage ecommerce websites for the John Lewis Partnership.

One of the fundamental things I learned as soon as I started taking our designs into the usability lab was this:

We didn’t know what we were doing.

Despite our best intentions, when exposed to users — either in the lab or at scale on our websites — we were exposing fundamental problems.

That’s when we realised you cannot build high-converting forms without data and users. Full stop.

You could end the deck right now.

But what happened since 1999? Have we learned anything? Have we improved forms? Have they gotten substantially better in that time?

I would argue: no.

The design may have changed. It may look slicker. But the same problem is still gnawing away at the worm at the heart of the apple.

We have replaced a lovely, smiling, helpful, approachable shop assistant with a robotic, monotonous, unfeeling piece of software that doesn’t care about you at all.

What could possibly go wrong?

It was the problem then — squeezing all the humanity out of your interactions with customers by using web forms — and it’s still the problem now.

So these are the crimes I’ll cover today. These are the worst ones to commit.

Crime #1: Treating Forms Like an Interrogation

The first crime is forgetting that a form is not an interrogation.

This isn’t you putting a suspect under a spotlight and trying to extract data from them with pliers. It’s a negotiation.

Try walking up to somebody in the street and randomly asking them for their phone number or email address. They’ll look perplexed… or they’ll hurt you.

It’s not a good way of doing things.

When you have on one side a bunch of people who want clean data in their database and strict rules to enforce that, and then customers who are trying to get through a form, you’re setting up an adversarial relationship.

Your form becomes a battleground between the user and your data gatekeepers.

That is the worst scenario to end up in.

Crime #2: Bad Copy and Bad Error Messages

I once ran a 40-participant usability study.

All we changed between the two groups of 20 was the error messages.

One group got default, unfriendly error messages. The other group got really nice, happy, helpful error messages.

At the end, we asked: “How would you rate the ease of use of this product?”

The people who got the nice error messages rated it nearly two points higher.

And the only difference was the error messages.

The funniest thing of all is that the question itself was useless, because none of them were able to complete their task — but it taught me something:

Even changing error messages can alter the perception of your product.

So if you hire IT people, you should hire a copywriter who knows how to write copy for forms.

Bad copy on your site right now is costing you far more money than hiring a copywriter.

Good copy earns tens or hundreds of times the cost you put into it.

Don’t forget the UX writing layer in your product.

Crime #3: Viewport and Mobile Design Failures

Why do people try and stuff everything into the viewport?

This is why I clear cookies and look at first-time visits.

A cookie message that takes up 100% of the mobile viewport is not what I came here for. I came here to shop.

There is no one “mobile viewport”. There’s a whole range of device sizes.

Your product experience is seen through that lens — and it changes considerably depending on the device mix.

Your site might look okay on a Samsung S8, but if it’s obscured by overlays on a mass-market iPhone, you’ve left a huge amount of money on the table.

Common viewport issues include:

• tooltips and messages going off-canvas
• chat overlays that follow you down the page
• labels wrapping badly
• error messages appearing three screens up the page
• fields that are far too wide for their intended input

If the error message exists but the user can’t see it, it doesn’t help.

Crime #4: Designing Forms from Scratch Instead of Using Proven Patterns

Let’s talk about “LEGO for forms”.

This is the field-level pattern. You can steal this stuff. There are proven patterns from Nielsen Norman Group and GOV.UK.

The GOV.UK patterns work.

They provide a good baseline. They’re not contextualised for your product — they’re not the finished job — but they’re a strong starting position you can optimise from.

Don’t design forms from scratch.

And don’t copy random forms on other websites. You have no idea if they’ve screwed it up.

Use tried and tested patterns.

Crime #5: Poor Device Compatibility

The foundations of high-converting products are simple:

• Device compatibility
• Performance
• Accessibility
• Usability

Get these right, and you’re doing incredibly well.

After modelling hundreds of sites, I’ve learned something:

For most sites, the top four to six devices represent 80–95% of the audience.

This is your minimum viable product testing list:

• a small iPhone
• a small Android
• a Mac laptop
• a Windows laptop
• optionally an iPad and Android tablet (if you have the traffic)

If it works on a small iPhone, it will work on the big one.

That is not true the other way around.

Testing hardware will cost you about £1,000 second-hand — which is less than most businesses spend on ads.

Don’t be a cheapskate. Buy the hardware.

Crime #6: Not Testing with Real People

Sun Tzu said: “No plan survives first contact with the enemy.”

No form design survives first contact with users.

UX without users is just guest designing.

My best ideas came from usability testing.

The form is a doorway into your brand.

Until you test, you have no idea what’s happening.

If you want a cheaper option, hire an HCI student from your local university. They’ll often love to help.

Crime #7: Nasty Error Handling

Errors make people angry.

They also anticipate errors coming, which raises cortisol levels. That makes people abandon.

The correlation between errors and abandonment is huge.

Avoid showing errors wherever possible.

And don’t show errors only on submit. That will hammer conversion.

Inline validation is better.

The best of all is inline validation plus step-by-step feedback.

People love being told they’ve done something right. It reduces anxiety.

Crime #8: Terrible Password Rules

Sucky password rules cost huge amounts of money.

Password strength comes from length, not complexity.

We’ve trained everyone to use passwords that are hard for humans to remember, but easy for computers to guess.

Stop imposing unnecessary constraints.

Allow:

• a minimum length (e.g. 8+)
• up to 30 characters
• any format

This reduces password reset requests and improves conversion.

Crime #9: Autocorrect and Wrong Keyboard Types

Someone once asked me: “Why is the most edited field the customer name?”

People generally learn their name by the age of three.

The problem was autocorrect.

If you have a name that isn’t in a dictionary, autocorrect will change it. That’s annoying, discriminatory, and costly.

Many fields should never have autocorrect enabled:

• names
• emails
• postcodes
• addresses
• card numbers
• passwords

Also, there are four keyboard layouts on mobile. Use the right one for the right field.

The work is already done — there are cheat sheets listing the correct HTML attributes.

This is a 2–3 hour fix that removes a huge source of friction.

Crime #10: Heartless Validation

Sometimes validation gets absurd.

I once clicked “Yes” on a Swedish Airlines pop-up to pre-fill my passport information.

It filled in the field with stars to hide it — then on submit, it said my passport number was invalid.

They did it. And then blamed me.

Another example: “Invalid phone number — only digits are allowed.”

Turns out “000” was considered “not a digit”.

Premature validation is another common issue: errors appear before you’ve even finished typing.

This is premature error ejaculation.

Timing matters.

Crime #11: Bad Address Lookup

Address lookup is one of the best conversion improvements you can implement.

It’s faster, easier, and improves data quality.

I’ve measured a 5–30% increase in conversion from implementing address lookup properly.

If the user can’t find their address, you lose the sale.

Use reliable services.

Crime #12: Breaking the Browser Back Button

Breaking the browser back button is criminal.

Users must be able to go back, forward, exit, and re-enter the process.

If this breaks, 95–98% of people abandon.

Test it.

AO.com is a great example of a checkout that keeps information stateful.

Crime #13: Confirm Email and Confirm Password Fields

Why are we still doing this?

Email is something we all remember.

If someone mistypes it, it’s usually the domain suffix. Help them correct it (“Did you mean gmail.com?”).

There’s no need to ask for password twice either.

A better pattern:

• password field
• show/hide toggle
• strength indicator
• allow password managers to work

That’s it.

Crime #14: Dropdowns (Especially Date of Birth)

Dropdowns hide information and make forms slower.

Date of birth dropdowns are one of the worst.

It can take 16 taps just to scroll back to your birth year.

The GOV.UK pattern (day/month/year as separate inputs) is faster and more mobile-friendly.

Use dropdowns only when necessary, such as sorting/filtering — not essential data input.

Crime #15: Tiny Touch Targets

Touch targets must be big enough.

If buttons are 2–3mm wide, people can’t tap them.

This isn’t “fat fingers” — it’s your website.

Use a minimum touch target of around 1cm, with enough spacing.

Crime #16: Poor Text Readability

Low contrast text might look cool, but people can’t read it.

Don’t put text on patterned backgrounds.

Your font is probably too small.

Use:

• minimum 100% font size for body copy
• 130–150% line spacing
• avoid serif fonts for body copy

Readability impacts conversion.

Crime #17: Ghost Buttons

Stop making ghost buttons.

They don’t get clicks.

If you want it to look cool, fine — but don’t expect it to perform.

Crime #18: Not Using Native Browser Features

Use native capabilities:

• autofill
• password managers
• tappable phone numbers
• camera scanning for cards
• Apple Pay / Google Pay / PayPal

You don’t need to implement every payment option — test first to see what users want.

The Real Problem: The Black Box

All these crimes cost millions of hours of friction and missed sales.

And the reason it goes wrong is simple: most companies treat checkout like a black box.

Customers enter. Some leave. Nobody knows what happens inside.

That’s the problem.

So here is your toolkit:

• usability testing
• testing with real devices
• analytics data
• form analytics (like Zuko)
• session replay (Hotjar, etc.)
• polls and surveys
• contrast checking tools
• proven design patterns (GOV.UK)

Once you’ve done that, it’s not the end — it’s the start of continuous improvement.

Eventually, people will write to you and tell you how good your form was.

It will shock you — but it does happen.

Alun: Solving the Crimes (Zuko’s Top Tips)

Alun:
Great — thank you very much Craig.

We’ve been through the crimes of form design with Craig. This section is about solving the crimes so your form performs better.

We’ve pulled together some of our most effective tips from years of optimising forms.

Today only scratches the surface — we’ve got much more in our ebook, which you can download from our website.

Quick quiz

On screen, you’ll see two form versions from back in the day when we were known as Formisimo.

Which form do you think converted best, and why?

Drop your answer (A or B) in the chat — bonus points if you notice anything else we got wrong!

Tip #1: Inline Validation

Inline validation is one of the most consistently effective improvements we’ve seen.

It’s where you tell users whether they’ve completed a field correctly as they go along.

A classic study by Luke Wroblewski showed a 22% increase in conversion rates.

In our experience, we’ve seen improvements of 10–25% from implementing inline validation on forms that didn’t previously have it.

Key rules:

• Trigger validation only when appropriate (usually when the user leaves the field)
• Position messages near the field
• Keep success ticks visible (don’t fade them away)

This reduces anxiety and increases confidence.

Tip #2: Focus on the Submit Button

There is a whole cohort of users who fill in your form, press submit, and still don’t convert.

That’s money on the table.

You need to understand what happens after someone presses submit.

In Zuko, you can track what fields users return to after submitting — which helps you identify the problem fields quickly.

Common issues include phone number and password fields.

This can reveal issues responsible for 15% drops in conversion.

Tip #3: Segment Your Data

Looking at form performance in aggregate hides the real story.

Start by comparing abandoners vs completers.

For example:

• If abandoners leave in 10 seconds, you may have irrelevant traffic or overwhelming form design
• If abandoners spend similar time to completers, the form likely has usability issues

You can also compare return behaviour.

If abandoners return to one field far more than completers, that’s a red flag.

Example: address fields often show this due to validation or formatting issues.

Tip #4: Segment by Traffic Source

Traffic sources behave very differently.

Sometimes a form looks like it has broken, but the real cause is a new traffic campaign.

Paid traffic often has lower completion rates than organic, especially if the form asks for sensitive personal data too early.

We once had an insurance client improve paid traffic conversion by 41% by creating a dedicated landing page and moving sensitive questions later in the form.

Tip #5: Try to Break Your Own Form

Test your form with people who don’t know it.

Try:

• submitting it blank
• skipping fields
• using the browser back button
• leaving the form for 20 minutes
• entering letters into numeric fields
• misformatting emails, phone numbers, postcodes, and card numbers

You’ll often find usability problems and poor error messaging.

We regularly see 5–10% improvements simply by making error messages clearer.

Tip #6: Explain Why You Need Information

A lack of explanation is a common reason for abandonment.

Phone number fields are notorious — people assume they’ll be spammed.

If you need the information, explain why.

We’ve seen:

• 14% conversion improvements by removing unnecessary phone number fields
• 5–10% improvements by simply adding a reason

Trust and transparency reduce drop-off.

Results of the Quiz

Lena:
Most people are saying B — because there’s no confirm password field, the register button is clearer, and the copy is better.

Alun:
That’s correct — B had 53% more conversions.

We did mess up, though:

• we tested multiple changes at once
• we used dropdowns (which is suboptimal)

But we strongly suspect the biggest impact was removing confirm password.

Continuous Improvement

To test and refine properly:

• test one variable at a time
• integrate with A/B testing tools (Optimizely, Convert.com, etc.)
• iterate continuously

Things to test include:

• CTA positioning
• copy, instructions, and error messages
• removing non-essential fields
• form length and structure (single-page vs multi-step)
• validation methods
• save functionality
• payment options and messaging

Q&A

Craig:
A week auditing and fixing your form gives you a better baseline than spending a month planning an A/B test on a broken experience.

Experiments on suboptimal products add noise.

Baseline first. Fix fundamentals. Then test.

Dropdown alternatives for selecting countries

A good solution is a searchable dropdown / autocomplete input.

You can also:

• remove countries you don’t ship to
• put the most common countries at the top
• use smart defaults (GeoIP)

Multi-step forms vs single page

Shorter isn’t always better.

It’s about chunking and psychology.

If users land on a long form and immediately scroll down and up repeatedly, they’re evaluating effort — and may abandon.

Sometimes splitting into steps improves conversion.

Sometimes the sweet spot is in the middle.

Test it.

What if we need personal data but people abandon?

It comes down to negotiation.

Explain why you need the data.

Show what they get in exchange.

If you can’t communicate the value, people won’t comply.

Shopify checkout

Craig:
Shopify checkout is okay, but it’s not optimal.

Shopify could raise revenue across their platform by continuously improving checkout, but it hasn’t changed much in years.

Chatbot-style forms

Chatbot forms are often slower and more frustrating, especially in ecommerce.

They may work in specific contexts (like GOV.UK-style question flows), but in general they aren’t a universal replacement for good form design.

Closing

Alun:
Great — thank you. I think that’s it for the questions.

Thanks everyone for attending. We’ll be sending an email with links to the video and the deck.

If you have any questions, feel free to ask any of us at any point.

Thank you everyone — have a great evening.

‍