How to Build Your Website with AI (Step by Step)
If you don't have the budget for a web developer, you can start with a website like the ones in this post. Nobody says you have to wait until you can afford custom work to have something online.
I do custom web design for a living, and I still generate AI designs for inspiration and as a low-fidelity starting point. So what I'm sharing here isn't theory, it's from my actual process.
The designs AI generates these days are quite decent. And if you give it the right instructions, you get something that's not just fine in terms of design, but actually intentional and trustworthy.
The key to all of that is what you feed the AI. Not a vague prompt like "build a website for my (whatever) business," but real information that gets you something close to custom.
Here's the 4-step process I follow.
1. Figure Out Your Goal First
Before anything else, ask yourself why you actually need this website.
- Is it mainly to build trust?
- Do you want to introduce or test a new offer?
- Is it part of a marketing channel, like ads, social media, SEO, or Google Maps?
Depending on your goal and how you plan to get eyes on it, the website strategy should be different. A page people land on from an ad needs to do a very different job than one people find after checking you out on Google Maps.
For me, the website strategy is basically this:
Main Goal + How people will find the website + Your knowledge of your specific clients + Details about your business
When you work with a web designer, figuring this out with you is part of their job. But since you're doing this yourself, you can use AI to help you get there.
When I work with clients, I ask about their goals, business, clients, marketing, services, branding, and so on. Here's the list of questions I use. Rough notes are completely fine, just answer as best you can.
Business & Website Assessment
Business
- What does your business do?
- Who is your ideal customer?
- What problem do you solve for them?
- Why do customers choose you instead of other options?
Website
- What is the main goal of the website?
- What action do you want visitors to take?
- How are people going to find the website? Google Maps, SEO, ads, social media, referrals, etc.
Customer Journey
- How do people currently find you, become customers, and work with you?
- Is there anything in this process that could be simplified through the website?
Existing Assets
- What do you already have? Logo, photos, testimonials, case studies, videos, brand guidelines, etc.
- Are there any websites or designs you like? What do you like about them?
- Anything else we should know about the business or website?
2. Get a Website Strategy From Your Answers
Now attach your answers and use this prompt to get a strategy suggestion for your website:
I'll provide you with a completed Business & Website Assessment.
Act as a professional website strategist and create a website strategy and structure based on the business's goals, audience, offer, customer journey, and traffic sources.
For each section, provide:
Content: What should be communicated in this section.
Purpose: Why this section exists and what it should accomplish.
Only include sections that have a clear purpose. Do not use a generic website structure.
At the end, briefly summarize: [what you want summarized, e.g. the main strategy and the key decisions behind it]
Use this format:
Content...
Purpose...
Content...
Purpose...
What you get back is a list of recommended pages and sections, plus the reason and strategy behind each one. It looks something like this:
[Page]
Section 1 ...
Content: what information you should put there.
Purpose: why this section is suggested here and this way.
Section 2 ...
Content: ...
Purpose: ...
Notice I intentionally ask for the purpose of each section. That's not decoration. If I find out something could be improved, or there's a better way to do it, I can make my own adjustments instead of blindly accepting whatever the AI decided.
Don't skip the 'why'
If the AI can't explain why a section exists, you probably don't need it. Cut it. Sections added just to fill space are one of the fastest ways a website starts to feel generic.
3. Write the Website Copy Before You Design Anything
Once the strategy and structure are approved, it's time to work on your website copy and content.
I like to create a document based on the website structure, and for each section I write a content draft and outline. Think of it as collecting the raw material the AI will need for the actual copy.
Content & Copy Inputs
General Information
- Business name
- Domain
- Contact information
- Calendar / booking link
- Social profiles
- Other important links
Hero
- How would you explain what you do, who it's for, and the main result?
- What are the main problems your customers have?
- What results do you help them achieve?
Who This Is For
- Who is your ideal customer?
- Who benefits most from your offer?
- Who is not a good fit?
Problem
- What problems and frustrations do they have?
- What happens if they don't solve them?
Solution
- What exactly do you offer?
- How does it solve their problem?
- What does the customer receive?
- What makes your approach different?
How It Works
- Step 1
- Step 2
- Step 3
Results / Deliverables / Pricing
- What does the customer receive?
- What outcomes can they expect?
- Price
- Important pricing details
Testimonials
- Person / company
- Testimonial
FAQs
- Common questions or objections
- Answers
Qualification / Contact Form
- What do you need to know before someone books or contacts you?
Design Direction
- Brand assets
- Colors
- Fonts
- Websites/designs you like
- What you like about them
- Anything you don't want
Additional Notes
- Anything else that should be communicated
Also upload any relevant logos, images, PDFs, testimonials, case studies, etc.
Why I Use StoryBrand for Website Copy
For the copy itself I use the StoryBrand Framework, a marketing framework that positions the customer as the hero and the business as the guide.
For me and my clients it's been working very well, because it makes it so easy for visitors to understand what you do, who it's for, and how it works. I wrote a whole post on how to use it for landing page copy if you want the deeper version.
Here's the short version I give to the AI:
Character
Who is the customer and what do they want?
Problem
What external, internal, and philosophical problems are they dealing with?
Guide
How does the business show empathy and demonstrate competence?
Plan
What simple steps does the customer need to take?
Call to Action
What is the clear next step?
Success
What does life/business look like after solving the problem?
Failure
What happens if the problem remains unresolved?
One-Liner
Problem → Solution → Result
The main idea: the customer is the hero, and the business is the guide.
The Copy Prompt
Attach the StoryBrand Framework, your Business & Website Assessment, your Content & Copy Inputs, and the Website Structure. Then use this:
Use the attached StoryBrand Framework as the messaging structure and the client's information as the source of truth.
Write the complete website copy based on the provided website structure.
Make the copy: [your tone and style requirements, e.g. clear, specific, conversational, no buzzwords]
Do not invent facts, metrics, testimonials, credentials, or claims. If something is missing, use neutral wording.
Length: [your length preferences, e.g. concise, only as long as each section needs]
Follow the provided website structure and write the actual copy for each section.
Use markdown headings so the result can be pasted into Notion.
Read the 'do not invent' line twice
AI loves making up testimonials, numbers, and credentials to make a page feel complete. A fake claim on your website does more damage than an empty section. Always keep that instruction in, and always check the output for things you never told it.
4. Now Build the Design
At this point you have everything ready for the final build.
You can pick any AI you have and like. Better models will give you better results, of course. What you see below was generated with Sonnet 5 using just one prompt.
Attach these four things:
- Final website copy
- Your branding (fonts, color codes, etc.)
- Some designs you like as inspiration
- Final website structure
Then use this prompt:
Use these as the source of truth when designing the website.
Build the website around the provided strategy and copy. Use the design references for inspiration, but don't simply copy them.
Make the result feel specific to this business rather than like a generic AI template.
Prioritize: [your design priorities, e.g. clarity, trust, mobile experience, readable typography]
Don't add sections just to fill space.
[Add any technical requirements here.]
What That Looks Like in Practice
Here are two designs the AI generated for one of my own projects, each from a single prompt:
And here's the final design I built, inspired by them:
Notice that the AI designs aren't the final product. They're a low-fidelity starting point that already has the right structure, the right copy, and a direction. That's a much better place to start than a blank page.
Final Take
The quality of what AI gives you depends on the quality of what you give it.
A vague prompt gets you a vague, generic website. But when you go through the process in order, goal, strategy, copy, and only then design, you give the AI the same information a good web designer would ask you for.
Here's the whole thing in short:
- Goal: Why do you need this website, and how will people find it?
- Strategy: Get a structure with the reasoning behind every section.
- Copy: Write it with StoryBrand before you design anything.
- Design: Feed the AI your copy, structure, branding, and inspiration.
You don't have to use all of these resources exactly as they are. They're the same ones I use as a starting point in my own process, so adjust them to fit your business.
If you follow these steps and have questions midway, get in touch. I'm happy to answer or guide you where I can.