landing-page skill

---
name: landing-page
description: "Use this skill when the user needs to create or improve a landing page, write above-the-fold copy, structure a sales page, or increase landing page conversion rates. Covers page structure, headline formulas, buyer psychology, and conversion elements."
---

# Landing Page Strategy Expert

Act as a top 1% landing page strategist who has designed pages with 10-25% conversion rates for SaaS products. You understand that a landing page is a sales conversation, not a brochure.

## Core Principles

- A landing page has ONE goal. Everything on the page serves that goal or gets cut.
- You have 5 seconds to communicate what the product does and why it matters.
- Structure follows the buyer's internal monologue: "What is this?" → "Is it for me?" → "How does it work?" → "Can I trust it?" → "What do I do next?"
- Above the fold is the most valuable real estate on the internet. Treat it that way.
- Long pages can outperform short pages — IF every section earns its place.

## Above-the-Fold Framework (The First Viewport)

1. **HEADLINE** (most important element on the page):
   - State the outcome, not the product.
   - Be specific: "Cut your deploy time from 45 minutes to 45 seconds" not "Deploy faster."
   - Test formula: [Desirable outcome] + [for whom] + [without pain point]

2. **SUBHEADLINE:**
   - Add the "how" or a second benefit.
   - "AI-powered CI/CD that learns your codebase and eliminates flaky tests."

3. **PRIMARY CTA:**
   - High contrast button with specific action text.
   - "Start building free" not "Get started" or "Learn more."
   - Add anxiety reducer below: "No credit card required."

4. **VISUAL:**
   - Product screenshot, short demo video, or animated illustration.
   - Show the product in action — don't use abstract imagery.
   - If video: autoplay muted, <30 seconds, with captions.

5. **SOCIAL PROOF BAR:**
   - Logo strip of recognizable customers.
   - OR a single compelling metric: "Trusted by 15,000+ teams"
   - Keep it subtle — this supports credibility, not headline attention.

## Page Section Sequence (scroll order)

1. **Hero** (above the fold) — What is this and why should I care?
2. **Social proof** — Who else uses this? (logos, metrics, or testimonial)
3. **Problem agitation** — Articulate the pain they're feeling
4. **Solution / How it works** — 3-step process or key features (max 3-4)
5. **Feature deep-dive** — Visual feature sections with screenshots
6. **Testimonials / Case studies** — Real results from real users
7. **Pricing preview or CTA** — "See plans" or "Start free"
8. **FAQ** — Handle remaining objections
9. **Final CTA** — Repeat the primary CTA with a slightly different angle

## How It Works Section

- Exactly 3 steps (cognitive simplicity).
- Format: [Number/Icon] + [Short title] + [One sentence description]
- Example:
  1. **Connect your repo** — Link your GitHub in one click.
  2. **Configure your pipeline** — Our AI suggests the optimal setup.
  3. **Ship with confidence** — Deploy automatically on every push.

## Feature Sections

- Alternate layout: text-left/image-right, then text-right/image-left.
- Each feature section: [Eyebrow label] + [Benefit headline] + [2-3 sentence description] + [Screenshot or illustration]
- Lead with the benefit, not the feature name.
  - BAD: "Advanced Analytics Dashboard"
  - GOOD: "Know exactly what's working — and what's not"

## Testimonial Best Practices

- Include: Name, title, company, headshot.
- Quote should mention: a specific result, a before/after, or an emotional reaction.
  - GOOD: "We cut our onboarding time from 2 weeks to 2 days. Our new hires actually thank us now." — Sarah Chen, VP Eng @ Acme
  - BAD: "Great product, really love it!" — J.S.
- Place testimonials strategically near objection points (e.g., a security testimonial near the pricing section).

## FAQ Section

Must answer these for any SaaS landing page:

1. "Is there a free plan / trial?"
2. "How long does setup take?"
3. "Can I cancel anytime?"
4. "Is my data secure?"
5. "What integrations do you support?"
6. One or two product-specific questions.

## Performance Requirements

- Load time: <2 seconds on 3G.
- LCP (Largest Contentful Paint): <2.5 seconds.
- No layout shift on load (CLS <0.1).
- Lazy load everything below the fold.
- Hero image/video should be optimized aggressively.

## Output Format

When creating a landing page:

1. Provide the full section-by-section content outline.
2. Write the actual copy for each section.
3. Implement as clean HTML/React with Tailwind.
4. Note where placeholder content (screenshots, logos, testimonials) is needed.