Web Design

SEO Landing Page - Full Page HTML/CSS

Name: SEO Landing Page - Full Page HTML/CSS
Author: Claude Directory

Claude Directory December 9, 2025

0 copies 0 likes

Generates a complete, SEO-optimized, mobile-responsive HTML/CSS landing page ready to copy-paste and deploy. Boosts conversions with proven structure, schema markup, and keyword integration. (142 char

Prompt

You are a top-tier web developer, SEO expert, and conversion optimization specialist with 10+ years of experience building high-performing landing pages for startups and e-commerce sites.

TASK: Create a COMPLETE, production-ready, MOBILE-RESPONSIVE LANDING PAGE in clean HTML5 + CSS (NO JS or frameworks needed) that's fully SEO-optimized for the keyword "[MAIN KEYWORD]".

Include these exact sections in order:

1. **HERO SECTION**: Compelling H1 headline (includes keyword), persuasive subheadline, primary CTA button, hero image (use Unsplash URL with alt text).
2. **PROBLEM SECTION**: Empathize with visitor pain points (3-4 bullet points).
3. **SOLUTION SECTION**: Introduce your offer as the perfect fix (headline + description).
4. **FEATURES GRID**: 4-6 key features in a responsive 2-column grid (icon suggestion + benefit-focused text).
5. **SOCIAL PROOF**: 3 testimonials with photos (use free stock), star ratings, names.
6. **PRICING**: 3 tiers (Free/Basic/Pro), highlight best value.
7. **FAQ**: 4 common questions with schema markup.
8. **FINAL CTA**: Urgent close with secondary offer.
9. **FOOTER**: Links, copyright, social icons.

SEO REQUIREMENTS:
- Title tag, meta description, Open Graph tags with keyword.
- H1-H3 hierarchy with keyword variations.
- Schema.org JSON-LD for landing page.
- Alt texts, fast-loading best practices.
- Semantic HTML, ARIA labels.

Make it:
- Ultra-modern, minimalist design (white space heavy).
- Google PageSpeed 95+ friendly (inline CSS, optimized images).
- Conversion-focused (above fold CTA, scarcity).

Copy-paste ready! Output ONLY the full <html> code.

Main Keyword: [YOUR KEYWORD]
Your Product/Service: [BRIEF DESCRIPTION]
Target Audience: [WHO IT'S FOR]
Unique Selling Point: [YOUR USP]

How to Use

1. Copy the full prompt text from the 'content' field above. 2. Replace placeholders: [YOUR KEYWORD] with your target keyword, [BRIEF DESCRIPTION] with your product details, [WHO IT'S FOR] with audience, [YOUR USP] with unique value. 3. Paste into Claude (or any AI like GPT/Claude) and hit generate. 4. Copy the output HTML code and paste into an HTML file (e.g., index.html). 5. Open in browser to preview; customize images/colors as needed. 6. Host on Netlify/Vercel or your server; add analytics/tracking. 7. Submit to Google Search Console for indexing.

Comments

More Prompts

View all

Research

ChatGPT Web Browsing Research Agent

Structured web research using ChatGPT's browsing capability. Systematic source evaluation, fact-checking, and synthesis with proper citations.

Community

Development

ChatGPT API Integration Blueprint

Design production-ready ChatGPT API integrations. Covers authentication, streaming, function calling, structured outputs, and cost optimization with the latest OpenAI SDK.

Community

Data Analysis

Advanced Data Analysis with Code Interpreter

Step-by-step data analysis pipeline using ChatGPT's Code Interpreter. Upload CSV/Excel files for cleaning, visualization, statistical analysis, and insights.

Community

Productivity

ChatGPT Memory & Personalization Optimizer

Optimize ChatGPT's memory feature for persistent context. Teaches how to structure memories, manage what's stored, and leverage personalization effectively.

Community

Creative

DALL-E 3 Prompt Engineering Master

Generate precise, creative DALL-E 3 prompts. Handles style specifications, aspect ratios, composition rules, and iterative refinement for stunning AI-generated images.

Community

Productivity

ChatGPT Canvas Collaborative Editor

Leverage ChatGPT Canvas mode for iterative document editing, code review, and collaborative writing with inline suggestions and tracked changes.

Community