Build a new site for my business from scratch on my hosting server
[server name]. Details:
1. Business name:
[business name], trade:
[plumber / locksmith / AC service / other]
2. Business Profile name or domain:
[Business Profile name]
3. Services (each gets its own page):
[services]
4. Districts I serve and where my workshop is:
[districts],
[workshop location]
5. Phone:
[phone], WhatsApp:
[WhatsApp], address:
[address, or "I hide my address"], opening hours:
[hours]
6. Domain:
[domain], colour preference:
[colour preference], real photos:
[where the photos are, or "none"]
7. Work I do not do:
[services not offered]
First read the
[Business Profile name] listing with gbp_location_details. Compare the name, phone, address, website, opening hours, primary category, services and map link with what I gave you in one table. Where they differ, ask me which is right; change nothing on the Business Profile. On the site, use the name, address and phone exactly as they are written on the Business Profile. If the listing hides the address, show no street address on the site and list only the service areas. Take coordinates only from the map pin in the listing, never guess them. Choose the LocalBusiness subtype in the schema from the primary category (Plumber, Locksmith, HVACBusiness, Electrician and so on).
Then confirm the server with list_servers, call scaffold_site with style="service" and confirm=false first to show what will be overwritten, and run it with confirm=true after my approval. Read site_design_guide and site_seo_guide. Before writing code, write the design decision to _kaynak/ART.md and show it to me: a Swiss-minimal layout, a heavy grotesk display face from Fontshare (for example Cabinet Grotesk 800) with a plain body face (for example General Sans 400 and 600), an off-white background, dark navy text, one signal colour that gives at least 4.5:1 contrast with white text, and a separate WhatsApp green. The signature element is a pair of large buttons fixed to the bottom of the screen on mobile: "Call now" and "Message on WhatsApp".
Pages and schema:
1. Home: the first screen says in one sentence what you do and which districts you cover, with call and WhatsApp buttons and opening hours. Then service cards, district cards, the steps of a call-out and a 4-question FAQ. Schema: WebPage, FAQPage.
2. A services page and one page per service: the first paragraph answers "what do you do and how" directly; then symptoms, the steps on site, when it is an emergency, how the price is set (without inventing figures), 3 page-specific FAQs, the author and the date. Schema: Service (provider #business, areaServed the districts), FAQPage.
3. One area page per district. These must NOT be copies with the city name swapped. Each one carries that district's neighbourhood names, the faults you see most often there given the local building stock (a table whose rows differ from district to district), a travel and parking note, the distance from the workshop, two FAQs specific to that district and links to the other areas. Write at least 300 words of original text; if seo-check's duplicate scan finds more than 50 percent overlap between two area pages, rewrite them. Do not create a page for a district I do not really serve. Schema: AdministrativeArea (containedInPlace the province, containsPlace the neighbourhoods), Service, FAQPage.
4. About: who you are, how you work, with what equipment, and which jobs you do not take. Schema: AboutPage, and Person if I gave you a real name.
5. Contact: NAP, hours, a "Get directions" link and the WhatsApp form. Schema: ContactPage with mainEntity #business.
6. A privacy notice page and a 404 page.
No invention: do not write reviews, ratings, awards, certificates, customer counts or claims like "the best" that are not real. Do not add opening hours, coordinates, prices or an email I did not give you to the schema or the text; leave the field out and list it as missing in the report. Use no long dashes and no stock slogans, and make the first paragraph of every page answer that page's question directly.
Shared SEO work: every page gets a unique title of 48 to 60 characters, a description of 145 to 158 characters, a single H1 and a canonical ending in a slash. Add each page's own WebPage node and BreadcrumbList, linked to the base graph by @id. In robots.txt write Allow: / for Googlebot, Bingbot, OAI-SearchBot, ChatGPT-User, GPTBot, Claude-SearchBot, Claude-User, ClaudeBot, PerplexityBot, Perplexity-User, Google-Extended, Applebot-Extended and CCBot, explain the decision in a comment and note what to change if I want to block training crawlers. sitemap.xml carries real lastmod dates. llms.txt describes the business accurately in two sentences and lists the NAP and the important pages with links.
Technical setup (the toolkit's default path is not used on this site, for these reasons):
1. Compile Tailwind and drop the CDN. The kit loads Tailwind through the Play CDN, which compiles in the browser, prints a console warning and lowers mobile performance. Write _kaynak/package.json with site_write_file, install with site_run_command("cd _kaynak && npm i -D tailwindcss@3 html-validate", background=true) and wait for it with site_command_status. In _kaynak/tailwind.config.js set content to "./*.html", "./**/*.html", "!./_kaynak/**" and "./_kaynak/chrome.mjs". Move the @font-face rules, the @tailwind lines and the focus ring, skip link and overflow guard from the kit's app.css into _kaynak/site.css. Output to assets/app.css, because design-check.mjs looks for fonts in that file, and add ?v=<content hash> to the link on every page so the edge cache never serves the old file.
2. Self-host the fonts. Read the CSS URL of the Fontshare families you chose (api.fontshare.com/v2/css?f[]=...) with site_read_url, download its woff2 files with site_fetch into assets/fonts/, and declare them with @font-face and font-display: swap. Preload every weight used above the fold with <link rel="preload" as="font" type="font/woff2" crossorigin>, three files at most. Skip this and the font swap shifts the layout; in the demo desktop CLS was 0.078 for that reason and dropped to 0 with preloading.
3. Make the menu and footer static HTML. The kit's <site-nav> and <site-footer> components run on JavaScript, and most AI crawlers never see the menu, the address or the phone number. Remove the chrome.js and motion.js scripts from every page. In _kaynak/chrome.mjs write two functions that build the header and footer HTML from assets/site.config.js; build the mobile menu without JavaScript using <details> and <summary>, and mark the current page with aria-current="page". Write build.mjs at the site root that, in order, runs node seo-stamp.mjs, re-stamps everything between <!-- chrome:header:start --> and <!-- chrome:header:end --> (and the same for the footer) on every page, compiles Tailwind and updates the hash on the CSS link. After every change, run only site_run_command("node build.mjs").
4. No motion. Load no GSAP, Lenis, Swiper or any animation script on this site; visitors come on their phones to call or message quickly.
5. Shrink the images. Download each photo with site_fetch into separate files using resize="480x", "800x", "1200x", "1600x", image_format="webp" and a quality between 60 and 68. Give every <img> srcset, sizes, and width and height that match the real ratio; if you crop, add a ratio class such as aspect-
[4/3] with object-cover, otherwise the layout shifts when the image loads. The first-screen image gets fetchpriority="high" and is not lazy; all others get loading="lazy". Download the sharing image as a 1200x630 JPG with site_fetch.
6. Small details that cost points: add an SVG favicon with <link rel="icon"> (otherwise the browser requests /favicon.ico, the 404 shows up as a console error and Best Practices drops). Write DOCTYPE in capitals, use no style attributes and leave no trailing whitespace. Use instead of spaces in the visible text of phone links (the html-validate tel-non-breaking rule). Links in the menu, footer, breadcrumb and headings must be at least 44 pixels high and wide. Do not embed a Google Maps iframe; the site should make no outside requests, so show the address and a "Get directions" link instead.
7. No request may leave the site: fonts, scripts, styles and images all live on your own server. There is no form handler, so the contact form is a method="get" form pointing at https://wa.me/
[WhatsApp number] with a prefilled textarea named "text"; no JavaScript is needed.
Gates (in this order; do not call it done until all of them pass):
1. Run node build.mjs with site_run_command, then node seo-check.mjs: 0 errors, 0 warnings. A duplicate content warning means two pages are not different enough; rewrite them.
2. node design-check.mjs: 0 errors. If you chose a motionless style, report the "no motion" warning as a deliberate decision with the reason.
3. _kaynak/node_modules/.bin/html-validate on every HTML file: 0 errors. Put a _kaynak/ line in a .htmlvalidateignore file at the site root so dependencies are not scanned.
4. NAP check: show in a table that the name, address and phone on the site match the gbp_location_details output letter for letter.
5. Look at every page with site_preview at view="mobile", view="desktop", and also at 360 and 768 wide. Fix horizontal scrolling, overflowing headings, cramped buttons or unreadable text and look again.
6. Measure every page with core_web_vitals at strategy="mobile" and strategy="desktop", and get accessibility, best practices and SEO scores with seo_audit. The target on mobile is 100 for accessibility, best practices and SEO and at least 95 for performance; on desktop at least 95 for all four. On a page that misses, run core_web_vitals with resources=true, find the LCP element and any oversized image, fix it and repeat seo_audit with runs=2, because a single lab run can fluctuate.
7. The network requests must contain no address outside the site's own domain.
After publishing: submit sitemap.xml with gsc_submit_sitemap and check the home page and the three most important pages with gsc_inspect_urls. No tool can press "Request Indexing"; list what I need to request by hand in Search Console.
Finish with this report: the page list with mobile and desktop scores per page in a table (performance, accessibility, best practices, SEO, LCP, CLS), the result of each gate, the fixes you made and the information you still need from me. If a target was missed, say so plainly instead of calling it done.
