Fill in before sending
[hotel / residential project][server name][business or project name][location][boutique hotel / residential project][room details][unit details][phone][WhatsApp][email][address][domain]
Build a Turkish and English site for my [hotel / residential project] on my hosting server [server name]. Details:
1. Name: [business or project name], location: [location], type: [boutique hotel / residential project]
2. For a hotel, the room types (size, bed, guests, view, amenities), check-in and check-out times, season and house rules: [room details]
3. For a project, the unit types (rooms, square metres, floor, handover date) and sales office details: [unit details]
4. Phone: [phone], WhatsApp: [WhatsApp], email: [email], address: [address]
5. Domain: [domain], real photos: [where the photos are, or "use stock"]
6. Who will review the English copy: [person, or "nobody"]
First confirm the server with list_servers and run scaffold_site with style="universal", confirm=false first and confirm=true after my approval. Read site_design_guide and site_seo_guide. Write a luxurious, warm design decision to _kaynak/ART.md and show it to me: a fine serif display face from Fontshare (for example Boska 300) with a plain body face (for example Synonym), dark coffee and linen tones, one copper accent, small widely tracked labels and full-screen photography. The signature element is the full-screen first image on the home page and its gentle parallax. Do not lay a transparent header over the photo; on light pages the light menu text disappears (in the demo this dropped accessibility to 95 on the rooms and contact pages). Give the bar a dark background.
Language structure:
1. Turkish pages sit at the root and their English twins under /en/. Every Turkish page has an English twin and the two point to each other. Keep the page pairs in one list in assets/site.config.js and build the menu, footer and language switcher from it; the switcher always goes to that page's counterpart, never to the home page.
2. Every page's <head> carries hreflang="tr", hreflang="en" and hreflang="x-default" pointing at the Turkish page, all as absolute URLs; write the same pairs into sitemap.xml as xhtml:link entries.
3. English pages use <html lang="en">, an English title, description and breadcrumb, and WebPage inLanguage "en". seo-stamp.mjs stamps og:locale tr_TR on every page; in build.mjs, after stamping, change it to en_GB on English pages and add og:locale:alternate in both languages.
4. Write the English as a native writer would, not as a translation, and keep place names in their Turkish spelling.
Pages and schema (each in both languages):
1. Home: full-screen first image, what the place is in one paragraph, short facts (number of rooms, check-in, check-out, season), room cards and a link to the local guide. Schema: WebPage, and on the business node type Hotel with checkinTime, checkoutTime, numberOfRooms, amenityFeature and the rooms under containsPlace. For a residential project use Residence or ApartmentComplex instead.
2. A rooms page and one page per room type: size, bed, number of guests, amenities, who it suits, and a link to the other room type. Schema: HotelRoom (bed, occupancy, floorSize, amenityFeature, containedInPlace #business). For a residential project, a RealEstateListing per unit type with an Apartment inside it (numberOfRooms, floorSize). If I gave no prices, write no offers, and say in the copy "send us your dates and we will tell you the rate for them".
3. Local guide: local knowledge with a last updated date. Schema: WebPage.
4. Contact and booking: phone, WhatsApp form, email, address, "Get directions", travel notes and booking terms. Schema: ContactPage.
5. A 404 page (short, in both languages).
Do not claim a star rating, awards, guest scores or "the best"; add no starRating or aggregateRating.
To open large photos quickly: deliver the first image with <picture>; on screens up to 767 pixels use a portrait crop at 600 and 900 pixels wide (cropped at the source address and fetched with site_fetch), and on wider screens the landscape version at 1200, 1600 and 2000 pixels. Without the portrait crop the landscape image is scaled up to fill the phone screen, so it either looks soft or downloads a needlessly large file.
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. Parallax without JavaScript. Give the first image data-parallax and move it slowly with a CSS scroll-driven animation (animation-timeline: scroll(root)) using transform only; give sections a data-reveal entrance that also uses transform only, never opacity. Wrap the rules in @media (prefers-reduced-motion: no-preference) and @supports (animation-timeline: scroll()); with reduced motion, or in a browser without support, the image stays still. Do not load GSAP, Lenis or Swiper.
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. Language check: show in a table that every page's hreflang twin exists, returns 200 and points back; seo-check must give no hreflang warning.
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.