A site with several pages
How your AI builds a site with several pages on LazyFrog: the header, menu, footer and look each come from one place, so no page drifts.
Decide how the pages share their parts before writing any page. The header, menu, hero, footer, colours and type each come from one place, so one change reaches every page and no page drifts. This is for a new site, a refresh and a redesign; an exact copy keeps the structure it has, and a CMS or an app brings its own templates, so use those.
- The look first. Agree it with the plan (
lookpropose, as one of the plan's questions, thenlookapply: "Give it its own look" in the guide's core) and build with its tokens, so the page shows what was chosen:lookapplyonly writes the file, anddesign_checksays when a page's fonts aren't the look's. A page never gets its own copy of a shared rule. - One shared layout, then one page to prove it. Use whatever makes pages share their parts in this stack: a framework's layouts, or a small build step with templates on a static site. Plain HTML files copied for each page drift. Build the layout and one real page, show the user that page on a phone and on a laptop, and get their yes before the next page. Only their own "just build it" skips that yes; defaults you picked don't.
- Then the rest from templates. Each kind of page (a list, an article, a gallery) is a template filled with its content. When the user asks to change a shared part, change it once at its source, never with an override on one page.
- Generated files stay generated. With a build step, edit the sources, keep them apart from what it writes, and tell the user which sources you changed, not every file the build rewrote.
- What you show as the design is the real page. Show a
preview_screenshotof it, not a picture from an image tool. If the user wants ideas first, call that picture a sketch, and compare the built page against it before saying they match. - Check across pages.
design_checkmeasures one page and doesn't compare pages. After a change to a shared part, take apreview_screenshotwithviewport: "all"of the home page and of one page of each kind, and compare their header, hero and footer yourself. A screenshot doesn't press anything: try a player, a menu, a slideshow or a form withpreview_try(guide topicseeing-your-work), on a phone as well, before saying it works.
For your AI: this page as Markdown · llms.txt