SIGNAL GRID ACADEMY
All courses

Websites · Beginner

Create & Launch a Website with AI

From idea to a live site on your own domain, built with Claude Code and hosted free on Cloudflare.

4 lessons 62 min Certificate
Steps for
Join free to track progress

Lesson 1 · 12 min · Windows

Plan the site: a one-page spec

AI builders fail when they have to guess. Spend 10 minutes on a spec and the build gets 10x easier.

markdown
# Site spec
One line: A website for [BUSINESS] that gets [VISITOR] to [ACTION].
Pages: Home, About, Services, Contact
Must have: WhatsApp button, phone-friendly, loads fast
Look: [3 WORDS, e.g. calm, modern, warm]. Colours: [HEX or "pick for me"]
Words: I'll provide in content.md (never invent prices, reviews or awards)
Not in version 1: blog, login, shop
Done means: looks right at 390px and 1280px wide, no console errors

Borrow good design

Look at 2-3 sites you like and note what you like (spacing, big photos, one bold colour). Design libraries such as HorizonX offer free UI kits and components to start from. Copy patterns, never someone else's logo, photos or words.

Make the project folder

Windows steps
powershell
mkdir $HOME\Documents\my-site; cd $HOME\Documents\my-site
notepad spec.md

Put your real text in content.md (headlines, about text, services, contact). Real words make a real site.

Quick quiz

Pass 2 of 3
1. Why write a spec before building?
2. What's fine to borrow from sites you like?
3. Where should prices and testimonials come from?
Join free to take the quiz

Quick assignment

To do

Write spec.md for a real or practice website and paste it.

Hint: Fill every [BRACKET] in the template.

Join free to submit

Stuck or proud of what you built? Discuss this course in the forum.