Form CRO
Production-grade form optimization framework covering field-cost analysis, layout engineering, multi-step form architecture, validation UX patterns, mobile-specific optimization, and structured A/B test design. Applicable to lead capture, contact, demo request, application, survey, and checkout forms. For signup/registration flows, use signup-flow-cro.
Table of Contents
- Initial Assessment
- Field-Cost Analysis Framework
- Multi-Step vs Single-Step Decision
- Field Design Patterns
- Validation UX
- CTA and Submit Button Optimization
- Mobile Form Optimization
- Trust and Context Elements
- Form Type Playbooks
- A/B Test Framework
- Metrics and Measurement
- Output Artifacts
- Related Skills
Initial Assessment
Required Context
| Question | Why It Matters |
|---|---|
| What type of form? (lead capture, contact, demo, application, checkout) | Different types have different optimal field counts |
| How many fields currently? | Establishes baseline friction level |
| What is the current completion rate? | Benchmark for improvement |
| Where do users abandon? (if field-level analytics exist) | Identifies the specific friction point |
| Mobile vs desktop split? | Mobile forms need separate optimization |
| What happens with submitted data? | Determines which fields are truly necessary |
| Which fields are actually used in follow-up? | Often reveals 30-50% of fields are never used |
| Any compliance requirements? (GDPR, HIPAA) | Constrains what can be removed |
Field-Cost Analysis Framework
Every field has a cost measured in abandonment. The question is not "what data would be nice to have" but "what data is worth the conversion loss."
Field Cost Matrix
| Field Type | Estimated Abandonment Cost | Justification Threshold |
|---|---|---|
| Baseline (near zero for gated content) | Always justified for lead forms | |
| First name | +2-3% drop | Justified if personalization drives follow-up |
| Last name | +2-3% drop | Rarely justified for first touch |
| Phone number | +5-10% drop | Only if sales will call within 24 hours |
| Company name | +3-5% drop | Justified for B2B qualification |
| Company size | +3-5% drop | Justified only if routing decisions depend on it |
| Job title | +3-5% drop | Can often be enriched post-submission |
| Industry | +2-3% drop | Can often be enriched post-submission |
| Message/textarea | +5-8% drop | Justified for contact forms, not for lead capture |
| Budget | +8-12% drop | Only justified for high-intent demo/sales forms |
| Custom question | +3-5% per question | Must directly affect lead routing or qualification |
The Enrichment Test
Before including any field, ask: Can this be enriched after submission?
| Field | Enrichable? | Method | Keep in Form? |
|---|---|---|---|
| Company name | Yes (from email domain) | Clearbit, Apollo, manual lookup | Remove |
| Company size | Yes (from company name) | Enrichment API | Remove |
| Industry | Yes (from company name) | Enrichment API | Remove |
| Job title | Partially (from LinkedIn) | Manual enrichment | Remove unless critical for routing |
| Phone number | No | Must be provided | Keep only if sales calls immediately |
| Budget | No | Must be stated | Keep only for high-intent forms |
Recommended Field Sets by Form Type
| Form Type | Minimum Fields | Optimal Fields | Maximum Fields |
|---|---|---|---|
| Newsletter signup | Email + First name | ||
| Content download | Email + First name | Email + Name + Company | |
| Contact form | Email + Message | Email + Name + Message | Email + Name + Subject + Message |
| Demo request | Email + Company | Email + Name + Company + Role | + Phone + Use case + Team size |
| Application form | Varies by requirement | -- | All required fields (justified individually) |
Multi-Step vs Single-Step Decision
Decision Criteria
| Factor | Single-Step | Multi-Step |
|---|---|---|
| Total fields | < 5 fields | > 5 fields |
| Field complexity | Simple text inputs | Mix of dropdowns, checkboxes, conditional fields |
| User motivation | Low-commitment (newsletter, content) | High-commitment (demo, application) |
| Qualification need | No routing needed | Different paths based on answers |
| Mobile proportion | < 30% mobile | > 50% mobile |
Multi-Step Best Practices
Step structure:
- Step 1: Easiest fields (email, name) -- lowest friction to start
- Step 2: Qualifying information (company, role, use case)
- Step 3: Specific details (budget, timeline, message)
Progress indication:
- Show progress bar with step count ("Step 2 of 3")
- Show completion percentage
- Label each step with what it covers ("Your Details", "Company Info", "Project Details")
Psychological commitment:
- Once a user completes Step 1, they are 40-60% more likely to complete the form (sunk cost effect)
- Capture the email in Step 1 so you can follow up even if they abandon later
Back navigation:
- Always allow users to go back to previous steps
- Preserve entered data when navigating between steps
- Never reset the form on back navigation
Field Design Patterns
Field Labels
| Pattern | When to Use | Example |
|---|---|---|
| Above-field labels | Default for most forms | Label sits above the input |
| Inline labels (floating) | Space-constrained layouts | Label moves from inside to above on focus |
| Left-aligned labels | Wide desktop forms | Label to the left of field |
| Placeholder-only labels | Never | Disappears on input, accessibility failure |
Field Types
| Data Needed | Best Input Type | Avoid |
|---|---|---|
type="email" with validation | Plain text input | |
| Phone | type="tel" with format mask | Plain text input |
| Country | Searchable dropdown | Long static dropdown |
| Company size | Button group (1-10, 11-50, 51-200, 200+) | Free text input |
| Interest/topic | Checkbox group (max 6 options) | Multi-select dropdown |
| Message | Textarea (3-4 rows visible) | Single-line text input |
| Date | Native date picker | Three separate dropdowns |
Conditional Fields
Show additional fields based on earlier answers. This reduces visible complexity while capturing necessary data.
Example: "What is your primary goal?" dropdown shows "Budget range" only if they select "Ready to buy" or "Evaluating solutions."
Rules:
- Conditional fields appear with smooth animation (not instant jump)
- Only 1-2 conditional fields per trigger
- Conditional fields are never required (the trigger answer may change)
Validation UX
Real-Time vs Submit-Time Validation
| Validation Type | When to Use |
|---|---|
| Real-time (on blur) | Email format, phone format, required fields |
| On submit | Complex validation, server-side checks |
| Inline suggestions | Company name auto-complete, address lookup |
Error Message Design
| Pattern | Good | Bad |
|---|---|---|
| Position | Below the field, in context | Top of form, disconnected |
| Tone | "Please enter a valid email address" | "Error: Invalid input" |
| Specificity | "Phone must include area code" | "Invalid phone number" |
| Color | Red text + red border on field | Red banner at top of page |
| Icon | Error icon next to message | No visual indicator |
Success Indicators
- Green checkmark on valid fields (especially email and phone)
- Positive microcopy: "Looks good!" o