Summary
This is a comprehensive template for building high-converting landing pages with React/Next.js. It covers the full stack: component structure from hero to final CTA, performance optimization with image loading and critical CSS, SEO with structured data and meta tags, and conversion tracking with GA4 events. The checklist approach makes it practical for auditing existing pages or building new ones. What stands out is the specificity of the code examples and the performance targets (LCP under 2.5s, total size under 1MB). You also get A/B testing priorities and mobile-specific patterns like sticky CTAs. Good for when you need to ship a landing page that actually converts instead of just looking pretty.
Install to Claude Code
npx -y skills add onewave-ai/claude-skills --skill landing-page-optimizer --agent claude-codeInstalls into .claude/skills of the current project.
Plug Mailtrap into your AI workflow and let it handle the email.
Connect Mailtrap MCP →
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
Make coding agent sessions - Searchable, Shareable, Vendor-neutral & Scored.
Try For Free →
Your agent targets a perfect 10 Code Health score. Deterministic. Every commit.
Try For Free →
Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Files
SKILL.mdView on GitHub
Landing Page Optimizer
Audit and optimize a landing page across conversion, performance, and SEO.
Contents
references/checklists.md— above-the-fold and quick-wins checklistsreferences/page-structure.md— optimal eight-section page layoutreferences/cta-optimization.md— CTA copy, friction reduction, placementreferences/performance.md— image/CSS optimization, Core Web Vitals targets, mobilereferences/seo-and-tracking.md— meta tags, structured data, GA4 tracking, A/B tests
Workflow
- Audit the current page for speed, UX, and conversion elements. Score the above-the-fold area against
references/checklists.md. - Validate the page layout against the eight-section template in
references/page-structure.md; flag missing or out-of-order sections. - Optimize CTAs using
references/cta-optimization.md— sharpen copy, reduce friction, and place CTAs at each high-intent point. - Optimize performance per
references/performance.md; meet the Core Web Vitals targets and apply mobile patterns. - Apply SEO and tracking from
references/seo-and-tracking.md— meta tags, structured data, and GA4 conversion events. - Run the quick-wins checklist in
references/checklists.mdand queue prioritized A/B tests.
Featured
Plug Mailtrap into your AI workflow and let it handle the email.
Connect Mailtrap MCP →Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →Make coding agent sessions - Searchable, Shareable, Vendor-neutral & Scored.
Try For Free →Your agent targets a perfect 10 Code Health score. Deterministic. Every commit.
Try For Free →Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
