Form design best practices, with our own form data

Why do people open a form and leave?

You put a form on your site, the page gets visits, and very few people send it. The usual advice is to cut fields, and that is often right. But it assumes people start the form and give up halfway, and you do not know that until you count where they actually stop.

So before the rules, here is what we could measure on real forms. Formgong counts views, starts and the field a visitor last touched, for forms whose page loads our script. We looked at every form that had at least 20 recorded views.

What did three real forms show?

Only 3 forms passed that bar, all from one business, over two to five days, so these numbers cannot tell you how many fields is right. What they do show is where people left. On all three forms most visitors never typed a single character: 106 of 129 on form A, 48 of 60 on form B, 13 of 21 on form C. Far fewer gave up once they had started.

The form with the most answers, 16, had the best result, 7 sends from 21 views. That is one small form, and people who open a booking form for a specific trip may simply be more decided. It is still a useful warning against treating field count as the only thing that matters. On form A, 5 of the 12 recorded drop-offs were at the very first field, the name, before any hard question came up. We will repeat this when more forms have enough views to compare.

Should you fix the page or the fields first?

If most visitors leave without touching the form, they decided before the first field. The length of the form they see can be part of that, but look at what sits above it too. Visitors may not know what happens after they press the button, or how soon you answer. Some cannot tell whether the form is for them, and on a phone the first field may sit below the fold. Write one sentence over the form that says what they get and when, for example “We reply within one working day with a price.” That costs nothing and speaks to the people who never start.

How many fields should a form ask for?

Every field should earn its place by changing what you do next. A name and a way to reply are almost always enough for a first contact. Anything you only need later, such as an address or a company size, can wait for the reply. If a field is useful but not essential, make it optional and say so in the label. People then skip it without wondering whether the form will refuse to send.

Where should labels go, and which input types help?

Put a visible label above each field. The W3C's forms tutorial on labeling controls says to “Provide labels to identify all form controls”, usually with the <label> element, and a placeholder that disappears as soon as someone types is not a label. One column reads top to bottom on any screen, so nobody misses the field on the right.

Group related fields with <fieldset> and <legend>, as the W3C grouping tutorial describes. Use type="email" and type="tel" so phones show the right keyboard, and set autocomplete so the browser can fill in a name, email or phone number it already knows. MDN lists the values, from name to postal-code.

<fieldset>
  <legend>Your details</legend>

  <label for="name">Full name</label>
  <input id="name" name="name" autocomplete="name" required>

  <label for="email">Email</label>
  <input id="email" type="email" name="email" autocomplete="email" required>

  <label for="phone">Phone <span>(optional)</span></label>
  <input id="phone" type="tel" name="phone" autocomplete="tel">
</fieldset>

<button type="submit">Request a call back</button>

How should errors and the button read?

Show an error next to the field it belongs to, in words that say how to fix it: “Add the @ and the rest of your email” is better than “Invalid input”. Keep what the visitor typed when the form comes back with an error, since losing it is the fastest way to lose them. The button should say what happens, such as “Request a call back”, rather than a bare “Submit”. Our guide to the accessible contact form has the complete markup, and the one on form abandonment covers the people who start and stop.

How do you measure your own form?

Rules get you a decent form. Your own numbers tell you which rule matters for your visitors. Count three things: how many people saw the form, how many started typing, and how many sent it. If the first gap is the big one, work on the page and the promise above the form. If the second is, look at the field where people stop.

Formspree's plans page, which we read on 2 November 2026, lists submission export and search, and no form analytics. Formgong counts views, starts and the field people stopped at on every plan, Free included, once the page loads its /fg.js script, which sets no cookies. The analytics docs show the report.

Can you start from a finished form?

If you would rather not build from scratch, Formgong's form templates start with labelled fields and short lists and come wired to the form backend, and the form builder styles a form to match your site. You can add the help chat for visitors who want to ask something first, and review requests for people who wrote in. Everything starts from the Formgong home page.

What changed your form's numbers?

If you changed a form and saw more people send it, or fewer, tell us what you changed at support@formgong.com. Real before-and-after numbers are what this page needs most.

What Formgong's free plan includes

• Build the form or bring your own. The form builder takes the colours and fonts from your site's address, with no sign-up; ready form templates copy into your account; AI writes the fields from one sentence. Any hand-written HTML form works too.
• Websites with the form already connected. 28 free website templates post to Formgong out of the box.
• 250 submissions a month on unlimited forms. Spam does not count. Once a year, a busy month keeps delivering on credit until the 7th instead of stopping.
• Everywhere you work. Email to up to 3 people at once, Telegram with Reply and Handled buttons, Google Sheets, Notion, and 3 signed webhooks for Slack, Discord, Zapier, Make or n8n.
• Emails to your customers in your business's name. Formgong sends them under your business name and replies come back to you, with no email service of your own to set up: a review request to every lead, a reminder a visitor asked for, and review emails after an order with your logo and colours. People who agree can also go straight into your Mailchimp, Klaviyo, Brevo, MailerLite or Kit list. An automatic reply to each visitor is on Pro.
• No captcha needed. A server-side spam filter, a honeypot, allowed domains and a block list; add your own Turnstile key if you want one.
• Files and voice. Visitors can attach files, or record a voice message that arrives transcribed.
• Made for AI-built sites. A hosted form page and a contact button; step-by-step guides for sites built with Lovable, Bolt, v0, Replit and Base44; an MCP server lets Cursor or Claude wire the form for you.
• See what the form does. Analytics for views, starts, conversion and where each lead came from, and an alert when a form goes quiet.
• One account for the rest. Customer reviews and an AI help chat that answers visitors from your own pages, with every message in one inbox. Data is stored in the EU.