homepage-generator

Original：🇺🇸 English

Translated

When the user wants to create, optimize, or audit homepage content and structure. Also use when the user mentions "homepage," "landing page," "main page," "home page," "hero section," "above the fold," "home page design," "landing page optimization," "homepage conversion," or "homepage structure."

2installs

Sourcekostja94/marketing-skills

Added on2026-03-07

NPX Install

npx skill4agent add kostja94/marketing-skills homepage-generator

SKILL.md Content

View Translation Comparison →

Pages: Homepage

Guides homepage content, structure, and conversion optimization.

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 product marketing context first: If

.claude/product-marketing-context.md

or

.cursor/product-marketing-context.md

exists, read it for product, audience, and value proposition. See branding for brand strategy, positioning, differentiation.

Identify:

Primary goal: Sign up, demo, purchase, learn more
Audience: Cold visitors, returning, specific segment
Traffic source: Organic, paid, referral

Homepage Structure

Section	Purpose
Hero	Value proposition, primary CTA, above the fold
Social proof	Logos, testimonials, metrics; "As Seen In" (press coverage) when applicable
Features/Benefits	What it does, why it matters
Use cases	Who it's for, how they use it
Objection handling	FAQ, guarantees, comparisons
Final CTA	Repeat primary action

Best Practices

Value Proposition

Clarity: Visitor understands in 5 seconds
Specificity: Concrete benefit, not vague
Differentiation: Why you, not alternatives — see branding for positioning framework
Customer language: Their words, not jargon
Avoid "not speaking human": Don't over-emphasize brand with vague definitions; communicate in user-friendly ways—if someone searches "AI presentation maker," the answer should be obvious from your headline

CTA

One clear primary action
Button copy: value-focused ("Start Free Trial") not generic ("Submit")
Visible without scrolling
Repeated at logical points

Visual & Aesthetics

Frontend aesthetics: For distinctive typography, motion, spatial composition, backgrounds—see brand-visual-generator Frontend Aesthetics

SEO

Unique title (50-60 chars) with primary keyword
Meta description (150-160 chars) with CTA
H1 = value proposition or primary headline
Logical H2-H6 structure

Output Format

Structure outline (sections)
Hero copy options (headline, subheadline, CTA)
Key sections content suggestions
SEO metadata (title, description, H1)
Conversion checklist

Related Skills

branding: Brand strategy, value prop, differentiation; homepage implements brand voice
brand-protection: "Official website" placement when impersonation risk exists
landing-page-generator: For single-goal campaign pages (affiliate signup, lead capture); homepage is multi-purpose
pricing-page-generator: Homepage often links to pricing
features-page-generator: Features section or link to features page
press-coverage-page-generator: "As Seen In" section (logo strip) when coverage exists; full page links from homepage
title-tag, meta-description, page-metadata, open-graph, twitter-cards: Homepage metadata and social previews
heading-structure: Homepage heading structure