Knowledge Base / Production
Production Manual
How a signed deal becomes a live website: the pipeline, the non-negotiable standards, and the QA gate every site must pass before a client ever sees it.
The build pipeline
From signed deal to live site (typical Starter/Growth timeline)
Intake & kickoff (day 0–1)
Receive the sales handoff: package, promises, vibe, assets, domain access, delivery date. Missing anything? Chase it now, not on day 4. Send the client the kickoff note (see templates) so they know what happens and when.
Research (day 1–2)
Non-negotiable before any pixels: study the client's business, their market, and 3 to 5 competitor websites. Note what competitors do well, what they all miss, and the search terms customers would use. The goal in one line: beat the competitors, don't match them.
Design & build (day 2–5)
Start from a fresh copy of the Starter Kit (Next.js + Tailwind + the animation/SEO scaffolding preinstalled). Configure lib/site-config.ts first: it drives metadata, sitemap, schema. Build in the chosen vibe using its fonts and palette (see the 6 Vibes). Real structure per page, real motion, no filler.
Content & SEO (day 4–6)
Witty, direct copy in the brand register of the vibe. Unique title + meta description per page. Schema markup (Organization, LocalBusiness where relevant, FAQ, Service). Semantic headings: exactly one H1 per page, keyword-bearing. Alt text on every image.
QA gate (day 6)
Run the full pre-delivery checklist below. Every box, every time, even under deadline pressure. A missed form backend or a broken mobile menu costs more trust than a one-day delay.
Client review (day 7)
Send the preview link with a short guided note ("check it on your phone first"). Collect feedback in one batch. Apply scoped revisions; log anything out of scope for a quote.
Launch & handover (day 7–8)
Static export, upload to Hostinger, point DNS, verify SSL, submit sitemap to Google Search Console, confirm analytics fire. Send the handover pack: live URL, what was built, how to request changes, and the care-plan offer.
Design & dev standards (the non-negotiables)
These are standing rules from Burney. They apply to every site, no exceptions, and they exist because each one is a reason clients pick us over the alternatives.
Performance
- ~0.2s load target. Static export, optimized images (WebP, sized to their container), no render-blocking junk, fonts with display=swap, minimal JS shipped to the browser.
- Animations must be smooth and never block first paint. Lazy-load anything heavy (video, 3D, big galleries) with a poster fallback.
Design
- No templates, no AI tells. Banned: uniform grids of identical rounded cards with icon-in-tinted-square headers; generic hero-with-two-buttons layouts; copy that sounds like a brochure. Prefer editorial layouts: numbered full-width rows, hairline dividers, oversized type, asymmetry.
- Real fonts per vibe (see Foundations). Never default to a generic stack because it was easier.
- Images: copyright-free or client-supplied, HD, and every image must relate to the text next to it. Never repeat an image anywhere on a site. No cartoonish stock unless the client asked.
- No emojis. Anywhere. Ever. Not in copy, buttons, headings, or easter eggs. Personality comes from type, color, and motion.
- Motion on every site: scroll reveals, hover states, one signature moment per site (the thing a visitor remembers). Clean and choreographed, not confetti everywhere.
- Mine the Design Library (F:\Burney's Design Library) every build: animation patterns, component ideas, font pairings, background textures, real-product structure references.
Structure & content
- Separate pages for separate topics. No single-page sites unless explicitly sold that way. No thin pages: if a page ends within 2 to 4 scrolls, it needs real content, not padding.
- Every page answers: who is this for, why should they care, and what should they do next (one obvious CTA).
- Copy: short punchy lines, plain language, zero unexplained jargon, minimal dashes. Read it aloud before shipping.
Conversion (a site that doesn't convert is a failed build)
- Working forms are launch blockers. Every form must submit to a real backend (Formspree or equivalent), be test-submitted before delivery, and show an honest success state. Never ship a form that pretends to send. Never fake a confirmation message.
- Click-to-call on mobile for local businesses. Booking links where the client has a calendar.
- Analytics installed and verified firing before handover.
SEO (baked in, not sprinkled on)
- Unique, keyword-bearing title (≤60 chars) and meta description (~150 chars) per page.
- Exactly one H1 per page that says what the page is, not just a slogan. Logical H2/H3 order.
- Schema: Organization + WebSite sitewide; LocalBusiness for local clients; Service, FAQ, Article where relevant. Validate with Google's Rich Results test.
- sitemap.xml and robots.txt generated and correct. Canonical tags on every page; if any content exists at more than one URL, exactly one canonical version, everywhere.
- Real prerendered HTML for every route: crawlers must see content without executing JavaScript.
Lessons already paid for (from our own site audit)
These exact mistakes were found on llamamakers.com itself, so check for them on every client build: forms with no backend showing fake success screens; a key page missing from prerender and sitemap; duplicate page variants all self-canonicalizing; fonts loaded with display=block causing invisible text; hardcoded dates in schema. Each one is on the QA list below because we have been burned by it.
The stack, in plain terms
| Layer | What we use | Why |
|---|---|---|
| Framework | Next.js (React) + TypeScript, static export | Hand-coded control, blazing static output, no server to babysit |
| Styling | Tailwind CSS v4 | Fast to build, consistent spacing/type scales, tiny output |
| Motion | framer-motion + curated components (shadcn, 21st.dev) | Premium feel without hand-rolling physics |
| Forms | Formspree (or client's backend) | Reliable lead capture on static hosting |
| Hosting | Hostinger (client's plan or ours) | Cheap, fast enough with CDN, easy handover |
| Starting point | F:\Burney's Websites Starter Kit (copy per project; never build inside the kit) | SEO scaffolding, animations, and config-driven metadata prewired |
Tooling safety rule
Audit anything before installing it (packages, components, skills). Install with scripts disabled where possible, verify afterwards. One compromised dependency can poison every client site we ship.
QA gate: the pre-delivery checklist
Print this. Every item checked on every site. "It's probably fine" is not a checkbox.
Functionality
- Every form test-submitted; the submission actually arrived (check the inbox/endpoint, not just the success screen).
- Every nav link, footer link, button, and in-copy link clicked. No dead ends, no wrong destinations, no links that silently change context on the visitor.
- Mobile menu opens, closes, and navigates on a real phone-sized viewport.
- Interactive elements (sliders, accordions, calculators, easter eggs) exercised by hand.
- 404 handling: a wrong URL shows something sane, not a crash or a blank page.
Layout
- Checked at 360px, 390px, 768px, 1280px, 1440px+ widths. Nothing overflows, overlaps, or hides content.
- Floating elements (chat bubbles, sticky CTAs) never cover headings or buttons on small screens.
- Text contrast passes WCAG AA (4.5:1 for body, 3:1 for large text), including small labels and badges.
- Images sharp at their rendered size; no stretching, no repeats sitewide.
Performance
- Lighthouse run on the built output: Performance, SEO, Accessibility, Best Practices all green (90+).
- First contentful paint under our target on a mid-range connection; fonts swap, never block invisible.
- Total JS kept lean; no library shipped for a feature that CSS could do.
SEO & metadata
- View-source check on key pages: real HTML content present, unique title + description, one H1, canonical correct.
- Schema validates in the Rich Results test. No hardcoded dates, no fake reviews or ratings, no schema pointing at features that don't exist.
- sitemap.xml lists exactly the pages that should rank (no duplicates), robots.txt references it.
- Open Graph title/description/image set, link preview tested.
Content
- No lorem ipsum, no placeholder phone numbers or emails, no TODO comments, no emojis.
- Client's real business details verified: name, phone, email, address, hours, prices.
- Copy read aloud once. Anything that sounds like a template rewritten.
Launch
- Static export builds clean. Uploaded to hosting, domain pointed, SSL live, www and non-www both resolve to one canonical host.
- Google Search Console verified, sitemap submitted. Analytics events firing.
- Post-launch smoke test on the LIVE domain (not just the preview): forms, speed, mobile.
- Handover pack sent, final invoice issued, care-plan conversation had.