contact-page-generator

# Pages: Contact Guides contact page design and form optimization for conversions. **When invoking**: On **first use**, if helpful, open with 1-2 sentences on what this skill covers and why it matters, then provide the main output. On **subsequent use** or when the user asks to skip, go directly to the main output. ## Initial Assessment **Check for project context first:** If `.claude/project-context.md` or `.cursor/project-context.md` exists, read it for brand voice. Identify: 1. **Contact types**: Sales, support, general, press 2. **Form purpose**: Lead capture, support ticket, demo request 3. **Alternative channels**: Email, phone, chat, social ## Best Practices ### Form Design | Principle | Guideline | |-----------|-----------| | **Short** | 3-5 fields for basic contact; long forms increase abandonment | | **Single column** | Vertical layout; works better on mobile | | **Logical grouping** | Name+email together; address fields together | | **Required fields** | Mark clearly (asterisk); avoid surprises | | **Progressive disclosure** | Show relevant fields based on selections | ### Field Labels - **Clear language**: "Email Address" not "Email ID" - **Conversational**: Friendly, welcoming - **No jargon**: Universally understood terms ### CTA Button - **Action verbs**: "Send Message," "Get in Touch," "Start a Conversation" - **Avoid generic**: "Submit" ? "Send Message" - **Stand out**: Contrasting color, clear hierarchy ### Page-Level | Element | Guideline | |---------|-----------| | **Visibility** | "Contact" or "Support" in main nav, not just footer | | **Mobile** | Appropriate input types (tel for phone), large tap targets | | **Proofreading** | No typos--credibility at conversion moment | | **Alternatives** | Email, phone, chat if form isn't right | ### Trust - **Response time**: "We reply within 24 hours" - **Privacy**: Link to privacy policy near form - **Security**: HTTPS, visible trust signals ## Output Format - **Form** structure (fields, order) - **Copy** (labels, placeholder, CTA) - **Page** layout and placement - **SEO** metadata - **Accessibility** checklist ## Related Skills - **landing-page-generator**: Lead capture LP contains contact form; demo request CTA destination - **about-page-generator**: Contact often linked from About - **legal-page-generator**: Privacy policy link near form - **title-tag, meta-description, page-metadata**: Contact page metadata