{"data":{"slug":"business-website-with-ai-coding","title":"Build and host a small business website with AI coding tools instead of Webflow, Squarespace or Wix","summary":"For a simple 3–8 page marketing site: write a site brief, have Claude Code or Cursor (or a chat assistant, for non-coders) build plain HTML/CSS, and host it on Cloudflare's free plan with Workers static assets. Includes the agent prompt, deployment commands, a form option, redirect handling and an honest list of what you give up.","outcome":"I want a fast, professional website for my business without paying a monthly website-builder subscription.","capabilities":["website-building","website-hosting","code-generation"],"replaces":[{"tool":"webflow","scope":"full"},{"tool":"squarespace","scope":"full"},{"tool":"wix","scope":"full"}],"requiredTools":[{"tool":"claude","purpose":"Claude Code (included in Claude's paid plans) builds and edits the site files from the brief; Claude chat works for non-coders who copy files by hand.","optional":false},{"tool":"cursor","purpose":"Alternative AI code editor if you already pay for it.","optional":true},{"tool":"chatgpt","purpose":"Alternative chat assistant for generating pages and copy.","optional":true},{"tool":"cloudflare-workers","purpose":"Free hosting for the static files (Workers static assets), custom domain, HTTPS and redirects.","optional":false},{"tool":"google-workspace","purpose":"Google Forms + Sheets for the simplest contact-form option.","optional":true}],"additionalMonthlyUSD":0,"difficulty":"moderate","skill":"technical","setupTime":"1–2 days for a 5-page site including content migration, review and DNS changes","illustrative":true,"evidenceStatus":"editorial","lastReviewed":"2026-10-13","links":{"page":"/workflows/business-website-with-ai-coding","api":"/api/v1/workflows/business-website-with-ai-coding","markdown":"/workflows/business-website-with-ai-coding.md"},"additionalCost":{"monthlyUSD":0,"explanation":"Cloudflare's Free plan serves static asset requests free and without a request limit; Worker code (only needed for a custom form handler) gets 100,000 requests a day on Free. Assumes you already pay for an AI coding tool. Your domain renewal is unchanged — but if your domain was bundled with the website builder, you will need to pay for it at a registrar after moving."},"timePerRun":"5–15 minutes for a text or image change via the AI tool and redeploy","goodFitFor":["Service businesses, consultants, clinics and trades with a brochure-style site that changes a few times a month","Founders comfortable running a few terminal commands, or with a technical friend for the first deploy","Sites where speed, low cost and full ownership of the files matter more than a visual editor"],"notFitFor":["Teams where non-technical marketers publish pages or blog posts weekly and expect a visual editor","Ecommerce stores, booking systems, member areas or anything with payments and logins","Sites with large blogs or CMS collections that non-developers update","Owners who need phone or chat support from their website provider"],"before":"Pay a monthly or annual website-builder plan. Edit pages in the visual editor, use its built-in contact form, and rely on its hosting, SSL, templates and support.","after":"The site is a folder of HTML/CSS files you own. An AI coding tool builds and edits it from a written brief; `npx wrangler deploy` publishes it to Cloudflare's free plan on your own domain. Forms go to a Google Form or a small Worker. Edits are made by asking the AI and redeploying.","steps":[{"title":"Inventory the current site before touching anything","body":"List every page, its URL, page title and meta description, every form and where its submissions go, and every integration (booking widget, newsletter signup, chat, analytics, store).\n\nCopy all text into a Google Doc and download all images you own the rights to. Check your builder's own export options; exports are often partial, so a manual copy is the safe baseline.\n\nNote who controls the **domain** (registrar login) and the **DNS**. If the domain was bought through the website builder, plan to transfer it or point it elsewhere before cancelling."},{"title":"Write the site brief","body":"Fill in the **site brief template** (artifact below) and save it as `SITE_BRIEF.md` in a new, empty project folder. Include the old URL for each page so redirects can be created.\n\nThe brief is what keeps the AI from inventing content. Anything you leave blank becomes a placeholder you'll fill later."},{"title":"Have the AI build the site","body":"**Coders / comfortable with a terminal:** open the folder in Claude Code (included in Claude's paid plans) or Cursor and paste the **Agent build prompt**. Review the home page in the browser before letting it build the rest. Run it locally with `npx wrangler dev` or by opening the HTML files.\n\n**Non-coders:** use Claude or ChatGPT chat with the **Single-page generator prompt**, one page at a time. Save each answer as a file with the exact name the AI gives (e.g. `index.html`, `styles.css`) in a `public` folder. Ask for a fixed list of files up front so nothing is missed.\n\nKeep the site **plain HTML + CSS** unless you have a reason not to; it's easiest for any AI or developer to edit later."},{"title":"Review it like a visitor","body":"Use the **QA prompt** to have the AI check for broken links, missing alt text and titles. Then check yourself:\n- On your phone: menu works, text readable, buttons tappable, no sideways scrolling.\n- Every claim, price and testimonial is real and approved.\n- Contact details match your Google Business Profile and other listings exactly."},{"title":"Deploy to Cloudflare's free plan","body":"Cloudflare's docs now say to start new projects on **Workers** (Pages still works). For a static site:\n\n1. Create a free Cloudflare account.\n2. In the project folder, make sure `wrangler.jsonc` contains your project name, a `compatibility_date` and `\"assets\": { \"directory\": \"./public\" }`.\n3. Run `npx wrangler deploy`. The first run asks you to log in. You get a `*.workers.dev` URL to test.\n4. **Custom domain:** a Workers Custom Domain needs the domain added to Cloudflare as an active zone (free plan is fine), which usually means switching your domain's nameservers to Cloudflare. Recreate any email DNS records (MX, SPF, DKIM) **before** switching, or your email will break.\n5. Add the domain under the Worker's **Settings > Domains & Routes**.\n\nFree plan limits that matter (checked today): requests for static assets are free and unlimited; up to 20,000 files per version and 25 MiB per file; Worker code (only if you add a form handler) has 100,000 requests a day."},{"title":"Handle forms and redirects","body":"**Forms, simplest option:** create a Google Form (responses go to a Sheet, with email notifications) and link to it or embed it on the contact page. Looks less integrated but needs no code.\n\n**Forms, integrated option:** ask the AI to add a small Worker route that receives the form POST, checks a Cloudflare Turnstile token to block spam, and forwards the message to you (for example to a Google Sheet via Apps Script, or by email). This uses Worker requests, which count toward the 100,000/day free limit.\n\n**Redirects:** a `_redirects` file in `public/` maps old builder URLs to new ones (e.g. `/about-us /about 301`). Cloudflare allows up to 2,000 static and 100 dynamic redirects. This protects your search rankings."},{"title":"Run both sites in parallel, then cancel","body":"Keep the old builder subscription until the new site has been live on your domain for at least a week and the verification checklist passes. Submit the new `sitemap.xml` in Google Search Console and watch for crawl errors.\n\nSave the project folder somewhere backed up (a private Git repo is ideal). That folder *is* your website now."}],"prompts":[{"title":"Agent build prompt (Claude Code / Cursor)","purpose":"Have an AI coding agent build the whole site from the brief, with checkpoints.","text":"You are building a static marketing website for {{business_name}}. Read SITE_BRIEF.md in this folder first; it is the source of truth.\n\nRequirements\n- Pages: {{page_list}}. One HTML file per page in ./public (e.g. public/index.html, public/services/index.html) so URLs have no .html extension.\n- Plain HTML + one shared CSS file (public/styles.css). No framework and no build step unless I ask. Minimal JavaScript (mobile menu only).\n- Shared header/nav and footer must be identical on every page. Footer: {{footer_contents}}.\n- Design: colours {{brand_colors}}, fonts {{fonts}}, tone {{design_tone}}. Mobile-first, readable at 375px wide, no horizontal scroll.\n- Accessibility: semantic headings (one h1 per page), alt text on every image, visible focus states, colour contrast at least WCAG AA.\n- SEO: unique <title> and meta description per page (use the ones in the brief), Open Graph tags, a sitemap.xml and robots.txt in public/, canonical URLs on {{domain}}.\n- Contact form: {{form_approach}}.\n- Redirects: create public/_redirects with 301s from each old URL in the brief to its new path.\n- Images: put them in public/images, sized for the web (max ~1600px wide, compressed), with width/height attributes.\n- Hosting: Cloudflare Workers static assets. Create wrangler.jsonc with name \"{{worker_name}}\", today's compatibility_date and \"assets\": {\"directory\": \"./public\"}. No Worker script unless the form approach needs one.\n\nProcess\n1. Propose the file structure and a one-paragraph design direction. Wait for my OK.\n2. Build the home page first. Stop so I can review it in the browser.\n3. Build the remaining pages, then run a self-check: broken internal links, missing alt text, missing titles, pages wider than the viewport at 375px. Report what you found and fixed.\nDo not invent testimonials, client names, prices, awards or statistics. Use clearly marked placeholders where content is missing.","variables":["business_name","page_list","footer_contents","brand_colors","fonts","design_tone","domain","form_approach","worker_name"]},{"title":"Single-page generator prompt (chat, for non-coders)","purpose":"Generate one page at a time in a chat assistant and save it as a file.","text":"I'm building a simple static website for {{business_name}} with these pages: {{page_list}}. All pages share one stylesheet called styles.css.\nHere is my site brief:\n{{site_brief}}\nNow write the complete file for the \"{{page_name}}\" page, saved as {{file_path}}. Use plain HTML, link to /styles.css, include the shared header and footer exactly as in previous pages: {{shared_header_footer_or_none}}.\nUse only content from the brief; mark anything missing as [PLACEHOLDER: ...]. Give me the whole file in one code block and nothing else.","variables":["business_name","page_list","site_brief","page_name","file_path","shared_header_footer_or_none"]},{"title":"QA prompt","purpose":"Have the AI audit the finished site before launch.","text":"Review every file in ./public for launch readiness on {{domain}}. Check and fix: broken internal links; images without alt text or width/height; pages missing a unique title or meta description; more than one h1; layout overflow at 375px; contrast below WCAG AA for {{brand_colors}}; any invented testimonials, numbers or client names; _redirects entries for these old URLs: {{old_urls}}.\nReport a table of issues found, what you changed, and anything that needs my decision.","variables":["domain","brand_colors","old_urls"]},{"title":"Content edit prompt (after launch)","purpose":"Make routine changes safely and redeploy.","text":"Change request for the {{business_name}} site: {{change_description}}.\nOnly edit the files needed. Keep header/footer identical across pages. Show me a summary of the diff, then run `npx wrangler deploy` once I confirm.","variables":["business_name","change_description"]}],"artifacts":[{"title":"Site brief template","kind":"template","language":"markdown","content":"# Site brief – {{business_name}}\n_Fill this in before you prompt the AI. The more specific, the less rework._\n\n## 1. Basics\n- Business name: {{business_name}}\n- One-sentence description: {{one_liner}}\n- Primary audience: {{audience}}\n- Main action we want visitors to take: {{primary_cta}} (e.g. book a call, request a quote, call us)\n- Domain: {{domain}} — registrar: ______ — DNS currently managed by: ______\n- Current site URL (to migrate from): {{current_site_url}}\n\n## 2. Pages (3–8)\n| Page | URL path | Purpose | Key content | Old URL to redirect from |\n|---|---|---|---|---|\n| Home | / | Explain what we do, prove it, CTA | Hero, 3 services, testimonials, CTA | / |\n| Services | /services | Detail each service | 3 sections + FAQ | /what-we-do |\n| About | /about | Trust | Story, team photos, credentials | /about-us |\n| Contact | /contact | Convert | Form, phone, address, map link, hours | /contact |\n| (optional) Work / Case studies | /work | Proof | 3 short case studies | |\n| Privacy | /privacy | Legal | Your privacy policy text | |\n\n## 3. Brand\n- Colours (hex): primary ____ accent ____ text ____ background ____\n- Fonts: ____ (or \"system fonts\")\n- Logo files: SVG/PNG paths\n- Sites we like the look of (and why): ____\n- Tone of voice: ____\n\n## 4. Content inventory\n- Copy: where it lives now (export from old site, Google Doc link)\n- Images: folder link; all images we have rights to use? yes/no\n- Testimonials (with permission): ____\n- Legal: privacy policy, cookie notice needed? (depends on analytics/forms used and your location)\n\n## 5. Forms and integrations\n- Contact form fields: name, email, phone (optional), message, how did you hear\n- Where submissions go: Google Form + Sheet / email via a small Worker / other\n- Booking link (e.g. existing scheduler): ____\n- Analytics: none / privacy-friendly analytics / Google Analytics\n- Anything else from the old builder we rely on: blog, store, member area, newsletter signup, chat widget\n\n## 6. SEO essentials\n- Page titles and meta descriptions: keep the current ones? (copy them from the old site)\n- Business address and phone shown consistently on every page footer\n- Old URLs that get traffic (from your analytics) → redirect targets\n\n## 7. Who maintains it\n- Who will edit text after launch: ____\n- How often: ____\n- Their comfort level: edits in a code editor / asks the AI / needs a visual editor"},{"title":"Minimal wrangler.jsonc for a static site","kind":"config","language":"jsonc","content":"{\n  \"$schema\": \"./node_modules/wrangler/config-schema.json\",\n  \"name\": \"{{worker_name}}\",\n  // Set to the date you create the project\n  \"compatibility_date\": \"{{compatibility_date}}\",\n  \"assets\": {\n    \"directory\": \"./public\"\n  }\n}"}],"limitations":["No visual drag-and-drop editor: changes go through an AI tool or code, which suits founders more than marketing teams.","No built-in CMS or blog management for non-technical editors.","No built-in forms, ecommerce, bookings, memberships or email marketing; each needs a separate tool or custom code.","No vendor support desk; when something breaks you rely on the AI tool, docs, or a developer.","Domain and DNS changes are on you; mistakes can take a site or email offline for hours.","Builder templates, apps and some content may not export cleanly; expect manual copying."],"risks":[{"type":"migration_complexity","severity":"medium","note":"Moving DNS can break email if MX/SPF/DKIM records aren't recreated first. Check every record before switching nameservers."},{"type":"functionality_loss","severity":"medium","note":"Builder-native features (forms, store, scheduling, newsletter popups) disappear on cancel; each must be inventoried and replaced."},{"type":"security","severity":"low","note":"Static HTML has a small attack surface, but a custom form handler must validate input and use spam protection such as Turnstile."},{"type":"reliability","severity":"low","note":"AI-generated code can contain subtle layout or accessibility bugs; the QA step and a mobile check are essential."},{"type":"vendor_lock_in","severity":"low","note":"Plain HTML files are portable to any host, which reduces lock-in compared with a builder."}],"verificationChecklist":["Every page from your inventory exists on the new site and old URLs return a 301 to the right new page (test each in a private window).","The `*.workers.dev` preview works on a phone at 375px wide with no horizontal scrolling and a working menu.","A test contact-form submission arrives where you expect (Sheet, inbox) within minutes, and a blank or spammy submission is rejected.","Email still sends and receives on your domain after DNS changes (send a test both ways).","Page titles and meta descriptions match or improve on the old site's; sitemap.xml loads and is submitted in Search Console.","You (or whoever maintains the site) made a text change and redeployed it unaided in under 15 minutes.","The project folder is backed up outside your laptop.","The old builder stays active until the new site has run on your domain for at least a week without issues."],"savingsMethodology":"Savings = your website-builder plan (monthly, or annual price ÷ 12) − incremental cost ($0 hosting on Cloudflare's Free plan; $0 for the AI tool if you already pay for it). If the builder bundled your domain, subtract the domain's annual registrar price ÷ 12. If you'd need to buy an AI coding subscription only for this, subtract that too. Setup time (1–2 days) and later editing time are not monetised.","example":{"scenario":"A 5-page consultancy site on a website-builder plan billed annually, owner already pays for Claude Pro and has the domain at a separate registrar.","currentMonthlyUSD":25,"newMonthlyUSD":0,"assumptions":["Illustrative: $25/month is a round placeholder for a mid-tier builder plan. Webflow, Squarespace and Wix pricing pages showed non-US currencies or JavaScript-rendered prices to our fetcher on 2026-10-13, so no builder price was verified.","Cloudflare Free plan limits (static asset requests free and unlimited; 20,000 files/version; 25 MiB per file) were verified on developers.cloudflare.com on 2026-10-13.","Claude Pro is already paid for other work; Claude's pricing page lists Claude Code as included in all paid plans.","The domain renewal is unchanged and not counted."]},"evidence":{"status":"editorial","sources":[{"url":"https://developers.cloudflare.com/workers/static-assets/billing-and-limitations/","title":"Cloudflare Workers static assets: billing and limitations","accessedAt":"2026-10-13","note":"Requests to static assets are free and unlimited (except routes forced through Worker code)."},{"url":"https://developers.cloudflare.com/workers/platform/limits/","title":"Cloudflare Workers limits","accessedAt":"2026-10-13","note":"Free: 100,000 Worker requests/day, 10 ms CPU per request, 20,000 static asset files per version, 25 MiB per asset."},{"url":"https://developers.cloudflare.com/pages/platform/limits/","title":"Cloudflare Pages limits","accessedAt":"2026-10-13","note":"Free: 500 builds/month, 1 concurrent build, 20,000 files per site, 25 MiB per asset, 100 custom domains per project."},{"url":"https://developers.cloudflare.com/pages/","title":"Cloudflare Pages docs","accessedAt":"2026-10-13","note":"Cloudflare now says to start new projects with Workers."},{"url":"https://developers.cloudflare.com/workers/static-assets/","title":"Cloudflare Workers static assets","accessedAt":"2026-10-13","note":"assets.directory in wrangler config; matching assets served without invoking Worker code."},{"url":"https://developers.cloudflare.com/workers/static-assets/get-started/","title":"Cloudflare Workers static assets: get started","accessedAt":"2026-10-13","note":"npm create cloudflare@latest, npx wrangler dev, npx wrangler deploy."},{"url":"https://developers.cloudflare.com/workers/static-assets/redirects/","title":"Cloudflare Workers static assets: redirects","accessedAt":"2026-10-13","note":"_redirects file supported; 2,000 static + 100 dynamic redirects."},{"url":"https://developers.cloudflare.com/workers/configuration/routing/custom-domains/","title":"Cloudflare Workers Custom Domains","accessedAt":"2026-10-13","note":"Requires an active Cloudflare zone for the domain."},{"url":"https://claude.com/pricing","title":"Claude pricing","accessedAt":"2026-10-13","note":"Pro $20/month billed monthly or $17/month billed annually; 'Claude Code is included in all paid plans'."},{"url":"https://www.squarespace.com/pricing","title":"Squarespace pricing","accessedAt":"2026-10-13","note":"Shown in THB from our location (plans Basic, Core, Advanced); USD prices not verified."},{"url":"https://www.wix.com/plans","title":"Wix plans","accessedAt":"2026-10-13","note":"Page notes prices and currency vary by location and USD is for reference; not used."}],"verifiedBy":"agent:claude-research","notes":"Editorial guide. Cloudflare limits and deploy steps verified on Cloudflare docs today. Website-builder prices could not be verified in USD, so the example is illustrative. Google Forms and Turnstile are mentioned as options, not reviewed in depth."}},"meta":{"apiVersion":"v1","dataVersion":"4ef259c22a11","dataGeneratedAt":"2026-10-13T15:33:34.065Z","docs":"/docs/api","evidenceLegend":"/docs/data-model#evidence","disclaimer":"Prices and capabilities change. Check each item's evidence status and verification date. Savings are estimates, not guarantees."}}