cro-landing-page

name	cro-landing-page
description	Generates conversion-optimized landing pages using a 9-section framework. Produces mobile-first, fast-loading pages with strategic CTA placement and social proof.
version	2
author	Motion_Viz
tags	["cro","landing-page","conversion","web"]

CRO Landing Page Builder

Purpose

Build landing pages that convert visitors into leads/customers. INPUT: Product description, target audience, value proposition. OUTPUT: Complete landing page with 9 CRO-optimized sections.

When to Use This Skill

• When building a new landing page
• When redesigning an existing page for better conversions
• When a client says "I need a page that converts"

Rules (Non-Negotiable)

1. Mobile-first: Design for phone screens, then scale up
2. One primary CTA per viewport (no competing actions)
3. Social proof must appear before the fold ends
4. Page load target: under 2 seconds
5. Maximum 3 font weights across entire page
6. Every section must have a clear purpose (no filler)
7. CTA button text must be action-specific, not generic BAD: "Submit" "Click Here" "Learn More" GOOD: "Start Free Trial" "Get My Audit" "Book a Call"

Architecture (9-Section Framework)

Section 1: Hero

• Headline: 8 words max. States the transformation
• Subheadline: 1 sentence. Who it's for + outcome
• Primary CTA button
• Social proof snippet (logos, stats, or testimonial)
• Optional: Hero image/video (right side on desktop)

Section 2: Problem

• 3 pain points the audience experiences
• Use their language, not industry jargon
• Create tension before the solution

Section 3: Solution

• How your product/service solves the problems
• 3 benefits (not features)
• Each benefit: icon + headline + 1 sentence

Section 4: How It Works

• 3-step process (numbered)
• Each step: number + title + description
• Makes the path to value feel simple

Section 5: Social Proof

• Testimonials with name, role, company, photo
• Metrics/results if available
• Logos of recognizable clients

Section 6: Features (Detail)

• Deeper feature breakdown for informed buyers
• Feature cards with icons
• Comparison table if competitors exist

Section 7: Pricing / Offer

• Clear pricing tiers (if applicable)
• Highlight recommended tier
• What's included in each tier
• Money-back guarantee or risk reversal

Section 8: FAQ

• 5-7 questions. Address objections, not just info
• Accordion format (expandable)
• Last FAQ should address pricing/value

Section 9: Final CTA

• Restate the transformation
• Urgency or scarcity (if authentic)
• Same primary CTA as hero
• Secondary option (e.g., "Not ready? Join newsletter")

Checklist (AI Self-Verification)

• All 9 sections present and in correct order
• Mobile responsive (test at 375px width)
• Primary CTA visible in every viewport
• Social proof appears before the fold
• No generic CTA text used
• Page loads under 2 seconds (no unoptimized images)
• Meta title and description generated
• Open Graph tags included