MethodTechnology & DevelopmentApp & web developmentStarter

Build a website or landing page with AI

A site plan, copy, section structure and the exact code-generation prompts to build and deploy it.

This is a practical, copy-paste process for you need a site or landing page quickly.. Use it when you want a clear structure, then add your own details and the linked evidence.

Published by Deepstory Research. Reviewed Sep 2026.

How to use this method

1. Copy or downloadCopy the prompt below, or download the method file and attach it to your chat.
2. Paste into any AIChatGPT, Claude, Gemini or Copilot. Replace each [PLACEHOLDER] with your details, or let the AI ask you.
3. Add evidenceAttach the evidence files listed on this page so the AI works from sourced numbers, not guesses.

The prompt

Paste it as-is. The AI will ask for anything still in [BRACKETS].

Download .md

# Build a website or landing page with AI
Method by Deepstory Research: deepstoryresearch.com/method/website-build-landing-page

You are a full-stack web developer and conversion copywriter. Follow the method below step by step. Goal: A site plan, copy, section structure and the exact code-generation prompts to build and deploy it.

## My inputs
- Business and goal: [BUSINESS_AND_GOAL]  (example: interior design studio, get consultation bookings)
- Audience: [AUDIENCE]  (example: homeowners in Dubai)
- Pages: [PAGES]  (example: home, services, portfolio, contact)
- Stack preference: [STACK_PREFERENCE]  (example: HTML/Tailwind, Next.js, Webflow, WordPress)
- Brand assets: [BRAND_ASSETS]  (example: logo, colours, fonts)

Before you start: if any input above is still in [BRACKETS] or missing, ask me for it in one short numbered list and wait. Do not guess. If I attached files (data, briefs, Deepstory evidence files), treat them as the primary source.

## Steps to follow
1. Define sitemap and the goal of each page.
2. Write section-by-section structure for the key page.
3. Write copy for hero, benefits, proof, FAQ and CTA.
4. Specify design direction (layout, type, colour, imagery).
5. Generate the build prompt(s) for an AI coding tool, including accessibility and SEO basics.
6. List deployment, domain, analytics and form-handling steps.

## Deliver the output in this structure
- Sitemap
- Page structure
- Copy
- Design direction
- Build prompt
- Launch checklist

## Quality rules
- Mobile-first, semantic HTML, alt text, contrast ≥ 4.5:1.
- No stock claims like "award-winning" unless true.
- Label every number as FACT (with source and date), ESTIMATE (show the calculation) or ASSUMPTION.
- If a Deepstory evidence file is attached, use its figures as the reference values and cite its source references; tag claims that are not from it as [UNVERIFIED].
- End with: the 3 assumptions that matter most, what would change the answer, and the single best next step.

What you need to give the AI

Input	Placeholder	Example
Business and goal	[BUSINESS_AND_GOAL]	interior design studio, get consultation bookings
Audience	[AUDIENCE]	homeowners in Dubai
Pages	[PAGES]	home, services, portfolio, contact
Stack preference	[STACK_PREFERENCE]	HTML/Tailwind, Next.js, Webflow, WordPress
Brand assets	[BRAND_ASSETS]	logo, colours, fonts

Use it when

You need a site or landing page quickly.
Using an AI builder or coding assistant.

Best with: AI coding tools or site builders that accept a prompt.

What you get

Sitemap
Page structure
Copy
Design direction
Build prompt
Launch checklist

The procedure, step by step

Read this before you run it, so you can check the AI actually followed the method.

1
Define sitemap and the goal of each page.
2
Write section-by-section structure for the key page.
3
Write copy for hero, benefits, proof, FAQ and CTA.
4
Specify design direction (layout, type, colour, imagery).
5
Generate the build prompt(s) for an AI coding tool, including accessibility and SEO basics.
6
List deployment, domain, analytics and form-handling steps.

Quality checks built into the prompt

• Mobile-first, semantic HTML, alt text, contrast ≥ 4.5:1.
• No stock claims like "award-winning" unless true.
• Every number labelled FACT, ESTIMATE or ASSUMPTION; claims outside attached evidence tagged [UNVERIFIED].

Evidence to use with this method

Methods tell the AI how to think. Evidence gives it sourced numbers to think with. Download a context file and attach it with the prompt.

EvidenceRetail

E-Commerce Share of US Retail

Online sales as a share of total US retail, and the growth gap that keeps pushing that share up.

Open evidence Download context file

Run next

Methods that chain well after this one.

Design & CreativeDesign a web page (wireframe to UI)A section-by-section web design: wireframe, visual system, components and responsive behaviour.MarketingWrite an SEO content briefA writer-ready brief: search intent, outline, entities, questions to answer, internal links and on-page specs.MarketingCreate a marketing tracking plan (GA4 & events)An event tracking plan with naming, parameters, conversions, UTMs and a dashboard spec.Technology & DevelopmentPlan and build a mobile app with AIA build plan from idea to store release: scope, screens, stack, data model, milestones and AI-assisted build prompts.

Deepstory methods are process guidance for AI tools. Review AI output before relying on it; legal, tax, medical and investment decisions need a qualified professional.