Contact Page UX — Form vs. Email Hierarchy
Overview
When designing contact pages, the visual hierarchy should reflect the client's preferred conversion action. A raw email address and a contact form serve different tracking and workflow needs — and the order in which they appear on the page directly influences which one visitors use. This principle was surfaced during an SEO progress review with [1] / [2], where both sites had contact pages that buried the form below a direct email link.
The Core Principle
Lead with the conversion action you want to track and receive. Contact forms are preferable to raw email links for several reasons:
- Form submissions are trackable as discrete conversion events in Google Analytics and Google Tag Manager
- Raw email links (
mailto:) require a click-to-email button to be trackable at all - Forms create a structured intake record; direct emails do not
- Forms reduce friction for visitors who don't have a mail client configured
The hierarchy should be: primary CTA → form → secondary contact method (email or phone).
Per-Client Recommendations
A New Dawn Therapy — Form First
Goal: Form fill as primary conversion; direct email as fallback.
- Contact page should lead with the form, prominently above the fold
- Direct email address (or a click-to-email button) placed below the form as a secondary option
- A click-to-call button in the site header or navigation bar for visitors who prefer phone
Rationale: The existing contact page directed visitors immediately to the email address, with the form below it and out of view. Since the form submission routes to the same inbox anyway, prioritizing the form captures a trackable event without removing the email option.
Shine Marketing — Call First, Form Second
Goal: Phone call as primary conversion; form fill as secondary.
- Click-to-call button given prominent placement (header or hero section)
- Contact form present but visually secondary — below the call CTA
- Direct email de-emphasized or removed from primary contact page layout
Rationale: Katie expressed a preference for receiving calls for Shine. The call button must be a true tel: link (not plain text) to be trackable as a conversion event in Google Analytics and Google Ads.
Conversion Tracking Dependency
This hierarchy decision is directly tied to [3]. Only clickable elements — buttons with tel: or mailto: links, and form submissions — can be tracked as events. Plain-text phone numbers and email addresses are invisible to analytics.
Tracked events being configured for both sites:
| Event | A New Dawn | Shine |
|---|---|---|
| Homepage view | ✓ | ✓ |
| Contact form submission | ✓ | ✓ |
| Click-to-call | ✓ (to add) | ✓ |
| Click-to-email | ✓ (to add) | — |
Implementation Notes
- Both sites run WordPress with WPForms (or equivalent); form placement is adjustable via page builder
- Shine's contact form was confirmed broken at time of this meeting — form submissions were not reaching the inbox. This is a high-priority bug to resolve before any conversion tracking on form fills is meaningful. See [4].
- A New Dawn's form was confirmed working correctly
Related
- [1]
- [2]
- [5]
- [6]