Designing a Contact Form That Gets More Leads

The contact form is one of the dullest-looking parts of a site, and one of the hardest-working. The visitor has read every page, been persuaded, and this form is the last step. Every bit of friction here can lose a customer you'd already won.

How many fields?

The rule is simple: as many as you truly need to do the job. For most service businesses, that's three or four fields: name, phone or email, message. Perhaps a dropdown asking which service they're interested in.

The forms we often see also ask for company name, job title, city, district, “how did you hear about us”, budget and preferred contact time. Each field has its own justification. But to a visitor, a ten-field form says “this will take a while”, and some never start filling it in. Asking for fewer fields also fits the data minimisation approach in KVKK, the Turkish data protection law.

A test: for each field, ask yourself “could I not get back to the customer without this?” If the answer is no, you can ask for that information on the first phone call.

There are exceptions. For a quote request to a construction company, it's hard to reply meaningfully without square metres, location and project type. Splitting the fields into steps works well here: first project type and location, then contact details. A step-by-step form is less intimidating than one long form shown all at once.

Required fields and labels

Make required fields clear from the start. An asterisk is common and understood, but if most fields are required, do the opposite: mark only the optional ones with “(optional)”.

Don't make both email and phone required. Accepting “phone or email” means you don't lose someone who doesn't want to give one of them but still expects a reply.

Putting labels inside the field as faint placeholder text is a common design choice, and a problematic one. The label disappears the moment the person starts typing, and they have to go back to remember what the field was. Keep the label above the field, always visible. Use the text inside the field for an example format, such as “0532 123 45 67”.

Forms on mobile

On many sites, a large share of visitors fill in forms on their phone, and small technical settings make a big difference here.

Field types should be set correctly. Tapping the phone field should open a number pad; the email field should open a keyboard with the @ sign. All it takes is for the developer to define the field with the right type; the extra cost is negligible.

Browser autofill should work. In a correctly built form, name, phone and email fill in with one tap.

Text size should be at least 16 pixels. On iPhones, tapping a field with smaller text makes the page zoom in automatically, and the user ends up scrolling sideways to fill in the form.

Fields and the submit button should be big enough to tap comfortably with a thumb. The submit button should also carry copy that describes the form: “Request a free quote” instead of “Submit”. We covered button copy in detail in our CTA post.

Error messages and after submission

A bad error message is a common reason people abandon forms. Three rules:

• Show the error right below the relevant field, in plain language. Not “Invalid input” but “Phone number should be 10 digits, without the leading 0”.
• Don't wipe the rest of the form when there's an error. Typing a long message and losing it all because of one mistake can drive a visitor away.
• If possible, show the error when the person leaves the field, not all at once after they press submit.

What happens after submission is part of the form too. A small green box saying “Your message has been sent” doesn't tell the person what happens next. A good thank-you screen says when and through which channel you'll get back to them, for example “Thanks, we'll call you during business hours.” Only state a timeframe you can actually keep. It can also suggest something to look at while they wait: the pricing page, examples of your work.

On our own site, submitting the form gives the visitor a tracking code they can use to check the status of their request. Not every business needs this, but anything that eases the “did my message get through?” worry helps.

Building the thank-you screen as a separate page also makes tracking easier; counting form submissions in Analytics becomes simple.

Finally: does the form actually reach you? Enquiries may be landing in spam, or going to the email of an employee who left years ago. Fill in the form yourself once a month to test it.

Spam protection

An unprotected form can soon fill up with bot messages. But protection shouldn't punish real visitors. Someone forced to decipher blurry letters or pick traffic lights out of nine squares may abandon the form.

Methods that don't bother visitors:

• Honeypot: a field people can't see but bots fill in. If it's filled, the message is rejected.
• Invisible verification: tools such as Google reCAPTCHA v3 or Cloudflare Turnstile check in the background without showing most visitors anything.
• Rate limiting: many submissions from the same address in a short time get blocked.

For small business sites, using these three together is usually enough.

Add a link to your KVKK privacy notice next to the form too; you're collecting personal data with it. If you want to send campaign messages to people who contacted you through the form, separate consent may be required; confirm this with your specialist. And don't make the form the only way to reach you. For visitors who'd rather call or message on WhatsApp, show those options right next to the form; we explained how to set up a WhatsApp button in a separate post.