# Landing Page Design

> Landing page structure, conversion optimization, hero design, and landing page testing.

- Skill: `dragoon0x/landing-page-design` (Agent Skill)
- Install (CLI): `npx skillmds@latest add dragoon0x/landing-page-design`
- Raw SKILL.md: https://api.skillmd.com/api/skills/dragoon0x/landing-page-design/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: dragoon0x (https://skillmd.com/u/dragoon0x)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/dragoon0x/landing-page-design

---


# Landing Page Design

## Above the Fold
1. **Headline:** Clear value proposition (what you get, not what it is)
2. **Subheadline:** Supporting detail or social proof
3. **Visual:** Screenshot, demo, or relevant image
4. **CTA:** Single, clear action button
5. **Trust signal:** Logo bar, stat, or testimonial

## Section Flow
1. Hero (value prop + CTA)
2. Social proof (logos, numbers, testimonial)
3. Problem statement (what's broken today)
4. Solution (how you fix it, with visuals)
5. Features/benefits (3-4 key ones)
6. Testimonials/case studies
7. Pricing (if applicable)
8. FAQ
9. Final CTA (repeat the hero CTA)

## CTA Rules
- One primary CTA per page (repeated at key points)
- Specific: 'Start free trial' not 'Get started'
- Contrasting color from the rest of the page
- Above the fold AND at the bottom
- No competing secondary CTAs near the primary

## Testing Priorities
1. Headline (biggest impact)
2. CTA text and placement
3. Hero image/video
4. Social proof type and placement
5. Page length