Form submission website best practices

A contact form asks a stranger for something before they know what they get back. The name and email boxes are easy. The trouble starts at the box that feels like a commitment: a phone number that must match one format, a budget list whose lowest option is above what the visitor expects to pay, or a required project box. Many forms keep Send disabled until every rule passes, and say nothing about which rule failed. The visitor scrolls up looking for a red mark that is not there, then leaves. On a phone the same box can sit under the keyboard, so the message goes unseen.

• Is Send grey after every box is full? If so, the form hides the reason.
• Mark each required box. Could a stranger answer it honestly before talking to you?
• Type a phone number with a plus sign, spaces and brackets. Does the form accept it?
• Does each error sit beside its box, and stay visible with the keyboard open on a phone?
• Does a long message box push Send below the screen edge on a phone?

Walk the form top to bottom as a stranger. Name and email rarely cause trouble. The phone box is the first real hurdle, because a visitor who types a number with spaces and a country code can meet a rule that accepts digits only. Next comes the consent line, 'I agree to the privacy policy', which is often left unticked, so Send stays disabled. The last box is usually the long message field, which some forms mark required even when the visitor has already said what they need. Each of these looks harmless to the owner, who types the same kind of number every day and reads the policy line as a formality.

Two problems look alike from the owner's chair and differ in the record. If visitors open the form and never type in it, the trouble is above the form: the heading, the offer or the length of the page before it. If they type, get as far as Send, and leave, the trouble is a box or the button. The test report gives the step and a screenshot for each visitor, so you can see whether they left at a field or at Send. If your form tool keeps partial entries, compare them with the finished ones. A field that is almost always empty on the partial entries is the first one to look at.

Why visitors leave a page

Wrong: a phone box marked required with a note that says 'digits only', a budget list that starts at a high figure with no lower choice, and a grey Send button with no message. Right: a phone box marked optional with 'Add a country code if you are outside the US', a budget list that starts low and offers 'Not sure yet' at the top, and an enabled Send that lists the missing boxes when pressed. The right version still asks for the same details. A homeowner who does not know the budget picks 'Not sure yet' and reaches Send, so the job arrives described even when the price is open.

A quote form changes whenever you add a service, a new budget band or a consent line for a new campaign. Each change can move Send out of reach again. Rerun the same visitors after every form edit, on a laptop and on a phone, and read the step where each one stopped. Do it on the preview address before the change goes live, so a broken form never reaches the people who would have sent it.