Prompt for Website Creation: 7 Prompts You Can Copy

A good prompt for website creation does three things a weak one skips: it tells the AI who the site is for, what each page must make the visitor do, and what the output format is (one HTML file, or a project in an AI builder). "Make me a website for my bakery" gives none of that, so the model fills gaps with stock phrases.

Below are seven prompts you can copy, in the order you'd use them:

1. A planning prompt that produces a sitemap and a copy brief
2. A single-file HTML and CSS prompt for ChatGPT or Claude, plus how to preview the result
3. A brief and a follow-up prompt for AI site builders like v0, Bolt, and Replit
4. Fix-up prompts for mobile layout, accessibility, and SEO meta tags

Replace everything in square brackets before you paste. The last section covers what AI-generated sites still get wrong.

Step 1: Start Your Prompt for Website Creation With a Plan

Most bad AI websites start with a code prompt. Plan first. The sitemap and copy brief become the context you paste into every later prompt.

You are helping me plan a small website before any design or code.

Business: [what you do, in one sentence]
Audience: [who visits, and what they already know]
Main goal: [the one action a visitor should take, e.g. book a call]
Location or market: [city, country, or "online"]
Tone: [e.g. warm and plain, no hype]

Give me:
1. A sitemap with no more than 5 pages. For each page, state its single job.
2. For the home page, a section-by-section outline: headline, subheadline,
   3 benefit points, proof section, call to action.
3. A list of facts you need from me that you would otherwise have to invent
   (prices, hours, testimonials, credentials). Do not make any of them up.
4. Five questions a first-time visitor would ask, to use as an FAQ.

Point 3 matters most. It makes the model list its gaps instead of filling them with fiction. Answer those questions and keep the reply in a note. Our guide to ChatGPT prompt patterns explains why context like this beats role-play instructions.

Step 2: A ChatGPT Generate HTML Prompt for a One-File Landing Page

For a real page with no accounts or build tools, ask for a single HTML file. This works the same way in ChatGPT and Claude.

Using the plan below, write a complete landing page as ONE self-contained
HTML file.

Requirements:
- Plain HTML and CSS only, with the CSS in a style tag in the head.
  No JavaScript unless I ask. No external frameworks or CDN links.
- Mobile-first layout that also works at 1280px wide.
- Semantic structure: header, nav, main, section, footer. One h1.
- Use only the copy and facts I give you. Where something is missing,
  write [NEEDS INPUT: description] instead of inventing it.
- No stock testimonials, fake logos, or made-up numbers.
- Colors: [2-3 hex codes or "pick a calm palette with strong contrast"].
- Include a proper title tag and meta description.
- The call-to-action button links to: [mailto address, booking URL, etc.]

Return only the code in one block, then a 3-line list of what I should
check before publishing.

Plan and copy:
[paste the sitemap, home page outline, and your answers here]

The mailto or booking link is deliberate: a one-file page has no server, so a contact form would send nothing.

How to preview the HTML file

• Save it locally. Paste the code into a plain text editor, save it as index.html, and double-click the file to open it in your browser. In TextEdit on a Mac, switch to plain text first (Format, then Make Plain Text).
• Preview in Claude. Claude's Artifacts render single-page HTML websites next to the chat. Anthropic lists them on Free, Pro, Max, Team, and Enterprise plans, switched on under Settings, then Capabilities, with "Code execution and file creation." You can view the code, switch versions, and download the file.
• Preview in ChatGPT. OpenAI's help center describes code blocks inside the chat with a Preview option. Supported previews include HTML pages and React components, run in a sandbox.

Step 3: Prompts for AI Site Builders (v0, Bolt, Replit)

Once you need a login, a database, or pages that share data, an AI builder beats a single file. v0 describes itself as an agent that creates full-stack apps and deploys them on Vercel. Bolt builds websites and apps by chat and includes hosting with custom domains. Replit pitches its Agent as a way to describe a project and publish it. Lovable works similarly.

Builders respond best to a short brief, then small follow-ups.

Build a [type of site, e.g. booking site for a one-person yoga studio].

Who uses it: [visitor type] and [admin type, if any].
Pages: [list from your sitemap].
Must work on day one:
- [e.g. visitors pick a class time and submit name + email]
- [e.g. I see bookings in a simple admin list]
Not in version 1: payments, user accounts for visitors, blog.

Style: [3-5 adjectives], [hex colors], readable on phones first.
Use only the copy below. Mark any missing fact as [NEEDS INPUT].

Copy:
[paste your home page outline]

Then build in slices, one prompt per change:

Only change the booking form. Add validation: email must be valid,
time slot is required. Show the error message under the field.
Do not change any other page or the styling.

The "do not change" line stops a small request from quietly rewriting a page you liked. If you're still choosing a builder, our v0 alternatives breakdown compares stacks and hosts, and Anything, the AI app builder, covers another option in the same space.

Which tool fits which goal

Step 4: Iteration Prompts for Mobile, Accessibility, and SEO

These website prompts fix one category at a time, so the AI doesn't undo earlier work.

Fix the mobile layout:

Here is my page. On a 375px-wide phone screen, check for: text smaller
than 16px, horizontal scrolling, buttons smaller than 44px tall, images
wider than the screen, and nav links that overlap. List each problem
you find, then return the corrected full file. Keep the desktop layout
and all copy unchanged.

Run an accessibility pass. The W3C's Web Content Accessibility Guidelines are the reference, and W3C recommends the latest version, WCAG 2.2:

Audit this page against WCAG 2.2 level AA. Check: color contrast
(4.5:1 for normal text), alt text on every image, one h1 and a logical
heading order, visible focus styles, form labels tied to inputs, and
link text that makes sense out of context. Give me a table of issues
with the success criterion for each, then the fixed file.

An AI audit isn't a certification, so still tab through the page with your keyboard.

Add SEO meta tags:

Write the title tag and meta description for each page in this sitemap.
Title: under 60 characters, main topic first, brand at the end.
Description: 1-2 plain sentences that match what the page actually says.
Each page must be unique. Also add a viewport meta tag and a lang
attribute if missing. Return only the head section for each page.

Google's docs explain how it builds title links, and it only sometimes uses your meta description for the snippet. Accurate, page-specific tags still help.

Step 5: What AI-Generated Websites Get Wrong

Placeholder copy that reads as real. Models happily write a customer count and a testimonial from "Sarah M." If you didn't supply it, delete it. Search for NEEDS INPUT, "lorem," and any number you don't recognize.

Forms that submit to nowhere. A form in a single HTML file has no backend. Swap it for a mailto or booking link, connect a form service you've set up, or use a full-stack builder. Then submit a test entry.

No hosting. A file on your desktop is a website only you can see. Bolt and v0 include deployment; a hand-made HTML file needs a host and usually a domain.

Generic structure. Hero, three cards, testimonials, footer is the model's average, not your business. The Step 1 plan fixes it by giving each section a job. Our look at app websites shows what a good product site does differently.

A prompt gets you a draft; what goes missing is the setup around it, like the saved brief and fix-up prompts. Taku lets you mirror an AI workflow that already works into your own desktop workspace, run it, and remix it for the next site instead of starting from a blank chat. Taku is in Beta, and the Mac app is available now.

Key Points

• A strong prompt for website creation states the audience, one goal per page, and the output format.
• Plan first: generate a sitemap and a list of facts the AI must not invent.
• For a quick page, ask ChatGPT or Claude for one HTML file, then open it locally or preview it in chat.
• Use v0, Bolt, or Replit when you need data, logins, or deployment.
• Fix mobile, accessibility, and SEO as separate passes, then remove invented copy, test forms, and pick a host.

FAQ

What is the best prompt for website creation with ChatGPT?

There isn't one magic prompt. Use two: a planning prompt for a sitemap and a list of missing facts, then a build prompt for one HTML file using only your copy. Format and a ban on invented details matter more than clever wording.

Can ChatGPT generate HTML code for a full website?

Yes, for simple sites. It writes complete HTML and CSS pages you can preview in chat or open in a browser. A file you copy out of the chat has no hosting or form backend, though ChatGPT Sites, in beta on paid plans, can publish and host a site for you. Save the file as index.html to test it.

What website prompts work in AI builders like v0 or Bolt?

Short briefs beat long specs. List the pages, what must work on day one, and what's out of scope. Then send one change per prompt.

Are AI-generated websites good for SEO?

They can be, but first drafts rarely are. Check for unique title tags and meta descriptions, one h1, real copy, and a mobile-friendly layout, then publish on a real host.