5 C re at ive Ways to Use C on tac t F o rm s in WordPre ss
@ S I T E L O C K
A Stranger Walks Into a Bar
@ S I T E L O C K
A Stranger Walks Into a Bar
@ S I T E L O C K
What We’ll Cover Today• A brief h i s tory of forms• Factors to cons ider when planning your forms• Form strategies• Types of forms• Examples of creative forms• Form tool s
@ S I T E L O C K
Adam W. Warner• Product Evangel i s t at S i teLock•Co-Founder at FooPlugins•Discovered WordPress in 2005•WordPress community addict• Fan of f racta ls• Lover of meatbal l s• Proud Dad!
@ S I T E L O C K
A Brief History of Web Forms
@ S I T E L O C K
Thanks Dave!
@ S I T E L O C K
Factors to Consider When Building Forms
@ S I T E L O C K
Whatever you do. Don’t do this.
@ S I T E L O C K
Size and Steps
@ S I T E L O C K
Fields and Labels
@ S I T E L O C K
Appropriate Field Types
@ S I T E L O C K
Number of Fields• I s there a magic number?
@ S I T E L O C K
Order of Fields• Does i t matter?
@ S I T E L O C K
Benefits
@ S I T E L O C K
Trust and Confidence
@ S I T E L O C K
Call to Action
@ S I T E L O C K
Measure, Analyze and Test
@ S I T E L O C K
Case Study• Number of f ie lds• F ield order• F ield label s
@ S I T E L O C K
Busting the Best Practice
@ S I T E L O C K
Fewer Fields
@ S I T E L O C K
Labels and Field Order
@ S I T E L O C K
Takeaway• Reducing form f ields wi l l a lways increase
convers ions = FALSE
@ S I T E L O C K
Getting Long Forms to Convert
@ S I T E L O C K
Progress Bars
@ S I T E L O C K
Onboarding Flow
@ S I T E L O C K
Ask Higher Value Questions• Do I al ready have thi s information f rom thi s
v i s i tor?• Can I get th i s information f rom another source
(e.g. IP address)?• Wi l l th i s information bring me closer to a sale?
@ S I T E L O C K
Required vs. Optional (test)• What happens when you remove al l of the
requi red asteri sks ; imply ing everything i s requi red?• What happens when you make a f ie ld you
cons ider requi red, optional?• What happens when you make a f ie ld you
cons ider optional , requi red?
@ S I T E L O C K
Accessibility of Forms• WCAG 2.0 (Web Content Access ibi l i ty
Types of Forms• S implest• S imple• Versati le• Interactive
@ S I T E L O C K
A Specific Purpose• Search• Blog post emai l subscription• Lead generation (emai l opt- ins)• Guest post submiss ions• eCommerce order and checkout• Surveys• Quizzes• Recommendation Engines
@ S I T E L O C K
Integrations Galore!• Account ing• Analyt ics• Calendar• CRM• Documents• Emai l• Help Desk• Payments• Soc ia l• Web apps
@ S I T E L O C K
Real World Examples
@ S I T E L O C K
1. Email List Building
@ S I T E L O C K
Money Lab
@ S I T E L O C K
2. Calculators
@ S I T E L O C K
Docbraces
@ S I T E L O C K
3. User Generated Content (Guest Blog Post Submissions)
@ S I T E L O C K
User Showcase Blog Submission
@ S I T E L O C K
4. Guided Paths
@ S I T E L O C K
NC State University
@ S I T E L O C K
Recommendation Engine
@ S I T E L O C K
5. eCommerce• Order forms• Checkout forms• Upsel l s• Emai l l i s t option
@ S I T E L O C K
Complex eCommerce
@ S I T E L O C K
6. Bonus Examples!• Patient Intake Forms• F reelancer/Cl ient Forms• MadLibs Sty le
@ S I T E L O C K
Endless Possibilities
@ S I T E L O C K
How To Build Forms• Custom code• Onl ine bui lders• Form plugins (my preference)