Contact form best practices come down to five things: ask only for the information you need to reply, use visible labels and the right input types, show clear errors next to the field, protect against spam without punishing real people, and make sure every message actually reaches you. Then confirm submission with a page that tells people what happens next.
I recently rebuilt the enquiry flow on my own site, and contact forms are part of almost every project I deliver. This post supports my landing page structure pillar.
What makes a good contact form?
A good contact form is short, clear and reliable. Visitors understand each field instantly, can complete it on a phone in under a minute, get helpful feedback if something is wrong, and receive confirmation that their message was sent. The business receives every message, quickly, with enough information to reply well.
1. Keep fields to the minimum
Start with:
- Name
- A way to reply (email or phone, or let them choose)
- Message
Add fields only if they improve your reply:
- Project type (select): helps route and prepare.
- Budget range (optional select): useful for service businesses, but can deter some visitors; test it.
- Timeline: optional.
Mark optional fields as optional, rather than marking every required field with an asterisk.
2. Labels, not placeholders
- Visible labels above fields.
- Placeholders only for format examples.
- Labels connected to inputs (
forandid), essential for screen readers and for tapping a label to focus the field.
<label for="cf-phone">Phone (with country code)</label>
<input id="cf-phone" name="phone" type="tel" autocomplete="tel" inputmode="tel">
3. Mobile-friendly inputs
type="email"andtype="tel"bring up the right keyboards.autocompleteattributes let browsers fill name, email and phone.- Fields and buttons large enough to tap.
- Font size of at least 16px on inputs prevents iOS Safari from zooming in on focus.
More in the mobile-first design checklist.
4. Validation and errors
- Validate on the server always; client-side checks are only a convenience.
- Show errors next to the field, in words: “Please enter a phone number with country code.”
- Do not clear the form when an error occurs.
- Accept reasonable variations: spaces in phone numbers, different name formats, Arabic names.
- Announce errors to assistive technology (for example with
aria-describedbyand a summary). See the accessibility checklist.
5. Offer alternatives
Some people prefer messaging. A visible WhatsApp or phone option next to the form gives them another path, especially in markets where messaging apps are the norm. Keep the form as the main structured option.
6. Spam protection that does not punish users
Layer defences, least intrusive first:
- Honeypot field: a hidden field humans never fill; bots often do.
- Time check: reject submissions completed impossibly fast.
- Server-side validation and rate limiting by IP.
- Nonce or token to block direct POST requests without loading the form.
- Content filters for links and known spam patterns.
- Challenge services (privacy-friendly CAPTCHA alternatives) only if spam persists.
7. Reliable delivery
The most painful contact form problem is the silent one: the form says “sent,” but nothing arrives.
- Send through authenticated SMTP or a transactional email service, not the server’s default mail function.
- Set up SPF, DKIM and DMARC for the sending domain.
- Use a “From” address on your own domain and put the visitor’s email in “Reply-To.”
- Store every submission in the database as a backup, so a mail failure never loses a lead.
- Test monthly: submit the form and confirm it arrives.
8. The thank-you step
After submission:
- Confirm clearly that the message was sent.
- Say when and how you will reply.
- Offer something useful while they wait: relevant articles or examples of work.
- Track the conversion (a thank-you URL or event) in analytics.
9. Privacy
- Explain briefly how you use the data, and link to the privacy policy.
- Ask only for data you need.
- Do not add people to marketing lists without consent.
- Keep submissions secure and delete old ones on a schedule.
10. Placement
- Contact page with the form above the fold on mobile.
- CTAs across the site linking to it, not to a broken anchor.
- On long service pages, a short form or CTA near the end.
Every “Contact” or “Hire me” button should be tested on each device and page type. It sounds obvious; broken CTA links are among the most common issues I find in audits.
WordPress notes
- Use a well-maintained form plugin or a lean custom form; avoid loading form scripts on every page, see reducing TBT.
- Exclude form pages from aggressive caching if forms use nonces.
- Check that security plugins or firewalls do not block form submissions.
What to ask for: a practical field set
Every field should earn its place by helping you reply well. For most service businesses, this set is enough:
- Name — one field, not separate first and last names.
- Email or phone — let the person choose, and say how you will reply.
- What they need — a short dropdown of your main services plus “Other”.
- Message — optional, with a hint such as “Tell me about your project or timeline”.
- Budget range — only if it genuinely helps you prioritise, and always with ranges rather than an open number.
If you need more detail, ask for it in the reply or in a second step after the first submission, when the person has already committed.
Forms in Egypt and the Gulf
Many people in the region prefer WhatsApp to email, so a form that only offers email can quietly lose enquiries. Offer a WhatsApp option beside the form, accept phone numbers with or without the country code (+20, +966, +971), and use type="tel" with autocomplete="tel" so phones show the right keyboard. On Arabic pages, make sure labels, placeholders, error messages and the thank-you message are all in Arabic, and that phone and email fields stay left-to-right inside an RTL layout so numbers are not reversed.
Spam protection that actually works
A honeypot field and a minimum time on page stop simple bots, but determined spam scripts load the page, wait and submit like a person. Layer the defences: add an invisible challenge such as Cloudflare Turnstile or reCAPTCHA v3, validate on the server (not only in the browser), filter messages that are mostly links, and rate-limit repeated submissions from the same address. Check the spam folder of your form plugin regularly so real enquiries flagged by mistake are not lost.
Make sure every message arrives
A form that “sends” but never reaches your inbox is worse than no form. Send through an authenticated SMTP service rather than the server’s default mail function, set up SPF, DKIM and DMARC for your domain, and store a copy of each submission in the website database. Then test the full path monthly: submit the form on mobile, confirm the email arrives, and confirm the auto-reply reaches the visitor. Google’s email sender guidelines explain why authentication matters for delivery.
Measuring the form
- Track successful submissions as a conversion in your analytics, using the thank-you state rather than button clicks.
- Compare form starts with submissions to find where people give up.
- Record the source of each enquiry so you know which pages and campaigns bring real clients.
- Measure your own response time; a fast reply often matters more than the form design.
Frequently asked questions
How many fields should a contact form have?
As few as you need to reply properly, usually three to five. Each extra required field adds friction, so make anything non-essential optional.
Should I use a CAPTCHA?
Prefer invisible checks first. Visible puzzles block some real users, including people using assistive technology, so use them only if lighter methods fail.
Is WhatsApp better than a contact form?
They serve different people. Offer both: WhatsApp for quick questions and a form for detailed requests that you need to track.
Checklist
- Minimum fields; optional ones marked
- Visible, connected labels
- Correct input types and autocomplete
- Helpful inline errors, form keeps data
- Layered spam protection
- Authenticated sending, SPF/DKIM/DMARC set
- Submissions stored in the database
- Thank-you step with expectations
- Every CTA leading to the form tested
Common mistakes
- Long forms copied from a CRM.
- CAPTCHAs that block real people.
- Error messages only in red, with no text.
- Forms that never get tested after launch.
Want your enquiry flow reviewed or rebuilt? Contact me.
Frequently asked questions
How many fields should a contact form have?
As few as you need to respond usefully, often name, a way to reply and a message. Add a field only if it clearly improves your reply, such as project type or budget range.
Should I use placeholder text instead of labels?
No. Placeholders disappear while typing and often have low contrast. Use visible labels and keep placeholders for short examples if needed.
How do I stop contact form spam?
Combine a honeypot field, server-side validation, rate limiting and, if spam continues, a privacy-friendly challenge. Avoid making every visitor solve a puzzle.
Why are my contact form emails not arriving?
Common causes are sending from a domain without SPF, DKIM or DMARC alignment, using PHP mail on hosts that block it, or spam filtering. Use authenticated SMTP or a transactional email service and keep a copy of submissions in the database.
