When a website is rebuilt, the contact form tends to come last. The design settles, pages get built, someone says "we can just move the old form across", and the site launches.
But an enquiry passes through a chain of stages: noticing the button, opening the form, starting to type, submitting, receiving a reply. If nobody is responsible for designing each stage, the new site loses people in the same places as the old one.
This article splits the design of the path and the form into seven steps within a redesign, and sets out the evidence from published research and official standards.
Main sources for this article
- Zuko's form analytics data (January 2022 to April 2025, about 93 million sessions)
- Nielsen Norman Group's eye-tracking study and contact page guidelines, and Baymard Institute's form research
- W3C's WCAG 2.2, web.dev, and the GOV.UK and Japanese Digital Agency design guidance
- The GDPR text, guidance from the Dutch AP and ACM, and the Q&A from Japan's Personal Information Protection Commission
| What you will learn | The answer in brief |
|---|---|
| Where enquiries are lost | Entry point, path, form and reply (section 1) |
| How to reduce fields | Two questions: required, optional, not asked (section 6) |
| What the law requires | GDPR Article 13 information, marketing consent, Japan's purpose of use (section 9) |
| What it costs | 52–142 hours, €3,796–15,052 as an estimate (section 11) |
Why a visual refresh alone rarely moves the numbers is covered in Why a design-only redesign gets no results, and how Japanese and European buyers differ in the Japan and Europe enquiry flow comparison. This article sticks to the design procedure.
1. Enquiries are lost in four places
Talk of more enquiries quickly turns into "let's cut the form fields". But the form is only the last stage. First, look at where the numbers fall.
What public form data shows
Zuko, a UK form analytics service, publishes aggregated data from its tracking. In its January 2022 to April 2025 data, 14.5% of people who viewed a contact form completed it. Among those who started the form, 47.4% completed it.
From those two figures, about 31% of viewers started the form. In other words, about 70% left without starting.
Devices differ too. In the same data, completion among those who started a contact form was 51.2% on desktop and 39.4% on mobile.
How to read these numbers
Zuko sells form analytics and the data comes from its own clients. Consumer sectors such as finance and retail dominate, so this is not a B2B enquiry figure. Zuko also notes that device gaps may partly reflect audience and traffic source.
Zuko adds that many people opening a contact page may only want a phone number or address. Use 14.5% as a frame for your own numbers, not as a target.
What happens in each of the four places
The causes differ by place. The table below lists the symptoms and the number to watch.
| Place | What happens | Number to watch | Main fix |
|---|---|---|---|
| Entry point | Button unnoticed, or no reason to click | Page-to-form rate | Placement and wording (section 5) |
| Path | Not enough evidence, so it gets put off | Pages read before enquiring | Pricing and case placement (section 5) |
| Form | Not started, or abandoned | Start and completion rates | Fields and components (sections 6–7) |
| Reply | Not delivered, slow, next step unclear | Sales conversations | Post-submission design (section 8) |
Every stage multiplies
The stages multiply together. This table uses a fictional company whose service page gets 4,000 views a month, raising each stage by a fifth.
| Stage changed (fictional) | Change | Completions per month |
|---|---|---|
| Current | Move 5%, start 30%, complete 47% | about 28 |
| Entry point | Move 5% to 6% | about 34 |
| Form appearance | Start 30% to 36% | about 34 |
| Input effort | Complete 47% to 56% | about 34 |
A fifth more at any stage yields about the same number of extra enquiries. So it is rational to start with the stage that is cheapest to fix.
2. The overall picture: seven design steps
Build these seven steps into the redesign. The wider project flow is in the redesign process and timeline; these steps run from requirements through to post-launch.
An agency cannot know how your sales team works, so the client side decides steps 2, 4 and 6. Steps 1 and 6 are the most often skipped: they do not show on screen, so they go first when budgets tighten.
3. Step 1: Measure each stage
First, keep the old site's numbers, split by stage. Once you launch they cannot be collected again. How long to keep them and how to set baselines is in section 7 of Why a design-only redesign gets no results; here we cover how to split the stages.
Defining what to measure
Google Analytics 4 (GA4) enhanced measurement records form_start on first interaction with a form and form_submit on submission. Google's recommended events also include generate_lead for a new lead, qualify_lead for a lead judged suitable, and close_convert_lead for one that becomes a customer.
| Stage | What to record | How | Note |
|---|---|---|---|
| Entry | Button click, form view | Click and page view | Keep the source page |
| Start | form_start |
Enhanced measurement | First time per session |
| Submit | form_submit |
Enhanced measurement | A submit action, not proof of receipt |
| Complete | generate_lead |
After acceptance | On thank-you page or server response |
| Qualify | qualify_lead or internal log |
CRM or spreadsheet | Sales updates it weekly |
The reason to separate form_submit and generate_lead is that a press of the button does not mean the enquiry arrived if the server returns an error. The gap between the two also reveals post-launch faults.
Common misreadings
On European sites, cookie consent changes how many people GA4 records. If the consent rate changes, the numbers move even when enquiries do not. Check your setup against Is GA4 GDPR-compliant? and always reconcile against your own inbox.
Count phone and email contact too.
Read past enquiries
Alongside the numbers, read about 50 enquiries from the past 6–12 months. Sort them by purpose, what you had to ask in the first reply, and whether they became a sales conversation.
You learn which fields nobody would miss and what you ask for every time. The latter is what really belongs on the form.
4. Step 2: Define enquiry types and the next step
A single "Contact us" button is too heavy for people at an early stage and too distant for people in a hurry. Separate the entry points by how far along visitors are and what they want.
Choose an entry point for each type
The table lists common purposes on B2B sites and suitable entry points. Pick the ones that appear most often in the enquiries you read in step 1.
| Visitor's state | What they want | Suitable entry point |
|---|---|---|
| Checking budget | A rough price | Page with a price range |
| Requirements settled | A quote | Quote request form |
| Only a problem so far | Someone to talk to | Enquiry form and booking |
| In a hurry | A quick answer | Phone number |
| Briefing colleagues | Something to take away | PDF, no sign-up |
The first row may look like it reduces enquiries. But in HubSpot Japan's 2026 survey (1,573 respondents), the top expectation of websites and materials was "showing a guide to price and cost" (42.9%), and the top reason for first contacting a seller was checking price or a quote (42.4%). If a page answers people who only get in touch because the price is missing, the enquiries that remain are closer to the point.
Button words should say what happens next
Nielsen Norman Group (NN/g) reports that "Get Started" stops users. A label that fits anything makes a vague promise, and when the destination differs from what people expected, they lose trust. NN/g treats a link as a promise and recommends saying specifically what people will get.
The table rewrites common button labels so that the result is clear.
| Label to avoid | Rewritten | What it conveys |
|---|---|---|
| Learn more | See pricing examples | What is behind the link |
| Contact us | Request a quote (reply in 2 working days) | Purpose and reply time |
| Get started now | Book a 30-minute call | Time needed |
| Submit | Send this enquiry | Result of the action |
If you state a reply time, state one you can keep.
5. Step 3: Map the path
Mapping the path means deciding, page by page, what visitors already know and what they want to do next. Start with the ten or so pages most often read before an enquiry.
Where to place the entry point
In NN/g's 2018 eye-tracking study (120 participants), 57% of viewing time was on the first screenful and 17% on the second, with the remaining 26% spread further down. It was run on desktop screens (1920×1080), but it shows why a button only at the bottom of a long page is weak.
A button on the first screen is not enough on its own, because visitors have no reason to press it yet. Place a small one on the first screen and a larger one where the evidence ends.
People have habits about where contact links live. NN/g's 2019 guidelines recommend a visible link in the main or utility navigation and in the footer. Users look top right or at the bottom, and links tucked under "About us" go unfound.
On mobile, navigation hidden in a menu gets used less. In NN/g's 2016 study (179 participants, 6 sites), navigation was used in 57% of cases when hidden and 86% with a partly visible menu. If enquiries matter, consider showing one contact link in the mobile header.
Set the evidence and next step by page type
The table is a sample path map. In practice, put the URLs of your top ten pages in the rows.
| Page type | Visitor's question | Evidence before the button | Next step |
|---|---|---|---|
| Service | Does it suit us? | Who it is for and not for, process | Request a quote |
| Pricing | Does it fit the budget? | Range, drivers, extra costs | Book a call |
| Case study | Any similar example? | Sector, size, duration | Request the same service |
| Article | How do I solve this? | The article itself | Related service |
| Contact | How do I get in touch? | Phone, email, reply time | Form |
Sending article readers straight to a form feels abrupt for people at an early stage. Put a related service page in between.
Put pricing and evidence before the button
Writing for NN/g in 2019, Therese Fessenden says that hiding prices on B2B sites and steering people to "request a quote" adds effort, makes the product seem expensive and damages trust. Her advice: if the price varies, show common scenarios or a range.
Details on presenting prices are in the Japan and Europe comparison. What path design decides is which evidence goes in front of which button.
Do not make the form the only channel
NN/g recommends at least a phone number and an email address on the contact page, with the form as an addition rather than a replacement.
6. Step 4: Sort the fields
Debating fields by feel leads to "just in case" fields piling up. The GOV.UK Service Manual says to add a question only if you know why you are asking, what you will do with the answer and how you will check it is accurate, and calls this list a question protocol.
Sort with two questions
Ask in the order below. A field that gets two "no" answers is not asked in the first contact.
A sample sort
NN/g advises limiting a contact form to 3–5 fields and asking only for what you need to reply. The table is a sample for B2B enquiries. The autofill value is the autocomplete setting explained in section 7.
| Field | Suggested result | Reason | Autofill value |
|---|---|---|---|
| Name | Required | How to address the reply | name |
| Email address | Required | Where to reply | email |
| Purpose (select) | Required | Routing to the right person | None |
| Message | Required | Content of the reply | None |
| Company name | Required or optional | Useful in B2B | organization |
| Phone number | Optional | Only with a call-back process | tel |
| Budget and timing | Optional | Helps with quote requests | None |
| Job title, department | Don't ask | Not used in the first reply | organization-title |
| Address, postcode | Don't ask | Not needed until posting | None |
If you also serve sole traders, company name is more natural as optional. How fields differ for Japanese and European audiences is in section 7 of the comparison article.
Phone numbers and stating your reason
Phone numbers cause the most debate. In a Baymard study of 1,026 online shoppers, 14% said they would never give a store their phone number. Baymard advises explaining the reason next to the field, making it optional, or removing it.
In Zuko's field-level study (May 2023 to April 2024, 1,362 forms), the average abandonment at the phone number field was 6.28%. Both are mostly consumer figures, but they support the judgement that if you ask, say why.
For example, "We will call you back if it is urgent (optional)" states the use in one line.
Agree with sales
Cutting fields runs into sales team anxieties. Rather than arguing about whether to cut, change the question to what the first reply needs, and check whether past replies really used the information.
Varying fields by purpose means not everyone sees everything: only those choosing "quote" see budget and timing.
7. Step 5: Build the form components
With fields settled, build the components. This is where official standards are most complete. Here are the WCAG 2.2 criteria that matter for contact forms.
| Criterion | Level | What to do |
|---|---|---|
| 1.3.5 Identify Input Purpose | AA | Set autocomplete on name, email and so on |
| 2.5.8 Target Size (Minimum) | AA | Targets at least 24×24 CSS pixels (with exceptions) |
| 3.3.1 Error Identification | A | State in text which field is wrong |
| 3.3.2 Labels or Instructions | A | Give fields labels or instructions |
| 3.3.3 Error Suggestion | AA | Show how to fix it where known |
| 3.3.7 Redundant Entry | A | Do not ask for the same data again (with exceptions) |
| 4.1.3 Status Messages | AA | Make success and errors available to screen readers |
A B2B-only site is not necessarily covered by the European Accessibility Act (see the EAA article). Even so, these criteria work as a usability spec.
Labels and hints
web.dev advises against using hint text inside a field in place of a label, because it vanishes when typing starts. Japan's Digital Agency design system also says in-field hint text must not stand in for support text.
Keep labels visible outside the field, and put format examples below it.
Autofill
Setting HTML autocomplete values lets browsers offer saved details. web.dev also recommends type="email" and type="tel" to bring up the right mobile keyboard.
In Zuko's analysis of 215 forms, completion was 71% among people who used autofill and 59% among those who did not. Zuko states plainly that this is correlation, not causation, so the gap should not be used to estimate an effect.
Names and characters
W3C recommends a single name field where possible and not restricting characters. For Japanese audiences, ask for a phonetic reading (furigana) in a separate field if you need to confirm it.
Japan's Digital Agency design system says not to restrict character types in principle. Where conversion is needed, do it automatically on submit or on a review screen. Remove checks that reject a phone number because of a hyphen.
Marking required and optional
In Baymard's research, only 14% of sites mark both required and optional fields on desktop, and 6% on mobile. Because marking only one causes confusion and errors, Baymard recommends marking both.
How to show errors
Baymard reports that 31% of sites have no inline validation (published 2024). But showing errors while someone is still typing backfires. The table summarises NN/g and Baymard guidance.
| Timing | Do | Avoid |
|---|---|---|
| Before input | Put format and example below the field | Rules appearing only as errors |
| While typing | Show nothing | Flagging an unfinished entry |
| On leaving a field | Show the error next to it | Tooltip-only messages |
| While fixing | Clear the error once valid | Keeping it until resubmission |
| On submit | Show summary and field messages | Summary only, or colour only |
Keep what people typed after an error.
One page or several
W3C's tutorial recommends splitting long forms into steps and showing progress. We could not find a source showing that splitting helps contact forms. As a rule of thumb: one page for five fields or fewer, branching when fields vary by purpose, and 2–3 steps for eight or more fields or attachments. If you split, keep earlier input (WCAG 3.3.7).
Is a review screen needed?
Japanese sites often have a review screen. With few fields, people can check on the same page, and a copy by email lets them spot mistakes later. A review screen has a case when showing auto-converted text or when the request involves money.
8. Step 6: Design what follows submission
If this part is weak, enquiries that arrive never become conversations. Auto-reply wording and routing are detailed in Enquiry triage automation, so here are the main points.
What to put on the thank-you page
According to NN/g's guidelines, most users expect a response to a form within 24 hours. If you cannot manage that, state what you can do. Setting expectations is part of the path.
| What to say | Example | Why |
|---|---|---|
| It was received | "We have received your enquiry" | Removes doubt about sending |
| What happens next | "We will reply within 2 working days" | Shows the wait |
| A copy was sent | "A copy is on its way to your email" | Prompts a spam folder check |
| Urgent contact | Phone number and hours | Keeps people in a hurry |
Make the success message available to screen readers as well as on screen (WCAG 4.1.3).
Do copies and internal alerts arrive?
Email setup is easily missed in a redesign. If a form service sends as your domain, the SPF or DKIM settings may not carry over to the new setup. Google requires Gmail senders to set up SPF or DKIM.
Send internal alerts to a shared inbox with a named owner and deputy. With a personal address only, enquiries stall when that person is away.
Start spam protection with the least burden
Spam starts arriving at a new form soon enough. W3C's 2021 note points out that CAPTCHAs exclude people with disabilities, and advises starting with low-burden methods such as a honeypot (a hidden field people do not see), escalating only if attacks warrant it. Methods are compared in section 4 of Enquiry triage automation.
9. The law: what to state on the form
The law bears directly on fields and wording, so check it at the same time as step 4. This is a general overview; take advice on your specific case.
GDPR: the basis for fields and notices
For forms receiving enquiries from individuals in Europe, these articles become design requirements.
| Article | What it requires | On the form |
|---|---|---|
| Art. 5(1)(c) | Limit data to what is necessary | Use the section 6 sort as your reasoning |
| Art. 6(1) | Have a legal basis | Choose one basis for replying |
| Art. 13 | Provide information at collection | Controller, purposes, basis, period, rights and so on |
The Dutch regulator AP (Autoriteit Persoonsgegevens) says the GDPR sets no fixed retention period; each organisation decides and explains its own. Leaving enquiries in an inbox indefinitely cannot be justified. If you use a form service or an external check, also confirm the processor contract and any transfer outside the EEA.
Is a consent checkbox needed?
Many assume a contact form must have a consent checkbox, but the text does not say so. For replying to an enquiry, steps at the person's request before a contract (Art. 6(1)(b)) or legitimate interests (Art. 6(1)(f)) may serve as the basis.
The AP says one basis is to be chosen and that pre-ticked boxes are not consent. What you need is not a checkbox but the Article 13 information, visible before submission.
Marketing email needs separate consent
Keep replies and marketing apart. The Dutch ACM states that marketing emails need prior consent, that pre-ticked boxes or wording in terms and conditions are not enough, and that you must be able to prove consent for up to five years after sending. There is an exception for existing customers.
Assuming business addresses are exempt is risky. A 2012 decision (Companeo) by OPTA, ACM's predecessor, says that since 1 October 2009 the law has not distinguished between legal and natural persons. Do not automatically add people who enquire to a marketing list.
Japan: purpose of use and advertising email
Under Japan's Act on the Protection of Personal Information, when a person enters data directly on an input screen, stating the purpose of use is the rule (Art. 21(2)). The Personal Information Protection Commission's Q&A says this may be unnecessary when the purpose is obvious, such as confirming an application or notifying a result, but warns that new service announcements or sharing with partners may not be obvious. Its guidelines say the purpose should ideally catch the eye before the submit button is pressed.
Advertising email falls under Japan's Act on Regulation of Transmission of Specified Electronic Mail, which in principle requires prior consent.
Sample wording near the form
Keep it short above the submit button and link to the privacy policy. The table shows a structure; adapt the wording to how you actually work.
| Element | Sample wording |
|---|---|
| Purpose | We use these details only to reply to this enquiry. |
| Retention | If it does not lead to a project, we delete it after the period we have set. |
| Marketing (only if you send it) | Unticked box: "Send me emails about case studies" |
10. Step 7: Test before launch and review afterwards
A form cannot be signed off by looking at it. Test it through to submission, receipt and recording.
Pre-launch tests
In an environment close to production, check the following.
| Test | How | Pass condition |
|---|---|---|
| Submission | Send one per purpose | Reaches the right inbox |
| Email copy | Receive in Gmail and work email | Not in spam |
| Measurement | Use the debug view | form_start and generate_lead recorded |
| Errors | Send blank and wrong formats | Input stays; the fix is clear |
| Keyboard | Use only Tab and Enter | Focus visible; can complete |
| Old URL | Open the old form URL | Redirects to the new form |
Old forms may be linked from adverts or email signatures. The redirect procedure is in the 301 redirects article.
Also ask three to five people outside the company to submit on their phones. Staff know what each field means and will not notice the snags.
The first 90 days
After launch, check stage numbers weekly. The table is a review schedule.
| Period | What to look at | Decision |
|---|---|---|
| Launch to week 1 | Sent versus received, errors | Fix faults at once |
| Weeks 2–4 | Move, start and completion rates | Inspect any stage that fell sharply |
| Weeks 5–8 | Sales conversations, mix of purposes | Adjust fields and entry points |
| Weeks 9–13 | Comparison with old site and last year | Choose the next stage to fix |
Comparison methods are in sections 8–9 of Why a design-only redesign gets no results. Where traffic is too low for A/B tests, use stage comparisons and usability tests.
Do not judge by count alone
Cutting fields can raise the count and lower the quality. Look at completions, sales conversations and the share of first replies needing follow-up questions together. If follow-ups rise, bring that information back as an optional field. Fields can come back.
11. Costs and timing
Path and form design can sit inside a full redesign or stand alone. The table is an estimate for a business site with a few dozen staff, covering ten key pages and one form.
The hours are DevNJ's estimates. Hourly rates use the average for Dutch freelance web developers at €73 (Knab, 2026, excl. VAT) and the average agency base rate of €106 (Simplicate, Q4 2025). Yen uses the European Central Bank reference rate of 30 October 2026 (€1 = ¥175.68).
| Work | Hours | Cost (€) | Approx. yen |
|---|---|---|---|
| Audit (numbers and messages) | 8–16 | 584–1,696 | ¥100k–300k |
| Path design (10 key pages) | 12–32 | 876–3,392 | ¥150k–600k |
| Fields and wording | 6–16 | 438–1,696 | ¥80k–300k |
| Form build and thank-you page | 8–24 | 584–2,544 | ¥100k–450k |
| Accessibility check | 4–12 | 292–1,272 | ¥50k–220k |
| Measurement build | 4–12 | 292–1,272 | ¥50k–220k |
| Legal wording | 4–12 | 292–1,272 | ¥50k–220k |
| 90-day post-launch review | 6–18 | 438–1,908 | ¥80k–340k |
| Total | 52–142 | 3,796–15,052 | ¥670k–2.64m |
This excludes legal review, tool subscriptions and translation. Within a full redesign, overlap with other work can bring the total down. Overall costs are in the redesign cost article.
Reading past enquiries and sorting fields are easy to do in-house. Measurement design and legal review are safer with outside input. Allow 4–8 weeks for the path and form work including preparation, plus 90 days for review.
12. Common mistakes
Here are common mistakes alongside how to prevent them. Mistakes across a whole redesign are in the redesign mistakes article.
| Mistake | What happens | Prevention |
|---|---|---|
| Targeting a number of fields to cut | Information needed for replies disappears | Sort with the two questions |
| Removing the phone number | People looking for it leave | List phone and email too |
| Estimating from others' uplift | The plan stops matching reality | Model from your own numbers |
| Alert emails not arriving | Enquiries stop unnoticed | Reconcile inbox and tracking weekly |
| Rejecting full-width characters or short names | Valid input is blocked | Do not restrict characters |
Claims that "cutting fields raised conversions by X%" are widely quoted, but the conditions behind many are unclear, and this article does not use them.
The most serious is undelivered alerts. Enquiries do not come every day, so a stoppage can go unnoticed for days. Put a weekly test submission in someone's calendar.
13. Fictional cases
These are three fictional companies for illustration, not real businesses. No effect figures are given; only the decisions are shown.
Case A: A Japanese parts maker (Japanese only)
The move rate from product pages to the form was low, and half of past enquiries concerned lot sizes and lead times. Product pages gained that guidance, and the button became "Request a quote for this product". The fields stayed as they were.
Case B: A Dutch consultancy (English and Dutch)
The form had 12 fields with a required phone number, yet first contact was always by email. It went down to five fields with phone optional, and the retention period went into the privacy policy. Automatic marketing sign-up was replaced by a separate unticked box.
Case C: A software company selling in Japan and Europe
Job applications and pitches were mixing into the sales inbox, so a purpose selector split the destinations. Only the Japanese form has an optional furigana field, and comparisons use the internal inbox count, which consent rates do not affect.
| Case | Stuck stage | First move | Left alone |
|---|---|---|---|
| A Manufacturing | Entry and path | Product page evidence and button | Form fields |
| B Consultancy | Form | Field sort and retention period | Page visuals |
| C Software | Entry and reply | Purpose branching and routing | Overall structure |
Each first move differs. Deciding to "cut fields" without stage numbers misses the point, as in Case A.
14. Checklist
You can copy this directly into a redesign brief.
Preparation and path
- Saved move, start, completion and qualification numbers by stage
- Read 50 past enquiries and grouped them by purpose
- Button words say what happens next
- Put price ranges and cases before the button
- Listed phone and email as well
Form
- Sorted every field into required, optional or not asked
- Labels stay visible;
autocompleteandtypeare set - Errors appear after leaving a field, with the fix
- Targets are at least 24×24 CSS pixels
After submission and legal
- Thank-you page says what happens next and when
- Confirmed copies and alerts arrive; named a deputy
- Purpose and retention are visible before sending
- Marketing consent uses a separate unticked box
Around launch
- Sent real tests per purpose, and by keyboard only
- Three to five outsiders tried it on real devices
- Named an owner for the 90-day review
Summary
- Enquiries are lost at the entry point, path, form and reply. In public data, about 70% of people who see a contact form never start it
- Stages multiply, so for the same uplift fix the cheapest stage first
- Put buttons after the evidence, and make the words say what happens next. List phone and email as well
- Sort fields by whether you can reply without them and whether they improve the reply. Cutting is not the goal
- Consent to reply is not always required but the notice is. Get separate consent for marketing email
- Allow 52–142 hours for path and form design, and plan for the 90-day review
Sources
Form and path research
- Online Form Statistics & Conversion Benchmarks — Zuko: 14.5% and 47.4%; phone field 6.28%
- Form type benchmarking — Zuko: values by form type and device
- Does using browser autofill affect form conversion rate? — Zuko: autofill gap
- Scrolling and Attention — NN/g: viewing time
- Hamburger Menus and Hidden Navigation — NN/g: hidden menus
- "Get Started" Stops Users — NN/g: button wording
- "Contact Us" Page Guidelines — NN/g: 3–5 fields, 24 hours
- Building Trust in B2B — NN/g: showing prices
- HubSpot Japan buying survey — CommercePick: 42.9% and 42.4%
Building forms
- WCAG 2.2 — W3C: success criteria
- Target Size (Minimum) — W3C: 24×24 CSS pixels
- Forms Tutorial — W3C WAI: multi-page forms
- Inaccessibility of CAPTCHA — W3C: alternatives
- Personal names around the world — W3C: name fields
- Payment and address form best practices — web.dev: labels and autofill
- autocomplete attribute — MDN: values
- Reporting Errors in Forms — NN/g: error display
- Inline Form Validation — Baymard: 31%
- Required and Optional Fields — Baymard: 14% and 6%
- Explain the Phone Field — Baymard: 14% of 1,026 shoppers
- Form structure — GOV.UK: question protocol
- Input text — Japan's Digital Agency: character types, in-field hints
Measurement and email
- Enhanced measurement — Google:
form_start,form_submit - Recommended events — Google:
generate_leadand others - Email sender guidelines — Google: SPF and DKIM
Law
- GDPR Art. 5, Art. 6, Art. 13: principles, basis, information at collection
- Retention of personal data — AP: retention
- Legal basis of consent — AP: consent conditions
- Spam voorkomen in uw reclame — ACM: prior consent, five-year proof
- Companeo decision (2012) — ACM: applies to legal persons
- Input screens and stating purpose (Q&A) — PPC Japan: the rule on stating purpose
- General guidelines — PPC Japan: placement before the submit button
- Specified Electronic Mail Act leaflet — MIC Japan: opt-in principle
Costs
- Zzp web developer rates — Knab: €73 (excl. VAT)
- Benchmark report Q4 2025 — Simplicate: €106 (as compiled in the cost article)
- Euro reference rates — European Central Bank: ¥175.68 (30 October 2026)
All checked on 1 November 2026. Zuko and Baymard figures are mainly consumer data and may not map directly onto B2B enquiries. The hour estimates are DevNJ's own, and the legal overview is general. Before implementing, check the latest guidance and your own numbers.
FAQ
- Where should I start if I want a redesign to bring more enquiries?
- Start by measuring each stage separately: how many people move from a page to the form, start typing, complete the form, and become a sales conversation. Once you can see where people drop out, you can decide whether to change the button, cut fields or reply faster.
- How many fields should a contact form have?
- There is no universal number. Nielsen Norman Group advises limiting a contact form to 3–5 fields and asking only for what you need to reply. In practice, ask of each field whether you cannot reply without it, and whether it would improve the reply. The first is required, the second optional, and anything else is not asked.
- Does a contact form need a GDPR consent checkbox?
- Not necessarily, if the data is only used to reply. Steps taken at the person's request before a contract, or legitimate interests, may serve as the legal basis, and you choose one. You still have to provide the Article 13 information. Marketing emails need separate consent through an unticked box.
- Should the phone number be required?
- Unless you have an established call-back process, make it optional or leave it out. In a Baymard study, 14% of online shoppers said they would never give a store their phone number. If you do require it, say briefly next to the field what it is for.
- How much does it cost to improve the path and contact form?
- As an estimate, 52–142 hours from audit to the post-launch review. At Dutch hourly rates of €73–106 that is €3,796–15,052, or roughly ¥670k–2.64m. Limiting the work to your key pages and one form brings the cost towards the lower end of that range.
- Can a low-traffic site measure the effect?
- Yes. Completions alone will be too few, so watch the earlier, busier stages: moving to the form and starting it. Record how many enquiries become sales conversations, and run small usability tests to see where people hesitate. Without an A/B test, stage-by-stage comparison still gives you evidence.
Planning a site that has to work in both markets?
Get in touch