Building Your Product Website with AI (Days 3-5)

Here is a counterintuitive move: you are going to build your product website before you build your product.

Most founders do the opposite. They spend weeks building the product, then throw up a basic landing page as an afterthought. This is backward for three reasons.

First, your website is your first product. It validates whether your messaging resonates before you invest a week building an MVP. If nobody engages with your website, your product's features do not matter.

Second, SEO and AI visibility need time to compound. Search engines and AI assistants can take weeks or months to discover and trust a new site. Every day you delay your website is a day of lost organic growth.

Third, the website forces you to clarify your thinking. Writing clear copy about your product's value proposition, pricing, and differentiation is hard. That difficulty is a signal. If you cannot explain your product clearly on a webpage, you are not ready to build it.

---

Choosing Your AI Coding Assistant

You will use AI to build your website. Two options are recommended, and they serve different purposes:

Claude Pro ($20/month, or $17/month billed annually):

• In my experience, strong at generating complete, working code from a detailed spec
• Good at following long specifications and keeping a codebase consistent
• Includes Claude Code, the terminal-based coding agent, for project-level work
• Best for: building the actual website structure and code

Google AI Pro, which includes Gemini's advanced models ($19.99/month in the US):

• Strong at research and competitive analysis
• Good at generating marketing copy and content
• Useful for brainstorming and exploring alternatives
• Best for: writing website copy, researching competitors, generating content

My recommendation: subscribe to both (about $40/month total). Use Gemini for research and copy, Claude for code generation and implementation. Plan names and prices change often, so check each vendor's pricing page before you subscribe. You will use both throughout the 60 days for different tasks.

---

The Spec-First Approach

Never start a coding session by saying "build me a website." That produces generic output. Instead, write a clear specification document first, then feed it to the AI.

Your website spec should include:

# Website Specification: [Your Product Name]

## Overview
[One paragraph describing the product and what 
the website should communicate]

## Target Audience
[Your buyer profile from Chapter 2]

## Brand
- Color palette: [primary, secondary, accent colors]
- Tone: [professional, playful, technical, friendly]
- Competitors' sites to reference (for positioning, 
  not copying): [URLs]

## Pages Required

### Homepage
- Hero: [headline, subheadline, primary CTA]
- Problem section: [what pain you solve]
- Solution section: [how you solve it]
- Features: [3-5 key features with descriptions]
- Social proof: [testimonials, logos, or stats]
- CTA section: [what you want visitors to do]
- Footer: [links, social, legal]

### Features / Product Page
- Detailed feature descriptions
- Screenshots or mockups (placeholder okay)
- Use cases

### Pricing Page
- [Tier 1]: $[X]/month: [features]
- [Tier 2]: $[X]/month: [features]
- [Tier 3]: $[X]/month: [features]
- FAQ section below pricing

### About Page
- Founder story
- Mission
- Why this product exists

### Blog
- Blog listing page
- Individual blog post template
- Categories/tags

### Contact
- Contact form
- Business email
- Social links

## Technical Requirements
- Framework: [Next.js / Astro / static HTML]
- Responsive (mobile-first)
- Fast loading (target < 2s)
- SEO-optimized (meta titles, descriptions, OG tags)
- Schema.org markup on all pages
- Dark/light mode (optional)

Feed this spec to Claude Code with the instruction:

Build this website based on the specification below. 
Use [Next.js / Astro / HTML+CSS+JS]. 
Make it production-ready, responsive, fast, 
and SEO-optimized. 
Include all pages described. Use clean, modern design.
Generate the complete project structure.

[paste your spec]

---

Framework Decision

Which web framework should you use? Here is a simple decision guide:

Static HTML/CSS/JS: Best if your site is simple (under 8 pages) and you want maximum control. No build tools, no frameworks, just files. AI assistants generate these well.

Astro: Best for content-heavy sites (blog + marketing pages). Fast by default, supports markdown for blog posts, and works perfectly with Cloudflare Pages. My recommended choice for most solo founders.

Next.js: Best if your product's marketing site and web app will live on the same domain. More complex to set up but gives you the most flexibility. Use if you plan to build your product as a web app.

For this playbook, Astro or static HTML are the best choices. They are fast, simple to deploy on Cloudflare Pages, and AI generates high-quality code for both.

---

Pages You Need on Day One

Homepage

Your homepage has one job: convince a visitor that your product solves their specific problem and get them to take the next step (sign up, start a trial, or join a waitlist).

Structure:

Hero Section
  Headline: [Clear statement of what you do]
  Subheadline: [Who it's for and what outcome they get]
  Primary CTA: [Start Free Trial / Get Started / Join]
  Visual: [Product screenshot, illustration, or demo gif]

Problem Section
  "The Problem" heading
  2-3 pain points your audience experiences
  Data or quotes that validate the pain

Solution Section  
  "How [Product] Solves This" heading
  3-5 key features with icons and descriptions
  Each feature connects to a specific pain point

Social Proof
  Customer testimonials (even 1-2 early users)
  Company logos (if applicable)
  Stats: users, uptime, satisfaction
  (Use placeholders if you don't have these yet)

CTA Section
  Recap of value proposition
  Primary CTA button
  "No credit card required" or similar trust signal

Footer
  Product links
  Company links (About, Blog, Contact)
  Legal links (Privacy, Terms)
  Social media icons

Prompt for AI-generating your homepage copy:

Write the homepage copy for [product name], 
a [one-sentence description].

Target buyer: [your buyer profile]

The homepage should follow this structure:
1. Hero: Clear headline (under 10 words), subheadline 
   (1-2 sentences), CTA
2. Problem section: 3 pain points the buyer experiences
3. Solution: How our product solves each pain point
4. Features: 4-5 features with short descriptions
5. Social proof placeholder
6. Final CTA

Tone: [professional / friendly / technical]
Avoid: buzzwords, vague claims, superlatives
Focus: specific outcomes and benefits, not features

Pricing Page

Yes, put pricing on your website before you have a product. This is intentional.

A pricing page with real numbers validates willingness to pay. If visitors look at your pricing and leave, your price-to-value ratio needs work. If they click "Start Free Trial" on a product that does not exist yet, you have just validated demand in the strongest way possible (redirect them to a waitlist form with a message that the product launches soon).

Pricing page elements:

• 2-3 tiers (most common: Starter, Professional, Enterprise or Business)
• Clear feature differentiation between tiers
• Annual pricing option (with a discount to encourage upfront payment)
• FAQ section below pricing (addresses common objections)
• Comparison to alternatives (optional but powerful)

Pricing strategy for solo founders:

• Starter: $49/month (limited features, attracts small teams)
• Professional: $99-149/month (full features, your bread-and-butter tier)
• Business: $249+/month or "Contact Us" (enterprise features, higher touch)
• Offer annual plans at 20% discount (improves cash flow)

Content Pages (Critical for SEO and AI Visibility)

These pages are not optional. They are the foundation of your organic growth strategy and what will get your brand cited by AI search engines.

1. White paper or in-depth guide (1 piece):

Write one substantial piece of content (2,000-3,000 words) that covers the problem your product solves in depth. This is not a product pitch. It is an educational resource that establishes your expertise.

Example: If your product helps B2B companies track AI citations, your white paper might be "The State of AI-Powered Vendor Research: How Enterprise Buyers Use ChatGPT to Evaluate Software in 2026."

Prompt for AI:

Write a 2,500-word white paper on [topic].

Target audience: [buyer profile]
Tone: authoritative, data-driven, practical
Structure: 
- Executive summary (150 words)
- Problem overview with data
- Current landscape analysis
- 3-5 key findings or insights
- Practical recommendations
- Conclusion with forward-looking perspective

Include: specific data points and industry statistics 
with a source link for each (I will verify every one), 
and actionable takeaways.

Do not include: product pitches, vague claims, 
filler content.

2. Alternative and comparison pages (2-3 pieces):

These are the highest-ROI content pages for early-stage companies. People searching for "[competitor] alternative" or "[competitor A] vs [competitor B]" are actively looking for solutions.

Create pages like:

• "Top 5 Alternatives to [Biggest Competitor]"
• "[Your Product] vs [Competitor], Honest Comparison"
• "[Competitor A] vs [Competitor B] vs [Your Product]"

Be honest in these comparisons. Acknowledge competitor strengths. Highlight where you are different (not necessarily "better"). In my experience, readers trust honest assessments far more than biased promotion.

3. Long-form blog articles (2-3 pieces):

Write articles focused on the pain points and questions your target audience has. These should be:

• 1,500-2,500 words each
• Focused on a specific problem or question
• Optimized for search (target a primary keyword)
• Including FAQ sections at the bottom
• Linking to your product pages naturally

---

SEO, GEO, and AEO From Day One

Your website needs to be optimized for three types of search from the start:

Traditional SEO (Google)

On every page:

• Unique meta title (under 60 characters)
• Unique meta description (under 160 characters)
• One H1 tag per page
• Logical heading hierarchy (H1 then H2 then H3)
• Image alt tags
• Internal links between your pages
• Clean URLs (yourdomain.com/features, not yourdomain.com/page?id=123)

Site-wide:

• XML sitemap (auto-generated with most frameworks)
• robots.txt file
• SSL certificate (Cloudflare provides this free)
• Mobile-responsive design
• Fast page load speed (under 3 seconds, ideally under 2)

GEO (Generative Engine Optimization)

GEO optimizes your content to be cited by AI search engines like ChatGPT, Perplexity, and Google AI Overviews. It matters because more B2B buyers now use these tools to research vendors.

Key GEO tactics for your website:

Create an llms.txt file. llms.txt is a proposed convention from Jeremy Howard: a Markdown file at yourdomain.com/llms.txt that summarizes your site and links its key pages for AI agents. No major AI search engine has said it relies on the file, but it costs ten minutes. The format is an H1 title, a one-line blockquote summary, then H2 sections of links:

# [Your Product Name]

> [One sentence describing what your product does and for whom]

[Optional short paragraph: who runs the company, how to contact you]

## Key Pages
- [Homepage]([URL]): what the product does
- [Features]([URL]): feature details
- [Pricing]([URL]): plans and prices
- [Blog]([URL]): guides and comparisons
- [Documentation]([URL]): when available

Schema.org markup on every page. Use Organization, Product, Article, and FAQPage schema types. Structured data makes your pages easier for machines to parse.

Entity optimization. Mention your product name, founder name, and company consistently across pages. AI engines build entity graphs from this information.

Authoritative content. Back claims with data, link to sources, and demonstrate expertise. Pages with clear, sourced facts are easier for AI engines to quote.

AEO (Answer Engine Optimization)

AEO ensures your content appears when people ask AI assistants questions about your problem space.

Key AEO tactics:

• Add a FAQ section to every content page (5-10 questions)
• Structure FAQs with FAQPage schema markup (Google stopped showing FAQ rich results for all sites on May 7, 2026; the markup is still valid schema, so add it for clarity and machine readability, not for a Google search feature)
• Write questions in the way your buyers would ask them
• Provide concise, direct answers (2-4 sentences) followed by deeper context

<!-- FAQPage Schema Example -->
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What is [your product category]?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "A concise, direct answer..."
      }
    }
  ]
}
</script>

---

Building with AI: The Practical Workflow

Here is the actual workflow I recommend for building your website in 2 days:

Day 1 Morning (3-4 hours): Copy and Content

1. Write your website spec (from the template above)
2. Use Gemini to generate homepage copy, feature descriptions, and pricing page copy
3. Use Claude to refine, tighten, and improve the copy
4. Write or generate your first white paper
5. Draft 2-3 comparison page outlines

Day 1 Afternoon (3-4 hours): Design and Build

1. Feed your complete spec to Claude Code
2. Review the generated code structure
3. Iterate on design and layout
4. Make sure all pages are responsive (check mobile view)
5. Add all SEO elements (meta tags, schema, sitemap)

Day 2 Morning (3-4 hours): Content and Polish

1. Generate or finalize comparison pages
2. Write 2-3 blog articles using AI (review and edit each one)
3. Add FAQ sections to all content pages
4. Create the llms.txt file
5. Add all internal links between pages

Day 2 Afternoon (2-3 hours): Review and Deploy

1. Test every page on mobile
2. Run through a basic SEO checklist
3. Check all links work
4. Validate schema markup with the Schema Markup Validator or Google's Rich Results Test
5. Deploy (covered in Chapter 5)

---

End of Day 5 Checkpoint

• Complete website with 8-10 pages live
• Homepage with clear value proposition and pricing
• 1 white paper or in-depth guide on your problem space
• 2-3 competitor comparison or "alternative to" pages
• 2-3 blog articles
• FAQ sections on all content pages with Schema markup
• llms.txt file
• XML sitemap and robots.txt
• Mobile-responsive design
• SSL active (via Cloudflare)

Total additional spend: about $40 (Claude Pro + Google AI Pro for the month)

Your website now looks like a real company's website. And it is already starting to build search value that compounds over the next 55 days.