Website Operations Playbook
The complete 20-step linear workflow for how we build, QA, launch, and hand off every client website at Dotcom Design. Every step must be completed in order. No step may be skipped.
How This Playbook Works
This is a linear workflow. Each step has an Entry Condition (what must be true before you start) and a Completion Gate (the exact deliverables that must exist before you move forward). You cannot enter a step until its Entry Condition is met. You cannot leave a step until its Completion Gate is satisfied. This is not a reference wiki — it is a play-by-play that enforces quality at every handoff.
The 20-Step Workflow
| # | Step | Phase | Time |
|---|---|---|---|
| 1 | Kickoff Call | Intake | 45 min |
| 2 | Content Scraping | Intake | 30 min |
| 3 | Domain & Hosting Intake | Intake | 15 min |
| 4 | SEO Strategy | Intake | 5 min |
| 5 | Brief Preparation | Build | 30 min |
| 6 | Site Build | Build | 2–4 hrs |
| 7 | Visual QA | QA | 30 min |
| 8 | Technical QA | QA | 20 min |
| 9 | SEO Readiness Audit | QA | 20 min |
| 10 | Performance Optimization | QA | 30 min |
| 11 | AI Friendliness Audit | QA | 15 min |
| 12 | Content QA | Review | 20 min |
| 13 | Deploy to Preview | Review | 15 min |
| 14 | Client Review | Review | 48 hr window |
| 15 | Revisions | Launch | 1–2 hrs |
| 16 | Go Live | Launch | 30 min |
| 17 | Post-Launch Monitoring | Launch | 30 min |
| 18 | GBP Sync | Handoff | 20 min |
| 19 | Quarterback Handoff | Handoff | 15 min |
| 20 | Ongoing Maintenance | Handoff | Ongoing |
Step 1: Kickoff Call
- Signed contract received from the client
- Client contact name, phone, and email confirmed
- Kickoff call scheduled and confirmed with client
The kickoff call is the foundation of every build. Everything that follows — the brief, the build, the SEO strategy — depends on the quality of information gathered here. The call should run 45 minutes. Do not rush it. A thorough kickoff prevents revision loops later.
Before the Call
Look up the client's existing website (if they have one) and spend 10 minutes reviewing it. Note the services they list, the cities they mention, and any obvious gaps or outdated content. This preparation allows you to ask better questions and catch inconsistencies during the call.
Call Structure (45 Minutes)
| Time | Topic | What to Capture |
|---|---|---|
| 0–5 min | Introductions & overview | Confirm contact info, confirm timeline expectations |
| 5–15 min | Business overview | Exact business name, years in business, number of employees, license numbers, service area, HQ city |
| 15–25 min | Services | Complete list of every service offered, primary vs. secondary services, services they want to emphasize |
| 25–35 min | Design direction | Design slider scores (see below), reference sites they like, colors or fonts they prefer, logo files |
| 35–45 min | Content & logistics | Photos available, testimonials/reviews, team bios, special offers, any content they want to keep from old site |
Design Sliders
Ask the client to score each slider from 1 to 10. These scores directly inform the build prompt in Step 5. Record all six scores.
| Slider | 1 (Left) | 10 (Right) |
|---|---|---|
| Style | Classic / Traditional | Modern / Contemporary |
| Tone | Light & Airy | Dark & Bold |
| Complexity | Simple & Clean | Rich & Layered |
| Voice | Friendly & Approachable | Authoritative & Expert |
| Market Position | Economical & Accessible | Premium & Exclusive |
| Aesthetic | Polished & Refined | Gritty & Industrial |
Client Brief Fields
Every field in the client brief must be filled before leaving this step. Do not leave any field blank. If the client does not know the answer, note "TBD — follow up" and schedule a follow-up before Step 5.
| Field | Notes |
|---|---|
| Business name (exact) | As it appears on their license and Google Business Profile |
| Phone number | Primary contact number for the website |
| Address | Full street address including ZIP |
| Business hours | Day-by-day, including holiday exceptions if known |
| Service area | Cities, counties, or radius served |
| Services list | Complete list, ordered by importance |
| Years in business | Used in trust signals and schema |
| License numbers | Contractor license, bonding, insurance — whatever applies |
| Design slider scores | All six sliders, 1–10 |
| Reference site URL | A site they like the look of (optional but valuable) |
| Logo files | Request PNG or SVG; note if unavailable |
| Photos available | Yes/No and approximate count |
| Testimonials/reviews | Count and source (Google, Yelp, etc.) |
- Client brief fully populated — all fields filled or marked TBD with follow-up scheduled
- All six design slider scores recorded
- Reference site URL noted (or confirmed not applicable)
- Logo files received or follow-up scheduled
- Photos status confirmed (available count or "client will send")
Step 2: Content Scraping & Site Inventory
- Step 1 Completion Gate satisfied
- Client's existing website URL confirmed (if they have one)
- Manus task open and ready
If the client has an existing website, use Manus to extract all usable content before it is replaced. This step ensures no copy, imagery, or data is lost during the transition. Even a poorly designed old site often contains accurate business information that would take hours to re-gather.
Manus Scrape Prompt
Open a Manus task and submit the following prompt, replacing the URL with the client's actual site:
Please scrape the following website and extract all content for a rebuild:
[CLIENT WEBSITE URL]
Extract and organize the following:
1. All page copy (home, about, services, contact, and any other pages)
2. All images — download and save as WebP where possible
3. Logo files — save as PNG and SVG if available
4. Business information: name, phone, address, hours, service area
5. All existing services and service descriptions
6. Any testimonials or reviews displayed on the site
7. Team member names and bios
8. Any license numbers, certifications, or trust badges
9. Existing page structure (list all pages found)
10. Any existing integrations (contact forms, chat widgets, booking tools)
Organize everything into a folder called /assets/ and provide a summary
of what was found and what was missing or inaccessible.
What to Do With the Output
Review the Manus output carefully. Cross-reference the extracted business information against the client brief from Step 1. Any discrepancies — different phone numbers, different service lists, different addresses — must be resolved with the client before Step 5. Do not assume the website is correct; the client brief takes precedence.
If the Client Has No Existing Website
If this is a brand-new website with no existing site to scrape, skip the Manus scrape. Instead, use the client brief from Step 1 as the sole content source. Note in the brief that no existing site was available. Proceed directly to Step 3.
Site Inventory Checklist
| Item | Found? | Notes |
|---|---|---|
| All page copy | Yes / No / Partial | Note any pages that were blocked or inaccessible |
| Images | Yes / No / Partial | Note count and quality |
| Logo files | Yes / No | Note format (PNG, SVG, JPG) |
| Business info (NAP) | Yes / No | Cross-reference against client brief |
| Services list | Yes / No / Partial | Note any services on old site not in brief |
| Testimonials | Yes / No | Note count |
| Team info | Yes / No | Names, titles, bios |
| License/cert numbers | Yes / No | Verify against brief |
| Existing integrations | Yes / No | Note any to replicate |
- All extractable content saved to /assets/ folder in Manus task
- Site inventory checklist completed
- Discrepancies between old site and client brief identified and flagged for resolution
- Client brief updated with any new information found during scrape
Step 3: Domain & Hosting Intake
- Step 2 Completion Gate satisfied
- Client contact available to provide or look up credentials
Before any build work begins, you need access to the client's domain registrar. DNS changes are required at launch (Step 16), and discovering access problems on launch day creates delays and client frustration. Resolve access now, while there is time to recover.
Domain Registrar Access
Ask the client: "Who manages your domain — where did you originally register it?" Common registrars include GoDaddy, Namecheap, Google Domains (now Squarespace), Network Solutions, and Bluehost. Once identified, the client needs to either share login credentials or add you as an authorized user.
What to Document
| Item | Where to Find It | Why It Matters |
|---|---|---|
| Domain registrar name | Client provides; or run whois clientdomain.com | Tells you where to make DNS changes at launch |
| Registrar login credentials | Client provides | Required to add DNS records at launch |
| Current nameservers | Registrar DNS settings | Determines if DNS is managed at registrar or elsewhere (e.g., Cloudflare) |
| Current DNS records | Registrar DNS settings | Document all existing A, CNAME, MX, TXT records before making changes |
| Domain expiration date | Registrar dashboard | Alert client if domain expires within 90 days |
| Current hosting provider | Client provides or DNS lookup | Needed to understand what will be replaced |
If the Client Uses Cloudflare
Some clients already have their domain on Cloudflare. If so, the DNS changes at launch are made in the Cloudflare dashboard instead of the registrar. Confirm whether Cloudflare is being used and document the login credentials accordingly.
New Domains
If the client does not have a domain yet, register one on their behalf through Namecheap or Cloudflare Registrar. Use the client's business name as the basis for the domain. Confirm the domain with the client before purchasing. Document the registrar login credentials immediately after registration.
- Domain registrar identified and documented
- Registrar login credentials confirmed and accessible
- Current DNS records documented (screenshot or text copy)
- Domain expiration date noted; client alerted if within 90 days
Step 4: SEO Strategy
- Step 3 Completion Gate satisfied
- Client website URL available (existing site or confirmed new domain)
- Client's plan level confirmed (SEO Booster, Plan A, Plan B, etc.)
The SEO strategy produces the keyword-city matrix that drives the site architecture. Every service page and location page built in Step 6 corresponds to a row in this matrix. The strategy must be completed before the build begins — it is not optional and it is not done after the fact.
How to Run the SEO Strategy
Navigate to the SEO Portal at seo.dotcomdesignops.com and click "Build New Strategy." Enter the client's website URL and plan level. The system will run automatically and produce a live strategy site within 5 minutes. The full process is documented in the SEO Operations Playbook.
What the Strategy Produces
| Output | What It Is | How It's Used |
|---|---|---|
| Keyword-city matrix | A grid of selected keywords x selected markets | Pasted directly into Section 7 of the build prompt in Step 5 |
| Live strategy site URL | A branded client-facing site at seo-strategy.dotcomdesign.com/{domain} | Shared with client to show what pages will be built and why |
| Selected keywords | The 1–5 keywords chosen for this client | Used to name service pages and write meta titles |
| Selected markets | The cities targeted in the strategy | Used to name location pages and write meta titles |
Plan Levels Reference
| Plan | Price | Combinations |
|---|---|---|
| SEO Booster | $399/mo | 10 |
| Plan A | $600/mo | 20 |
| Plan B | $900/mo | 30 |
| Plan C | $1,200/mo | 40 |
| Plan D | $1,600/mo | 50 |
| Plan E | $2,000/mo | 60 |
- Keyword-city matrix generated with correct combination count for the plan level
- Live strategy site URL saved to the client brief
- Matrix copied and ready to paste into the build prompt
Step 5: Brief Preparation
- Steps 1–4 Completion Gates all satisfied
- Client brief fully populated
- Keyword-city matrix ready to paste
- Logo files and any available photos on hand
The build brief is the single document that drives the entire Manus build session. A well-written brief produces a site that needs minimal revision. A vague or incomplete brief produces a site that requires multiple revision loops. Invest the time here — it pays back tenfold in Step 6.
Brief Anatomy
The brief has eight required sections. Every section must be completed before opening the Manus build task. Do not start the build with a partial brief.
| # | Section | What Goes Here |
|---|---|---|
| 1 | Business Identity | Exact business name, phone, address, hours, years in business, license numbers |
| 2 | Service Area | Primary city, all cities/counties served, HQ city |
| 3 | Services | Complete ordered list of all services; note primary vs. secondary |
| 4 | Design Direction | All six slider scores, reference site URL, any specific color or font preferences |
| 5 | Content Assets | Logo file location, photo count and source, testimonials text, team info |
| 6 | Trust Signals | Years in business, license numbers, certifications, awards, associations |
| 7 | SEO Matrix | Full keyword-city matrix pasted from Step 4 |
| 8 | Special Instructions | Anything unique to this client: specific pages requested, content to keep, integrations needed |
AI Friendliness Data Requirements
The following data points must be collected during the KO call or from the client before the brief is written. These are required to pass the AI Friendliness audit at Step 11 without any rework. If any of these are missing, the brief is incomplete.
| Data Point | Used For | Where to Collect |
|---|---|---|
| Years in business | Statistics Presence (Factor 1) | KO call or existing website |
| Number of jobs/projects completed | Statistics Presence (Factor 1) | KO call — ask directly |
| Warranty length (if applicable) | Statistics Presence (Factor 1) | KO call or service documentation |
| Response time (e.g., "same-day estimates") | Statistics Presence (Factor 1) | KO call |
| BBB profile URL | Citation Presence (Factor 2) | Search BBB.org for the business |
| Google Business Profile URL | Citation Presence (Factor 2) | Google Maps search |
| License number(s) | Citation Presence (Factor 2) + Trust | KO call or state licensing board |
| Industry association membership (NARI, NAHB, etc.) | Citation Presence (Factor 2) | KO call |
| Full NAP (Name, Address, Phone) | Schema + Front-Loaded Info (Factors 7, 9) | KO form |
| Business hours | Schema (Factor 9) | KO form |
| Geo coordinates | Schema (Factor 9) | Google Maps — look up the address |
| FAQ questions (4+ per page) | FAQ Structure (Factor 12) | KO call or generate from service type |
Build Prompt Template
See the Build Prompt Template in the Appendix for the full fill-in template. Copy it, fill in every field, and use it as the opening message in your Manus build task.
Opening the Manus Task
Before submitting the brief, read the Multi-Agent Workflow page in the Appendix. It contains the exact opening prompt to paste at the start of every Manus build session, which loads the correct skills and sets the right context before the brief is submitted.
- All eight brief sections completed — no blank fields
- SEO matrix pasted into Section 7
- AI Friendliness data requirements table fully populated (years in business, job count, BBB URL, GBP URL, license numbers, FAQ questions)
- Build prompt template filled and ready to submit
- Manus task opened with the correct opening prompt
Step 6: Site Build
- Step 5 Completion Gate satisfied
- Build brief submitted to Manus and acknowledged
- All eight brief sections confirmed complete
The site build is executed entirely inside Manus using the static site stack (HTML, CSS, vanilla JS). Manus builds the full site based on the brief. Your role during the build is to review output as it comes in, catch issues early, and provide corrections before the full site is assembled.
Build Stack
All client websites are built as static HTML/CSS/JS sites deployed to Cloudflare Pages. This is the only acceptable stack. Do not use WordPress, Webflow, Squarespace, Wix, or any other CMS. Do not use React, Vue, or any JavaScript framework. The site must be pure static HTML.
| Layer | Technology | Notes |
|---|---|---|
| Markup | HTML5 (semantic) | Use proper heading hierarchy, landmark elements, ARIA labels |
| Styling | CSS3 (no frameworks) | No Bootstrap, no Tailwind — hand-written CSS only |
| Interactivity | Vanilla JavaScript | No jQuery, no React — plain JS only |
| Images | WebP format | All images must be converted to WebP before deployment |
| Fonts | Self-hosted or Google Fonts | No Adobe Fonts — use Google Fonts CDN or self-host |
| Hosting | Cloudflare Pages | All sites deploy to Cloudflare Pages via GitHub repo |
| DNS | Cloudflare DNS | All domains use Cloudflare for DNS management |
| Forms | Formspree | All contact forms use Formspree for submission handling |
Required Pages
Every site must include the following pages at minimum. Additional pages are added based on the SEO matrix from Step 4.
| Page | Required? | Notes |
|---|---|---|
Home (/) | Always | Full homepage with hero, services overview, trust signals, CTA |
About (/about) | Always | Company story, team, years in business, mission |
Contact (/contact) | Always | Contact form, phone, address, map embed, hours |
| Service pages | Per matrix | One page per keyword in the SEO matrix (e.g., /roofing) |
| Location pages | Per matrix | One page per city in the SEO matrix (e.g., /omaha-ne) |
Gallery (/gallery) | If photos available | Required if client has 6+ photos; skip if no photos |
Homepage SOP
The homepage must contain all of the following sections in this order. Manus will build them — this list is your review checklist.
- Navigation bar — Logo, all main nav links, phone number as a CTA button. Must be sticky on scroll.
- Hero section — Headline with primary keyword, subheadline, primary CTA button (phone), secondary CTA (contact form). Background image or strong visual.
- Trust bar — Years in business, license number, service area, key differentiators. Displayed as icon + stat pairs.
- Services overview — Grid of service cards. Each card links to the corresponding service page.
- About teaser — 2–3 sentences about the company, photo of owner or team, link to full About page.
- Gallery teaser — 3–6 photos in a grid. Link to full Gallery page. Skip if no photos available.
- Testimonials — 3–5 testimonials. Star ratings if available. Source attribution (Google, etc.).
- Service area map or list — Either an embedded Google Map or a list of cities served.
- Contact CTA section — Final call to action with phone number and link to contact form.
- Footer — Logo, nav links, phone, address, hours, copyright, license number.
Mobile SOP
Every page must be fully responsive. The following mobile-specific requirements apply to every build. These are not optional — they are checked in Step 7 (Visual QA).
| Requirement | Standard |
|---|---|
| Breakpoints | Mobile: 375px, Tablet: 768px, Desktop: 1200px. Test at all three. |
| Navigation | Hamburger menu on mobile. Menu must open as a full overlay or slide-in drawer. All nav links must be tappable (min 44px touch target). |
| Sticky call bar | A fixed bottom bar on mobile with the phone number as a tap-to-call button. Required on every page. Height: 56px minimum. |
| Font sizes | Body: min 16px on mobile. Headings scale down proportionally. Never below 14px for any readable text. |
| Images | All images use width: 100% and height: auto on mobile. No horizontal overflow. |
| Forms | All form inputs min 44px height. Labels above inputs (not placeholder-only). Submit button full-width on mobile. |
| Tables | Tables must scroll horizontally on mobile or reformat to stacked layout. No horizontal page overflow from tables. |
| Touch targets | All interactive elements (buttons, links, nav items) must have a minimum 44×44px touch target. |
| No horizontal scroll | The page must not scroll horizontally on any mobile viewport. Check with Chrome DevTools. |
Mobile Excellence SOP
The Mobile SOP above defines the minimum requirements. The Mobile Excellence SOP defines what it means for a site to actually function like a mobile website — not just one that fits on a phone. Every build must meet both the minimum SOP and the excellence standard. Manus must apply these without being asked.
| Area | Minimum (Mobile SOP) | Excellence Standard (required) |
|---|---|---|
| Navigation | Hamburger menu opens | Primary actions (Call, Contact) placed in the bottom 40% of the screen — within thumb reach. Nav overlay closes on link tap. Active page is highlighted. No more than 5 nav items. |
| Typography | Body min 16px | Line length max 70 characters on mobile. No paragraph walls — break copy into 2–3 sentence chunks. Headings use a display font; body uses a legible serif or sans-serif. Never use a single font for both. |
| Hero images | 100% width, auto height | Hero images are art-directed for mobile: the subject is centered and visible at 375px width. Do not simply scale down a landscape desktop hero. Use object-position: center top or a dedicated mobile crop when the desktop composition fails at narrow widths. |
| Sticky call bar | Present, 56px height | The call bar is the dominant CTA on mobile. It must use the brand primary color background with white text and a phone icon. It must not overlap page content — add padding-bottom: 72px to the page body on mobile. The phone number must be a live tel: link. |
| Forms | 44px inputs, labels above | Single-column layout only on mobile. Submit button is full-width and uses the brand primary color. Success message replaces the form on submission — do not redirect to a blank confirmation page. |
| Testimonials | Display on page | Testimonials are a horizontal swipe carousel on mobile — one testimonial visible at a time. Use CSS scroll-snap. Show dot indicators. Do not stack testimonials vertically on mobile. |
| Touch feedback | 44px touch targets | All buttons and links show a visible active state on tap (background color change or scale transform). Use :active CSS pseudo-class. No ghost taps or invisible interactions. |
| Spacing | No overflow | Use a consistent spacing scale: 8px, 16px, 24px, 40px, 64px. Section padding on mobile is 40px top/bottom minimum. No section should feel cramped or have inconsistent vertical rhythm. |
| Service cards | Display in grid | On mobile, service cards stack to a single column. Each card has a minimum height of 120px, an icon or image, a title, and a one-line description. Cards must have a visible tap state. |
| Stats/counters | Display on page | Stats bar reflows to a 2x2 grid on mobile (not a horizontal scroll). Each stat number is min 28px so it reads without zooming. |
Interior Page SOP
All service pages and location pages follow the same interior page structure. Manus builds these automatically from the SEO matrix. Review each one against this structure. Interior pages must also meet the visual design standards below — a page that passes the structure checklist but looks like a plain text document is not acceptable.
- Page hero — H1 with the exact keyword + city (e.g., "Roofing Contractor in Omaha, NE"). Subheadline. CTA button. Hero must use a relevant, high-quality image specific to the service — not a generic stock photo. The image must show the actual type of work (e.g., a masonry photo for a masonry page, not a generic construction worker).
- Intro section — 2–3 paragraphs of unique copy about this service or location. Must not be copied from another page. Copy must be broken into short paragraphs — no walls of text.
- Services list — Styled cards or icon+text pairs, not a plain bulleted list. Each item has a short title and 1–2 sentence description. Minimum 3 items.
- Why choose us — 3–4 differentiators in a visually distinct layout (icon grid, numbered list with large numbers, or alternating image/text). Must not look identical to the services list.
- Gallery or photo — At least one relevant image. Use a gallery if photos are available. Images must have descriptive alt text.
- Testimonial — At least one testimonial in a styled blockquote or card. Include star rating, reviewer name, and source (Google, etc.). Must not be plain text.
- Contact CTA — A visually distinct section with brand background color, phone number in large type, and a button linking to the contact form. Must not be a plain paragraph.
- FAQ section — 3–5 FAQs in a styled accordion (not a plain list). Each question is a clickable toggle. These become FAQ schema in Step 9.
- Internal links — At least 2 links to related service pages or location pages, styled as text links or a "Related Services" card row.
Gallery SOP
If the client has 6 or more photos, a gallery page is required. The gallery must meet the following standards.
| Requirement | Standard |
|---|---|
| Image format | All images converted to WebP before upload |
| Grid layout | 2-column on mobile, 3-column on tablet, 4-column on desktop |
| Lightbox | Clicking an image opens a full-screen lightbox with prev/next navigation |
| Alt text | Every image must have descriptive alt text including the business name and service type |
| Lazy loading | All gallery images use loading="lazy" |
| Captions | Optional but recommended if client can provide project descriptions |
AI Friendliness Build Requirements
Every site must score 32/32 on the DD AI Audit Tool at launch. This is not a target — it is the standard. These 32 requirements are build requirements, not audit items. Implement every one during the initial build so the audit at Step 11 is a confirmation pass, not a rework session. The only documented exception is the readability factor (Flesch-Kincaid), which may score partial due to trade terminology — this is acceptable and expected.
Pillar 1: Technical Infrastructure (7 factors)
| # | Factor | Build Requirement |
|---|---|---|
| 1 | AI Crawler Allow-listing | robots.txt must explicitly allow GPTBot, ClaudeBot, PerplexityBot, GoogleOther, and Anthropic-AI. No noindex on any service page. |
| 2 | Server-Side Rendering | All content must be in the initial HTML payload. No JavaScript-only rendering. Critical text must be visible without JS. Use static HTML/CSS — not React or Vue. |
| 3 | Mobile Page Speed | Target 90+ PageSpeed mobile score. Use WebP images with explicit width/height. Inline critical CSS. Self-host fonts. All scripts use defer or async. |
| 4 | HTTPS | Cloudflare Pages provides HTTPS automatically. Verify the padlock is present before delivery. |
| 5 | XML Sitemap | sitemap.xml must exist at /sitemap.xml listing all pages. Add Sitemap: https://[domain]/sitemap.xml to robots.txt. |
| 6 | Render-Blocking Resources | All scripts use defer or async. No synchronous third-party scripts in <head>. No @import in CSS. |
| 7 | Internal Linking | All links use proper href URLs. Use <button> for JS actions, <a href> for navigation only. No javascript:void() links. |
Pillar 2: Content Structure & Extractability (12 factors)
| # | Factor | Build Requirement |
|---|---|---|
| 8 | Answer-First Structure | Every section opens with a direct declarative statement. "We build brick, block, and concrete structures" — not "Are you looking for a contractor?" |
| 9 | Heading Hierarchy | Exactly one H1 per page. H2 for sections. H3 for sub-items. Never skip levels. Never use H1 for decorative text. |
| 10 | Data-Driven Statistics | Use real numbers from the client brief on every page. Never write "years of experience" without the number. Include: years in business, projects completed, response time, service count. |
| 11 | Numbered Lists for Processes | All "How It Works" and step-by-step content must use <ol><li> tags. Never use plain paragraph text for sequential steps. |
| 12 | Bullet Points for Features | All feature lists, service benefits, and key characteristics must use <ul><li> tags. Minimum 2 lists per page with 4+ items each. |
| 13 | Comparison Tables | At least one HTML <table> per site (service comparison, material options, or pricing tiers). Use proper <thead>/<tbody>/<th>/<td> markup. |
| 14 | Short Paragraphs | All paragraphs must be 2-4 sentences maximum. One idea per paragraph. Use subheadings to break up long sections. No walls of text. |
| 15 | Executive Summaries | Homepage and service pages must include a "Quick Facts" or "At a Glance" section near the top: who, what, where, why — in 3-5 bullet points. |
| 16 | FAQ Sections | Every page must have a FAQ section with minimum 5 questions as H2/H3 headings with direct answers. Apply FAQPage JSON-LD schema. Questions must be natural language. |
| 17 | Active Voice | Write "We install" not "Installation is provided." Write "Call us" not "We can be reached by calling." Review all copy before delivery. |
| 18 | Clear Definitions | First paragraph of every service page must define the service in plain language. Example: "Tuckpointing is the process of removing damaged mortar from brick joints and replacing it with fresh mortar." |
| 19 | Comprehensive Service Details | All services, specialties, service area (list every city/county), and credentials must appear in plain HTML text — not images or JavaScript-rendered content. |
Pillar 3: Entity & Authority Signals (8 factors)
| # | Factor | Build Requirement |
|---|---|---|
| 20 | Schema Markup | Required JSON-LD on every page: LocalBusiness/Contractor with ALL fields (name, address, phone, geo lat/lng, hours, priceRange, areaServed, url, sameAs, datePublished, dateModified). FAQPage on every page with FAQs. BreadcrumbList on all interior pages. |
| 21 | Author Profiles | About page must include owner name, photo, years of experience, credentials, and personal story. Required for E-E-A-T. |
| 22 | Author Schema (Person) | Person JSON-LD for the business owner: name, job title, description, sameAs (social profiles). Add to About page and homepage schema. |
| 23 | Citations & External Links | Every page must include 2+ external links to authoritative sources. Use BBB, GBP, licensing board, industry association, or manufacturer spec URLs from the client brief. |
| 24 | Text-Based Trust Signals | All trust signals must appear as explicit HTML text — not badge images only. Write out: "Licensed & Insured", "BBB Accredited", "25 Years in Business". |
| 25 | Content Freshness | Schema must include datePublished and dateModified set to today's date. Footer copyright year must be current year (use JS to auto-update). |
| 26 | Consistent NAP | Business name, full street address, city/state/ZIP, and phone number must appear in plain HTML text in the footer of every page. Must match Google Business Profile exactly. |
| 27 | Expert Quotes | At least one direct quote from the business owner or lead craftsman on key pages. Attribute with name and title. Use <blockquote> markup. |
Pillar 4: Strategic AI Assets (5 factors)
| # | Factor | Build Requirement |
|---|---|---|
| 28 | llms.txt File | Create /llms.txt with plain markdown: business name, description, all services, full service area, contact info, hours, and FAQs. See the llms.txt template in Step 11. |
| 29 | AI Disclosure Page | Create an /ai page with comprehensive brand summary: all services with descriptions, full service area list, team bios, FAQs, and brand voice. Link in footer as "AI Info". |
| 30 | Competitor Comparison | "Why Choose Us" section on homepage explicitly stating differentiators: years of experience, warranty, response time, local ownership, specific techniques or materials used. |
| 31 | Video Transcripts | If the site has embedded videos, all key information must also appear as text on the page. Mark as N/A in audit notes if no videos are present. |
| 32 | AI Attribution in Forms | Contact form must include a "How did you find us?" dropdown with "AI Chatbot / AI Assistant" as one of the options. This tracks AI-driven leads. |
W3C & WAVE Build Requirements
Every site must be built to pass W3C HTML validation and WAVE accessibility with zero errors from the first build. These are not audit items — they are build standards. Writing valid, accessible HTML from the start eliminates rework at Step 10.
| Requirement | Build Rule |
|---|---|
| HTML lang attribute | Every page must have <html lang="en"> |
| Image alt text | Every <img> must have a descriptive alt attribute — never empty, never "image" or "photo" |
| Form labels | Every <input>, <select>, and <textarea> must have an associated <label for=""> — not placeholder-only |
| Heading hierarchy | Exactly one H1 per page. H2 for sections. H3 for sub-items. Never skip levels. |
| No duplicate IDs | Every id attribute must be unique within the page |
| Button accessibility | All <button> elements must have descriptive visible text or an aria-label |
| Focus states | Never use outline: none without providing an alternative focus indicator |
| Color contrast | All text must meet WCAG AA: 4.5:1 ratio for normal text, 3:1 for large text (>18px bold or >24px regular) |
| Semantic landmarks | Every page must use <header>, <main>, <footer>, and <nav aria-label="..."> |
| Skip navigation | Add <a href="#main-content" class="skip-link">Skip to main content</a> as the first element in <body> |
| No deprecated elements | Never use <center>, <font>, <b>/<i> for styling |
| Valid HTML structure | All elements properly opened and closed. No stray tags. |
SEO Build Requirements
All SEO elements must be implemented during the initial build. Step 9 is a confirmation pass — not a discovery pass. Every item below must be in place before the site is considered built.
| Element | Build Requirement |
|---|---|
| Meta title | Every page: [Primary Keyword] in [City] | [Business Name] — max 60 characters |
| Meta description | Every page: includes keyword, city, phone number — 150-160 characters |
| Canonical tag | Every page: <link rel="canonical" href="https://[domain]/[page]"> |
| Open Graph tags | Every page: og:title, og:description, og:image, og:url |
| H1 keyword | Every page H1 must include the target keyword for that page |
| URL slugs | Service pages: /roofing not /services/roofing-services-page. Location pages: /roofing-omaha-ne |
| Image file names | Descriptive: brick-retaining-wall-omaha.webp not IMG_1234.webp |
| Internal linking | Every service page links to at least 2 related pages. Homepage links to all primary service pages. |
| LocalBusiness schema | On every page: name, telephone, email, address, geo, openingHours, areaServed, priceRange, hasOfferCatalog, datePublished, dateModified |
| FAQPage schema | On every page with a FAQ section: FAQPage JSON-LD with all Q&A pairs |
- All required pages built and accessible in the Manus preview
- Homepage contains all 10 required sections in correct order
- All service pages and location pages from the SEO matrix are built
- All images are in WebP format
- Sticky mobile call bar present on all pages
- No horizontal scroll on mobile viewports
- Contact form connected to Formspree and tested (submission received)
- robots.txt allows all 5 AI bots (GPTBot, ClaudeBot, PerplexityBot, GoogleOther, Anthropic-AI)
- sitemap.xml exists at /sitemap.xml and is referenced in robots.txt
- llms.txt exists at /llms.txt with complete business summary
- /ai disclosure page exists and is linked in footer
- Contact form includes "How did you find us?" dropdown with AI Chatbot option
- LocalBusiness JSON-LD schema on every page with all required fields including geo, datePublished, dateModified
- FAQPage schema on every page with a FAQ section
- Person schema for business owner on About page and homepage
- At least 2 external citation links per page (BBB, GBP, licensing board, or industry association)
- NAP (name, address, phone) in plain HTML text in footer of every page
- At least one expert quote with blockquote markup on key pages
- At least one HTML comparison table on the site
- All pages have exactly one H1, correct H2/H3 hierarchy, no skipped levels
- Every <img> has a descriptive alt attribute; every form input has an associated label
- All pages use semantic landmarks: <header>, <main>, <footer>, <nav aria-label>
- All meta titles, meta descriptions, canonical tags, and Open Graph tags in place on every page
Step 7: Visual QA
- Step 6 Completion Gate satisfied
- All pages accessible in Manus preview URL
- Chrome DevTools available for responsive testing
Visual QA is a systematic page-by-page review of the site at three viewports: mobile (375px), tablet (768px), and desktop (1200px). Every page is checked. No page is skipped. Issues found here are fixed before moving to Technical QA.
Visual QA Checklist — Every Page
Run this checklist on every page of the site. Check all three viewports for each item.
| Check | Pass Criteria |
|---|---|
| No horizontal scroll | Page does not overflow horizontally at 375px, 768px, or 1200px |
| Navigation renders correctly | Desktop nav shows full links; mobile shows hamburger that opens correctly |
| Sticky call bar visible on mobile | Fixed bottom bar with phone number visible on all mobile pages |
| All images load | No broken image icons; all images display correctly |
| All images are WebP | Right-click → Inspect → check src attribute ends in .webp |
| Text is readable | No text is white-on-white, black-on-black, or otherwise invisible |
| Font sizes appropriate | Body text ≥ 16px on mobile; headings scale proportionally |
| Buttons are tappable | All buttons ≥ 44×44px touch target |
| Links work | All navigation links, CTA buttons, and internal links go to the correct destination |
| Contact form visible | Form is present on Contact page and renders correctly on all viewports |
| Phone number is tap-to-call | Phone numbers are wrapped in <a href="tel:..."> links |
| Address links to Google Maps | Address wrapped in Google Maps link |
| Footer complete | Logo, nav, phone, address, hours, copyright, license number all present |
| No placeholder content | No "Lorem ipsum", "Your Business Name", or "[INSERT]" text anywhere |
| Logo displays correctly | Logo is crisp, correct size, not stretched or pixelated |
Homepage-Specific Checks
| Check | Pass Criteria |
|---|---|
| Hero headline contains primary keyword | H1 includes the main service keyword |
| Trust bar present | Years in business, license, service area displayed |
| All 10 homepage sections present | Cross-reference against the Homepage SOP in Step 6 |
| Counter animations work | Number counters animate when scrolled into view |
| Testimonials display | At least 3 testimonials visible with star ratings |
- All pages reviewed at 375px, 768px, and 1200px
- All Visual QA checklist items pass on all pages
- All issues found during review fixed and re-checked
- No placeholder content remaining anywhere on the site
Step 8: Technical QA
- Step 7 Completion Gate satisfied
- Site accessible at a live preview URL (Manus or Cloudflare Pages preview)
Technical QA checks the underlying code and infrastructure of the site — things that are invisible in a visual review but affect performance, accessibility, and search engine indexing. Run these checks against the live preview URL.
Technical QA Checklist
| Check | Tool | Pass Criteria |
|---|---|---|
| No broken links | Chrome DevTools Console | Zero 404 errors in the console on any page |
| No JavaScript errors | Chrome DevTools Console | Zero JS errors in the console on any page |
| Contact form submits | Manual test | Submit a test entry; confirm receipt in Formspree dashboard |
| robots.txt present | Navigate to /robots.txt | File exists and does not block all crawlers |
| sitemap.xml present | Navigate to /sitemap.xml | File exists and lists all pages |
| Canonical tags present | View source | Every page has a <link rel="canonical"> tag |
| Meta descriptions present | View source | Every page has a unique <meta name="description"> |
| Open Graph tags present | View source | og:title, og:description, og:image on every page |
| Favicon present | Browser tab | Favicon displays in browser tab |
| HTTPS enforced | Browser address bar | Site loads over HTTPS; no mixed content warnings |
| 404 page exists | Navigate to /nonexistent-page | Custom 404 page displays (not a blank page) |
| Images have alt text | View source or DevTools | Every <img> tag has a non-empty alt attribute |
| Heading hierarchy correct | View source | One H1 per page; H2s and H3s used in logical order |
- All Technical QA checklist items pass
- Zero console errors on all pages
- Contact form submission confirmed in Formspree
- robots.txt and sitemap.xml both present and valid
Step 9: SEO Readiness Audit
- Step 8 Completion Gate satisfied
- SEO matrix from Step 4 on hand for reference
The SEO readiness audit verifies that every on-page SEO element is correctly implemented before the site goes live. This is the last opportunity to catch missing schema, incorrect meta titles, or missing keywords before the site is indexed.
On-Page SEO Checklist
| Check | Pass Criteria |
|---|---|
| H1 contains primary keyword | Every page H1 includes the target keyword for that page |
| Meta title format | Format: [Keyword] in [City] | [Business Name] — max 60 characters |
| Meta description format | Includes keyword, city, phone number — 150–160 characters |
| URL slugs match keywords | Service pages: /roofing; Location pages: /roofing-omaha-ne |
| LocalBusiness schema present | JSON-LD schema block on every page with name, address, phone, geo, openingHours |
| FAQ schema present | FAQ JSON-LD on every service and location page (from FAQ sections built in Step 6) |
| Internal linking | Every service page links to at least 2 related location pages; every location page links to at least 2 service pages |
| NAP consistency | Business name, address, and phone number are identical on every page and match the Google Business Profile |
| Image alt text includes keywords | Hero and key images include the primary keyword in alt text |
| Page titles are unique | No two pages have the same meta title |
| Meta descriptions are unique | No two pages have the same meta description |
Schema Validation
After confirming schema is present in the source, validate it using Google's Rich Results Test at search.google.com/test/rich-results. Paste the preview URL and confirm no errors are returned for LocalBusiness and FAQ schema.
- All on-page SEO checklist items pass on all pages
- LocalBusiness schema validates without errors in Rich Results Test
- FAQ schema validates without errors on all service and location pages
- NAP is consistent across all pages and matches Google Business Profile
Step 10: Performance Optimization
- Step 9 Completion Gate satisfied
- Site accessible at a live preview URL
Run PageSpeed Insights on the homepage and at least two interior pages. The target score is 90+ on mobile and 95+ on desktop. If the score is below target, identify the failing items and fix them before proceeding.
PageSpeed Insights
Run the test at pagespeed.web.dev. Test the homepage, one service page, and one location page. Record all four scores (Performance, Accessibility, Best Practices, SEO) for each page.
Score Targets
| Category | Mobile Target | Desktop Target |
|---|---|---|
| Performance | ≥ 90 | ≥ 95 |
| Accessibility | ≥ 95 | ≥ 95 |
| Best Practices | ≥ 90 | ≥ 90 |
| SEO | ≥ 95 | ≥ 95 |
Common Performance Fixes
| Issue | Fix |
|---|---|
| Images not in WebP format | Convert all images to WebP using Manus or cwebp |
| Images not sized correctly | Resize images to the maximum display size before upload; use srcset for responsive images |
| Render-blocking resources | Move non-critical CSS to <link rel="preload">; defer non-critical JS |
| No lazy loading | Add loading="lazy" to all below-the-fold images |
| Large CSS file | Inline critical CSS in <style> in the <head>; load the rest asynchronously |
| Google Fonts blocking | Use display=swap parameter; preconnect to fonts.googleapis.com |
| No font preloading | Add <link rel="preload"> for the primary font file |
W3C HTML Validation
Every page must pass the W3C HTML Validator with zero errors. Warnings are acceptable; errors are not. Run validation on the live preview URL so the validator sees the exact HTML the browser receives.
| Check | Pass Standard |
|---|---|
| W3C Errors | 0 errors (warnings acceptable) |
| Duplicate IDs | No duplicate id attributes anywhere in the page |
| Unclosed tags | All HTML elements properly opened and closed |
| Deprecated elements | No <center>, <font>, <b>/<i> for styling |
| Lang attribute | <html lang="en"> on every page |
| Heading hierarchy | Exactly one H1 per page; H2/H3 in sequential order, no skipped levels |
WAVE Accessibility Audit
Every page must pass the WAVE WebAIM Accessibility Checker with zero errors and zero contrast errors. WAVE alerts (not errors) are acceptable. Run WAVE on the live preview URL.
| Check | Pass Standard |
|---|---|
| WAVE Errors | 0 errors |
| Contrast Errors | 0 contrast errors (WCAG AA: 4.5:1 normal text, 3:1 large text) |
| Missing alt text | Every <img> has a descriptive alt attribute |
| Form labels | Every <input>, <select>, <textarea> has an associated <label> |
| Button accessibility | All <button> elements have descriptive text or aria-label |
| Focus states | All interactive elements have visible focus rings (never outline: none) |
| Skip navigation | A "Skip to main content" link as the first focusable element on every page |
| ARIA landmarks | <header>, <main>, <footer>, <nav aria-label> on every page |
- Homepage scores: Performance ≥ 90 mobile / ≥ 95 desktop; all other categories ≥ 90
- At least two interior pages tested and meeting targets
- All PageSpeed scores recorded for the project record
- W3C HTML Validator: 0 errors on homepage and all interior pages
- WAVE: 0 errors and 0 contrast errors on homepage and all interior pages
Step 11: AI Friendliness Audit
- Step 10 Completion Gate satisfied
- Site accessible at a live preview URL
AI search engines (ChatGPT, Perplexity, Google AI Overviews) are increasingly the first point of discovery for local services. An AI-friendly site is structured so that AI systems can accurately extract and cite business information. This step ensures the site is optimized for AI discoverability in addition to traditional search.
AI Friendliness Checklist
| Check | Pass Criteria |
|---|---|
llms.txt present | File exists at /llms.txt and contains a plain-text summary of the business, services, and contact info |
| Structured data complete | LocalBusiness schema includes all fields: name, address, phone, geo coordinates, openingHours, priceRange, areaServed |
| Clear entity signals | Business name appears in H1 on the homepage; NAP appears in the footer of every page |
| Service descriptions are specific | Each service page describes the service in plain language without jargon; AI can extract what the business does |
| FAQ content is clear | FAQ questions are phrased as natural language questions; answers are concise and factual |
| No AI-blocking directives | robots.txt does not block GPTBot, PerplexityBot, or other AI crawlers |
| Author/entity attribution | About page clearly identifies the business owner or team |
AI Friendliness Score Audit
In addition to the manual checklist above, run the site through the Dotcom Design AI Friendliness Auditor at ai-audit.dotcomdesignops.com. This is DD's proprietary tool — it audits all 32 on-site AI Friendliness factors across 4 pillars, provides a pass/needs-work/fail verdict per factor, and generates actionable fix instructions. The score is reported as X/32 factors passing.
| Metric | Standard |
|---|---|
| Pass threshold | 32/32. This is the standard for every Dotcom Design build. Sites built following the full 32-factor build requirements in Step 6 should arrive at this audit already passing all factors. The only documented exception is the readability factor (Flesch-Kincaid), which may score partial due to trade terminology — this is acceptable and expected. |
| Secondary validator | Also run aifriendliness.com for live technical checks: actual PageSpeed score, real schema validation, Flesch-Kincaid calculation, and Core Web Vitals. The DD tool covers content and strategic factors; aifriendliness.com validates the technical layer with live site crawling. |
| Readability note | The DD tool does not use Flesch scoring. Content structure factors (Pillar 2) assess answer-first writing, short paragraphs, and active voice — not reading level. Write naturally in the client's trade voice; these factors will pass. |
| Fail action | If any factor shows FAIL (red), fix it before proceeding to Step 12. NEEDS WORK (yellow) factors should be resolved where possible. Document any intentional yellow items with a reason in the project notes. |
The 32 Factors — Build Requirements by Pillar
Every factor below must be addressed during the initial build in Steps 5–8. If the build brief, build prompt, and these requirements are followed, the site should pass all 32 factors at audit time with zero rework required. Run the full audit at ai-audit.dotcomdesignops.com.
🔧 Pillar 1: Technical Infrastructure (7 Factors)
| # | Factor | Build Requirement |
|---|---|---|
| 1 | AI Crawler Allow-listing | robots.txt must explicitly Allow: / for GPTBot, ClaudeBot, GoogleOther, Anthropic-AI, PerplexityBot. Never use Disallow for these agents. |
| 2 | Server-Side Rendering | All HTML/CSS static builds pass automatically. No JavaScript-only content rendering. Critical text must be in the initial HTML payload. |
| 3 | Mobile Page Speed | Target 90+ PageSpeed mobile score. Use WebP images with width/height attributes, inline critical CSS, self-hosted fonts, no render-blocking scripts. |
| 4 | HTTPS Security | Cloudflare Pages provides HTTPS automatically. Verify SSL is active before final delivery. |
| 5 | Clean XML Sitemap | sitemap.xml must exist at /sitemap.xml listing all pages. Reference it in robots.txt with Sitemap: directive. |
| 6 | Zero Render-Blocking Resources | All scripts use defer or async. CSS inlined for critical above-fold styles. No synchronous third-party scripts in <head>. |
| 7 | Clean Internal Linking | All links use proper href URLs. No javascript:void() links. Use <button> for JS actions, <a href> for navigation only. |
📝 Pillar 2: Content Structure & Extractability (12 Factors)
| # | Factor | Build Requirement |
|---|---|---|
| 8 | Answer-First Structure | Every section opens with a direct declarative statement. "We build brick, block, and concrete structures" — not "Are you looking for a contractor?" |
| 9 | Granular Heading Hierarchy | Exactly one H1 per page. H2 for main sections. H3 for sub-items. Never skip levels. Enforced in build prompt. |
| 10 | Data-Driven Statistics | Every page must include specific numbers: years in business, projects completed, service area radius, response time, satisfaction rate. Collect in KO form. |
| 11 | Numbered Lists for Processes | All "How It Works" and step-by-step content must use <ol><li> tags. Never use plain paragraph text for sequential steps. |
| 12 | Bullet Points for Features | All feature lists, service benefits, and key characteristics must use <ul><li> tags. Minimum 2 lists per page with 4+ items each. |
| 13 | Comparison Tables | At least one HTML <table> per site (service comparison, material options, or pricing tiers). Use proper <thead>/<tbody>/<th>/<td> markup. |
| 14 | Short Paragraphs | All paragraphs must be 2–4 sentences maximum. One idea per paragraph. Use subheadings to break up long sections. |
| 15 | Executive Summaries | Homepage and service pages must include a "Quick Facts" or "At a Glance" section near the top: who, what, where, why — in 3–5 bullet points. |
| 16 | FAQ Sections | Every page must have a FAQ section with minimum 5 questions as H2/H3 headings with direct answers. FAQPage JSON-LD schema required. |
| 17 | Active Voice | Write in active voice throughout. "We install" not "Installation is provided." Enforced in build prompt and copy review. |
| 18 | Clear Definitions | Each service page must define the service in plain language in the first paragraph. "Tuckpointing is the process of removing deteriorated mortar..." |
| 19 | Comprehensive Service Details | All services, specialties, service area (list every city/county), and credentials must appear in plain HTML text — not images or JavaScript. |
🏆 Pillar 3: Entity & Authority Signals (8 Factors)
| # | Factor | Build Requirement |
|---|---|---|
| 20 | Comprehensive Schema Markup | Required JSON-LD types: LocalBusiness/Contractor (all fields including geo, hours, areaServed), FAQPage on every FAQ section, BreadcrumbList on interior pages, Person for owner. |
| 21 | Author Profiles | About page must include owner name, photo, years of experience, credentials, and personal story. This establishes E-E-A-T for AI systems. |
| 22 | Author Schema (Person) | Person JSON-LD schema for the business owner: name, job title, description, and links to social profiles. Add to About page and homepage schema. |
| 23 | Citation of Primary Sources | Every page must include 2+ external links to authoritative sources: BBB profile, Angi listing, licensing body, industry association, or manufacturer specs. |
| 24 | Text-Based Trust Signals | All trust signals must appear as explicit HTML text — not badge images only. Write out: "Licensed & Insured", "BBB Accredited", "Member of [Association]", "25 Years in Business". |
| 25 | Content Freshness | Schema must include datePublished and dateModified. Footer copyright year must be current. Step 20 SOP: refresh dateModified every 6 months. |
| 26 | Consistent NAP | Business name, full street address, city/state/ZIP, and phone number must appear in plain HTML text in the footer of every page. Must match Google Business Profile exactly. |
| 27 | First-Party Expert Quotes | At least one direct quote from the business owner or lead craftsman on key pages. Attribute with name and title. Use <blockquote> markup. |
🤖 Pillar 4: Strategic AI Assets (5 Factors)
| # | Factor | Build Requirement |
|---|---|---|
| 28 | The llms.txt File | Create /llms.txt with plain markdown: business name, description, all services, full service area, contact info, hours, FAQs. See template below. |
| 29 | AI Disclosure Page | Create an /ai page with comprehensive brand summary: all services with descriptions, full service area list, team bios, FAQs, and brand voice. Link in footer. |
| 30 | Competitor Comparison | "Why Choose Us" section or page explicitly stating differentiators: years of experience, warranty, response time, local ownership, specific techniques. Required on homepage. |
| 31 | Video Transcript Integration | If the site has embedded videos, all key information must also appear as text on the page. AI cannot watch videos. N/A if no videos. |
| 32 | AI Attribution in Forms | Contact form must include a "How did you find us?" dropdown with "AI Chatbot / AI Assistant" as an option. Tracks AI-driven leads. |
llms.txt Template
Create a file at /llms.txt with the following structure, filled in for the client:
# [Business Name]
[Business Name] is a licensed [trade] contractor based in [City, State].
We serve [primary service area] and surrounding communities.
## Services
[List all services, one per line]
## Service Area
[List all cities served, one per line]
## Contact
Phone: [phone number]
Address: [full address]
Hours: [business hours]
Website: [domain]
## About
[2-3 sentences about the business: years in business, owner name, mission]
## License & Insurance
[License number, bonding status, insurance status]
- llms.txt present and populated at
/llms.txt - All AI Friendliness checklist items pass
- robots.txt confirmed to not block AI crawlers
- DD AI Audit at ai-audit.dotcomdesignops.com shows 32/32 (readability exception documented if applicable)
Step 12: Content QA
- Step 11 Completion Gate satisfied
- Client brief on hand for reference
Content QA is a final human review of all copy on the site before the client sees it. This step catches factual errors, tone inconsistencies, and AI-generated copy that sounds generic or inaccurate. You are reading every page — not skimming.
Content QA Checklist
| Check | Pass Criteria |
|---|---|
| Business name spelled correctly | Exact match to the signed contract and Google Business Profile |
| Phone number correct | Matches client brief; tap-to-call link uses correct digits |
| Address correct | Full address including ZIP matches client brief |
| Business hours correct | Day-by-day hours match client brief exactly |
| Services list accurate | All services from the brief are present; no services listed that were not in the brief |
| Service area accurate | All cities from the brief and SEO matrix are represented |
| License numbers correct | Numbers match client brief exactly |
| Years in business correct | Matches client brief; math is correct (founded year to current year) |
| Testimonials accurate | Testimonial text matches source; reviewer names correct |
| No factual claims that cannot be verified | Remove any claims like "#1 in the city" or "best in the state" unless client can verify |
| Tone matches slider scores | Copy tone aligns with the design slider scores from Step 1 |
| No generic filler copy | No "We are committed to excellence" type filler — all copy is specific to this business |
- All Content QA checklist items pass
- All factual information verified against client brief
- All corrections made and re-checked
Step 13: Deploy to Preview
- Step 12 Completion Gate satisfied
- GitHub repo for this client exists under the dotcomdesigniowa organization
- Cloudflare Pages project created for this client
Before sending the site to the client for review, deploy it to a Cloudflare Pages preview URL. This gives the client a real browsing experience — not a screenshot or a Manus preview link. The preview URL is what you send in the client review email.
Deployment Steps
- Push the final site files to the client's GitHub repo under
dotcomdesigniowa - Confirm the Cloudflare Pages project is connected to this GitHub repo and auto-deploys on push
- Wait for the Cloudflare Pages build to complete (typically 1–2 minutes)
- Copy the Cloudflare Pages preview URL (format:
https://[project].pages.dev) - Test the preview URL in an incognito window to confirm it loads correctly
- Test on a real mobile device if possible
Cloudflare Pages Setup (First Time)
If this is the first deployment for this client, create the Cloudflare Pages project before pushing. Connect it to the GitHub repo, set the build command to blank (static site — no build step), and set the output directory to / (root).
Process Flags — Automated Marker.io Registration
After confirming the Cloudflare Pages build is live, call the In Flight /api/deploy-preview endpoint. This single API call automatically handles all of the following — no manual steps required:
- Creates a new Marker.io website project using the Cloudflare Pages preview URL
- Registers the new project on the Process Flags webhook (fires on every Bug-type issue submitted via the Marker.io widget)
- Saves the Marker.io project ID and preview URL to the In Flight project record
- Logs the completion of Step 13 in the project activity log
POST https://hub.dotcomdesignops.com/api/deploy-preview
Content-Type: application/json
{
"projectSlug": "[in-flight-project-slug]",
"previewUrl": "https://[cloudflare-project-name].pages.dev",
"apiKey": "dd-ko-2024"
}
The endpoint is idempotent — if the project already has a Marker.io ID registered, it returns the existing data without creating a duplicate. At Step 16 (Go Live), call /api/go-live with the live custom domain to automatically update the Marker.io project URL from the preview URL to the live domain.
- Site deployed to Cloudflare Pages preview URL
- Preview URL tested in incognito window — loads correctly
/api/deploy-previewcalled — Marker.io project created and registered on Process Flags webhook- Preview URL ready to share with client
Step 14: Client Review
- Step 13 Completion Gate satisfied
- Preview URL confirmed working
- Client contact email confirmed
Send the preview URL to the client with clear instructions on how to review it and what to look for. Set a 48-hour response window. If no response is received within 48 hours, follow up once. If no response after 72 hours, proceed to Step 15 with zero revisions.
Client Review Email Template
Subject: Your New Website Is Ready for Review — [Business Name]
Hi [Client Name],
Your new website is ready for your review! Please take a look at the
preview link below and let us know if you have any changes.
Preview Link: [CLOUDFLARE PAGES URL]
How to review:
- Check all pages using the navigation menu
- Review on both your phone and your computer
- Check that all your services, contact info, and hours are correct
- Note any text changes, photo swaps, or additions you'd like
Please send all feedback by [DATE — 48 hours from now]. We'll make
your requested changes and then proceed to launch.
If everything looks great and you're ready to go live, just reply
with "Approved" and we'll schedule the launch.
[Your name]
Dotcom Design
Scope of Revisions
The client is entitled to one round of revisions as part of the build. Revisions include text corrections, photo swaps, and minor layout adjustments. Revisions do not include adding new pages, changing the design direction, or rebuilding sections from scratch. If the client requests out-of-scope changes, note them as a separate project.
- Client review email sent with preview URL
- Client feedback received (or 72-hour window elapsed)
- Revision list compiled and categorized (in-scope vs. out-of-scope)
Step 15: Revisions
- Step 14 Completion Gate satisfied
- Client revision list compiled
Implement all in-scope client revisions. After implementing, re-run Visual QA (Step 7 checklist) on any pages that were changed. Do not skip the re-check — revisions sometimes introduce new issues. Once revisions are complete and re-checked, get client approval before proceeding to launch.
Revision Process
- Work through the revision list item by item in Manus
- After all revisions are made, push to GitHub and confirm the Cloudflare Pages preview updates
- Re-run Visual QA on all changed pages
- Send the updated preview URL to the client with a note that revisions are complete
- Request final approval: "Please reply with 'Approved' to proceed to launch"
- All in-scope revisions implemented
- Visual QA re-run on all changed pages — all checks pass
- Updated preview URL sent to client
- Written client approval received
Step 16: Go Live
- Step 15 Completion Gate satisfied
- Written client approval received
- Domain registrar credentials accessible (from Step 3)
- Cloudflare Pages custom domain not yet configured
Go Live connects the client's domain to the Cloudflare Pages deployment. DNS propagation typically takes 5–30 minutes but can take up to 48 hours in rare cases. Do not schedule a launch for Friday afternoon or before a holiday weekend.
Launch Sequence
- In Cloudflare Pages, add the client's custom domain to the project (Settings → Custom Domains)
- Cloudflare will provide the DNS records needed (typically a CNAME pointing to
pages.dev) - Log into the client's domain registrar (from Step 3 credentials)
- Add the CNAME record provided by Cloudflare Pages
- If the domain uses Cloudflare DNS already, the record is added automatically — just confirm
- Wait 5–30 minutes for DNS propagation
- Test the live domain in an incognito window: confirm the site loads, HTTPS is active, and no redirect loops
- Submit the sitemap to Google Search Console:
https://search.google.com/search-console - Request indexing for the homepage in Google Search Console
Process Flags — Automated Marker.io URL Update
After DNS is confirmed and the site loads on the live domain, call the In Flight /api/go-live endpoint. This automatically updates the Marker.io project URL from the Cloudflare Pages preview URL to the live custom domain, ensuring the Marker.io widget is correctly associated with the production site.
POST https://hub.dotcomdesignops.com/api/go-live
Content-Type: application/json
{
"projectSlug": "[in-flight-project-slug]",
"liveUrl": "https://clientdomain.com",
"apiKey": "dd-ko-2024"
}
Post-DNS Checks
| Check | Pass Criteria |
|---|---|
| Site loads on custom domain | https://clientdomain.com loads the site correctly |
| HTTPS active | Padlock icon in browser; no "Not Secure" warning |
| www redirects to non-www (or vice versa) | Both www and non-www resolve to the same URL without error |
| Old site is no longer showing | The new site is displayed, not the old site |
| Contact form works on live domain | Submit a test form entry; confirm receipt in Formspree |
| Sitemap submitted | Sitemap URL submitted in Google Search Console |
- Site live at client's custom domain with HTTPS
- All post-DNS checks pass
/api/go-livecalled — Marker.io project URL updated to live domain- Sitemap submitted to Google Search Console
- Client notified that the site is live
Step 17: Post-Launch Monitoring
- Step 16 Completion Gate satisfied
- Site confirmed live at custom domain
Within 24 hours of launch, set up uptime monitoring and verify that Google has begun crawling the site. These steps take 30 minutes but provide ongoing protection and early warning of any issues.
Monitoring Setup
| Tool | Setup | Alert Threshold |
|---|---|---|
| UptimeRobot | Add monitor for the homepage URL; set check interval to 5 minutes | Alert on any downtime |
| Google Search Console | Confirm property is verified; check Coverage report for any indexing errors | Alert on coverage errors |
| Cloudflare Analytics | Confirm traffic is being recorded in Cloudflare Pages analytics | Visual check only |
48-Hour Check
Return to the site 48 hours after launch and run the following quick checks:
- Homepage loads correctly — no errors
- Contact form still submits correctly
- Google Search Console shows no new coverage errors
- UptimeRobot shows 100% uptime since launch
- Run a quick Google search for the business name — confirm the new site is indexed or indexing is in progress
- UptimeRobot monitor active and showing green
- Google Search Console verified and showing no coverage errors
- 48-hour check completed with no issues found
Step 18: Google Business Profile Sync
- Step 17 Completion Gate satisfied
- Client's Google Business Profile access confirmed (client must provide)
- New website URL live and confirmed
The Google Business Profile (GBP) must be updated to reflect the new website and any information changes made during the build. NAP consistency between the website and GBP is a critical local SEO signal. This step is not optional.
GBP Update Checklist
| Field | Action |
|---|---|
| Website URL | Update to the new live domain |
| Business name | Verify exact match to website and client brief |
| Phone number | Verify exact match to website |
| Address | Verify exact match to website |
| Business hours | Verify exact match to website |
| Services list | Update to match the services on the new website |
| Business description | Update to reflect the new website's About copy (150–750 characters) |
| Photos | Upload at least 3 new photos from the website gallery if available |
- GBP website URL updated to new live domain
- All GBP fields verified for NAP consistency with the website
- GBP services list updated to match website
Step 19: Quarterback Handoff
- Step 18 Completion Gate satisfied
- Quarterback assigned for this client
The Quarterback Handoff transfers ownership of the client relationship from the build team to the ongoing account management team. The quarterback is responsible for the client's ongoing SEO, reporting, and relationship management. A complete handoff ensures nothing falls through the cracks.
Handoff Package
Prepare and deliver the following to the quarterback before this step is complete:
| Item | Details |
|---|---|
| Client brief | The completed brief from Step 1, updated with any changes made during the build |
| Live site URL | The final live domain |
| GitHub repo URL | The repo under dotcomdesigniowa for future updates |
| Cloudflare Pages project name | For future deployments |
| SEO strategy URL | The live strategy site from Step 4 |
| Keyword-city matrix | The full matrix for reporting reference |
| Domain registrar credentials | From Step 3 — transfer securely |
| Google Search Console access | Confirm quarterback has access |
| UptimeRobot monitor | Transfer ownership or add quarterback as contact |
| Formspree account | Confirm form submissions are going to the right email |
| Notes on client personality | Communication style, preferences, any sensitivities noted during the build |
- Full handoff package delivered to quarterback
- Quarterback confirms receipt and has access to all tools and credentials
- Client added to ongoing reporting and account management workflow
Step 20: Ongoing Maintenance
- Step 19 Completion Gate satisfied
- Quarterback has confirmed receipt of full handoff package
- Client is active on a monthly plan
Ongoing maintenance is the quarterback's responsibility from this point forward. The build team is no longer the primary contact. This page documents the recurring maintenance tasks that must be performed on every active client site.
Monthly Maintenance Tasks
| Task | Frequency | Notes |
|---|---|---|
| Uptime check | Monthly review | Review UptimeRobot report; investigate any downtime events |
| Google Search Console review | Monthly | Check for new coverage errors, manual actions, or performance drops |
| Contact form test | Monthly | Submit a test entry; confirm receipt in Formspree |
| Domain expiration check | Quarterly | Alert client 90 days before expiration |
| SEO performance report | Monthly | Pull keyword rankings and traffic data; send to client |
| GBP review | Monthly | Check for new reviews; flag any Q&A that needs response |
| Content updates | As requested | New photos, updated hours, new services — process through Manus |
| Annual visual QA | Annually | Full visual QA pass to catch any display issues that have developed |
Handling Update Requests
When a client requests a content update (new photos, changed hours, new service), the quarterback opens a new Manus task, provides the specific change request, and pushes the updated files to GitHub. Cloudflare Pages auto-deploys within 2 minutes. The client is notified when the update is live.
Process Flags Closed-Loop Workflow
Process Flags are observations submitted via the Marker.io widget during the build and review phases of new-process sites. They are not client bugs — they are internal signals that the Playbook or build system needs improvement. The closed-loop workflow below ensures that every Process Flag eventually results in either a Playbook update or a documented decision to take no action.
| Stage | Who | Action |
|---|---|---|
| 1. Flag submitted | Build team or reviewer | Submit a Bug-type issue via the Marker.io widget on the live preview. The In Flight hub automatically receives it via webhook and displays it on the Process Flags tab of the project. |
| 2. Weekly review | Build lead | Every Monday, review all open Process Flags in the In Flight hub. Group related flags by theme (e.g., "mobile nav issues," "FAQ accordion inconsistency"). |
| 3. Triage decision | Build lead | For each flag or group, decide: (a) Update the Playbook, (b) Update a skill file, (c) Add to the Build Prompt template, or (d) No action needed (document why). Use the "Flag for Playbook" button in the Process Flags tab to mark the decision. |
| 4. Playbook update | Build lead + Manus | If action is required, open a Manus task with the specific Playbook section to update. Reference the flag ID and the affected build. Push the update to GitHub — dotcomdesignplaybook.com auto-deploys. |
| 5. Close the loop | Build lead | After the Playbook is updated, mark the flag as resolved in the In Flight hub. Add a note referencing the specific Playbook section that was updated. |
- Client is live, monitored, and in active account management
- All 20 steps completed and documented
- Quarterback is the primary point of contact going forward
Design Standards: What "Beautiful" Means
Every site we build must be beautiful. This is not a subjective aspiration — it is a defined, measurable standard. A site that passes all four audits (W3C, WAVE, PageSpeed 100, AI Friendliness) but looks generic or amateur does not meet the Dotcom Design standard. This page defines exactly what beautiful means so Manus can apply it consistently without being asked.
Typography Pairing Rules
Every site must use a two-font system: one display font for headings and one body font for paragraph text. Never use a single font for both roles. Never use more than two font families on a single site.
| Role | Font Type | Approved Pairings (Google Fonts) |
|---|---|---|
| Display (headings) | Bold sans-serif or slab serif | Oswald + Source Serif 4 • Montserrat + Lora • Bebas Neue + Open Sans • Playfair Display + Inter |
| Body (paragraphs) | Legible serif or humanist sans-serif | Source Serif 4 • Lora • Inter • Open Sans • Nunito |
| Rule | Standard |
|---|---|
| Heading weight | 700 or 800 for H1/H2. Never use a thin or light weight for headings. |
| Letter spacing | Display fonts: add letter-spacing: 0.02em to 0.08em for headings. Body text: default or -0.01em. |
| Line height | Headings: 1.1–1.2. Body: 1.65–1.8. Never below 1.5 for body text. |
| Font loading | Always use font-display: swap. Load only the weights actually used (typically 400, 600, 700). |
| Hierarchy | H1 must be visually dominant. H2 must be clearly subordinate to H1. Body text must be clearly smaller than any heading. The visual hierarchy must be obvious at a glance. |
Spacing Scale
All spacing (padding, margin, gap) must come from a fixed scale. Do not use arbitrary values like 13px or 37px. Consistent spacing is what separates professional design from amateur design.
| Token | Value | Use |
|---|---|---|
--space-xs | 8px | Icon gaps, tight inline spacing |
--space-sm | 16px | Card padding, list item gaps |
--space-md | 24px | Component internal padding |
--space-lg | 40px | Section padding (mobile), between-component gaps |
--space-xl | 64px | Section padding (desktop) |
--space-2xl | 96px | Hero padding, major section separators |
Color Application Rules
Every site has three color roles: Primary (brand action color), Neutral (backgrounds and text), and Accent (optional secondary highlight). These rules govern how color is applied across the site.
| Rule | Standard |
|---|---|
| Primary color usage | Used on: primary CTA buttons, sticky call bar, active nav state, section accent borders. Not used as a full-page background except for a single "dark CTA" section. |
| Contrast | All text on colored backgrounds must pass WCAG AA (4.5:1 for body, 3:1 for large text). White text on dark backgrounds, dark text on light backgrounds. Never gray text on a white background below 4.5:1. |
| Background variety | A page must have at least 3 distinct background zones: light, dark/colored, and white. A page that is entirely white feels unfinished. |
| Button states | Every button must have a visible hover state (darken by 10–15%) and a visible focus ring (for keyboard accessibility). Active/pressed state should scale to 0.97. |
| Link color | In-body links must be visually distinct from surrounding text (color + optional underline). Never use the same color as body text for links. |
Component Quality Benchmarks
These are the minimum visual quality standards for each major component type. A component that is functional but does not meet these benchmarks must be redesigned before the site passes Visual QA.
| Component | Quality Benchmark |
|---|---|
| Hero section | Full-width background image with a dark overlay for text contrast. H1 in display font at 48px+ desktop, 32px+ mobile. Subheadline in body font. At least one CTA button. The hero must occupy 80–100vh on desktop. |
| Service cards | Consistent height within a row. Icon or image at top. Title in bold. 1–2 sentence description. A visible hover state (shadow lift or border color change). Border radius of 8px minimum. |
| Testimonial cards | Quotation mark or star rating visible. Reviewer name and source (Google, Yelp, etc.) included. Card has a subtle background color or border to distinguish it from the page background. On mobile: swipe carousel, one at a time. |
| CTA sections | Visually distinct from surrounding sections — use the brand primary color as the background. Phone number in large type (28px+ desktop). Button uses a contrasting color (white or light). Never a plain paragraph with a link. |
| FAQ accordions | Each question is a full-width clickable row with a visible expand/collapse indicator (+ / - or chevron). Answer text is indented or padded. Smooth CSS transition on open/close (max-height or height animation). No JavaScript required — use <details>/<summary> or CSS-only toggle. |
| Navigation | Logo on the left, links in the center or right. On scroll: nav background becomes opaque (if initially transparent). Active page link is visually highlighted. Mobile: hamburger opens a full-screen overlay or slide-in drawer. |
| Footer | Dark background (not white). Logo, nav links, phone, address, hours, copyright, license number. Three-column layout on desktop, stacked on mobile. Never a single-line footer. |
| Stats/counters | Large number (40px+ desktop) in display font. Short label below in body font. Counter animates up from 0 when scrolled into view (IntersectionObserver). 3–4 stats in a row on desktop, 2x2 grid on mobile. |
The "Beautiful" Checklist
Before marking Visual QA complete, verify every item below. This checklist is the definition of "beautiful" for a Dotcom Design site.
- Two-font system in use (display + body). No single-font sites.
- Typography hierarchy is visually obvious: H1 dominates, H2 subordinate, body clearly smaller
- All spacing comes from the 8/16/24/40/64/96px scale — no arbitrary values
- Page has at least 3 distinct background zones (light, dark/colored, white)
- All buttons have visible hover, focus, and active states
- Hero section is full-width, photography-forward, with a clear H1 and CTA
- Service cards are consistent in height, have hover states, and use border-radius
- Testimonials use a swipe carousel on mobile (one at a time, dot indicators)
- CTA section uses brand primary color background — never a plain paragraph
- FAQ section uses a styled accordion — never a plain list
- Footer is dark-background, three-column on desktop, stacked on mobile
- Stats counter animates on scroll
- No section feels cramped or has inconsistent vertical rhythm
- No walls of text — all body copy is broken into 2–3 sentence paragraphs
Tokens & Credentials
Cloudflare
| Item | Location |
|---|---|
| Cloudflare Account | dotcomdesign.com Cloudflare account |
| API Token | Stored in DD Playbook skill (SKILL.md) |
| Account ID | Stored in DD Playbook skill (SKILL.md) |
| Zone ID (dotcomdesignops.com) | Stored in DD Playbook skill (SKILL.md) |
GitHub
| Item | Location |
|---|---|
| Organization | dotcomdesigniowa |
| CLI Auth | Pre-authenticated in Manus via gh CLI |
| Repo naming convention | [client-slug]-website (e.g., markuson-construction-website) |
Formspree
| Item | Notes |
|---|---|
| Account | One Formspree account per client, or use the DD master account with project-specific forms |
| Form endpoint format | https://formspree.io/f/[form-id] |
| Notification email | Set to the client's primary contact email |
Marker.io Webhook — In Flight Process Flags
| Item | Value / Notes |
|---|---|
| Webhook Name | In Flight - Process Flags |
| Webhook ID | 69c433808e1933ea9ffdc234 |
| Webhook URL | https://hub.dotcomdesignops.com/api/marker-webhook |
| Webhook Secret | c90cc854acf3f8e9fe210a6f222f5bd4 |
| Event | issueCreated only |
| Issue type filter | Server-side: only Bug type issues are processed (used to flag process/system improvements); all other types are acknowledged and silently ignored |
| Scope | New-process sites only. Sites are added automatically via the KO Call form submission. Do NOT enable “Apply to all websites.” |
| Currently applied to | No sites yet — first new-process site will be added automatically via KO Call form |
| Secret stored in | In Flight app → Manus Secrets panel → MARKER_WEBHOOK_SECRET |
Starting a Manus Build Task
Every new website build starts with a new Manus task. The opening prompt is critical — it loads the correct skills and sets the right context before the brief is submitted. Use the exact prompt below at the start of every build session.
Opening Prompt
Copy and paste this as the very first message in every new Manus build task. Replace the bracketed fields with the client's information.
You are building a client website for Dotcom Design.
Before doing anything else, read the following skills:
1. /home/ubuntu/skills/dd-playbook/SKILL.md
2. /home/ubuntu/skills/dotcom-design-brand/SKILL.md
3. /home/ubuntu/skills/static-site-launch-optimizer/SKILL.md
After reading all three skills, confirm you have read them and are
ready to receive the client brief.
Client: [CLIENT BUSINESS NAME]
Build type: Static HTML/CSS/JS website
Hosting: Cloudflare Pages
Stack: Pure HTML, CSS, vanilla JS — no frameworks, no CMS
AUDIT STANDARDS — build to pass all four from the first build, with zero rework:
- W3C HTML Validator: 0 errors (validator.w3.org)
- WAVE Accessibility: 0 errors, 0 contrast errors (wave.webaim.org)
- PageSpeed Insights: 90+ mobile performance, 95+ desktop (pagespeed.web.dev)
- DD AI Audit: 32/32 factors (ai-audit.dotcomdesignops.com)
These are build requirements. Do not build first and fix later.
After the Opening Prompt
Wait for Manus to confirm it has read all three skills. Then submit the full client brief (all eight sections from Step 5). Do not submit the brief in the same message as the opening prompt — send them separately so Manus has time to load the skills before processing the brief.
During the Build
Stay engaged during the build. Review each page as Manus builds it. Catch issues early rather than waiting for the full site to be assembled. If Manus produces something that does not match the brief, correct it immediately with a specific instruction rather than waiting until the end.
Useful Mid-Build Commands
| Situation | What to Say |
|---|---|
| Page looks wrong | "The [page name] hero section doesn't match the brief. The headline should be [correct headline]. Please fix and show me the updated version." |
| Missing section | "The homepage is missing the trust bar section. Please add it between the hero and the services grid, using the trust signals from the brief: [list them]." |
| Wrong tone | "The copy on the About page is too generic. Based on the slider scores (Voice: 8/10 Authoritative), please rewrite it to sound more expert and confident." |
| Image issues | "Please convert all images to WebP format and confirm they are all using loading='lazy' except the hero image." |
| Mobile issue | "At 375px the navigation is overflowing. Please fix the mobile nav to use a hamburger menu with a full-screen overlay." |
Build Prompt Template
This is the full client brief template. Fill in every field before submitting to Manus. Do not leave any field blank. Submit this as the second message in the Manus task, after the opening prompt has been acknowledged.
## CLIENT BRIEF
### SECTION 1: BUSINESS IDENTITY
Business Name (exact):
Phone Number:
Address:
City, State, ZIP:
Business Hours:
Monday:
Tuesday:
Wednesday:
Thursday:
Friday:
Saturday:
Sunday:
Years in Business:
License Number(s):
Bonded: Yes / No
Insured: Yes / No
### SECTION 2: SERVICE AREA
Primary City:
All Cities/Counties Served:
HQ City (for schema):
### SECTION 3: SERVICES
Primary Services (most important first):
1.
2.
3.
4.
5.
Secondary Services:
1.
2.
3.
### SECTION 4: DESIGN DIRECTION
Design Sliders (1-10):
Style (Classic → Modern):
Tone (Light → Dark):
Complexity (Simple → Rich):
Voice (Friendly → Authoritative):
Market Position (Economical → Premium):
Aesthetic (Polished → Gritty):
Reference Site URL (a site they like):
Color Preferences (if any):
Font Preferences (if any):
### SECTION 5: CONTENT ASSETS
Logo File Location:
Photos Available: Yes / No
If Yes, count:
If Yes, location:
Testimonials:
1. "[text]" — [Name], [Source]
2. "[text]" — [Name], [Source]
3. "[text]" — [Name], [Source]
Team Members (if applicable):
Name, Title, Bio:
### SECTION 6: TRUST SIGNALS
Years in Business:
License Number(s):
Certifications/Awards:
Industry Associations:
Notable Differentiators:
### SECTION 7: SEO MATRIX
[PASTE FULL KEYWORD-CITY MATRIX FROM SEO PORTAL HERE]
### SECTION 8: AI FRIENDLINESS DATA (Required for 90+ score at audit)
# Statistics — include ALL of these as real numbers in the page copy:
Years in Business:
Jobs/Projects Completed:
Warranty Length (if applicable):
Response Time (e.g., "same-day estimates"):
Service Count (total number of services offered):
Any other notable stats (e.g., "5-star rated", "100% satisfaction guarantee"):
# Citations — include ALL of these as external links in the site:
BBB Profile URL:
Google Business Profile URL:
License Verification URL (state licensing board):
Industry Association URL (NARI, NAHB, etc.):
# Schema — required fields for LocalBusiness schema:
Geo Latitude:
Geo Longitude:
Price Range (e.g., "$$"):
Area Served (list all cities):
# FAQ Questions — provide 4+ per service page:
Homepage FAQs:
Q:
Q:
Q:
Q:
Primary Service Page FAQs:
Q:
Q:
Q:
Q:
### SECTION 9: AUDIT STANDARDS (DO NOT SKIP)
Build this site to pass all four audits at Steps 10-11 with zero rework. Every item below is a build requirement, not an audit item.
W3C HTML VALIDATION (target: 0 errors):
- Every page:
- Every
: descriptive alt attribute (never empty, never "image")
- Every form input/select/textarea: associated