added seo rules, preview table, and new rules to help seo
This commit is contained in:
@@ -32,6 +32,7 @@ Do **not** invent new product features or prices. Read `features.md` and use tho
|
||||
Made by <a href="https://aimloperations.com" rel="noopener noreferrer" target="_blank">AI ML Operations, LLC</a>
|
||||
```
|
||||
Link the company name only. Do not omit on new pages.
|
||||
10. **SEO on first shot** — public marketing pages must pass Lighthouse SEO (target **100**). Follow the [SEO checklist](#seo-public-marketing) below; do not ship homepage without meta description and descriptive link text.
|
||||
|
||||
---
|
||||
|
||||
@@ -72,12 +73,14 @@ proposals/<client-name>/
|
||||
1. Create folders above.
|
||||
2. Copy closest `templates/<name>/` into `mockup/` (omit template docs/junk).
|
||||
3. Brand the **public** site (copy, colors, logo, services, contact). Prefer real approved data; mark placeholders clearly.
|
||||
4. Add **ux-gallery.html** — monica-style hub: eyebrow per feature (`Public · base`, `Portal · base`, `Portal · Email/SMS`, …). Ready screens link to real HTML; unfinished → `ux-planned.html?p=<key>`.
|
||||
5. Add **pricing.html** — base rows locked on; add-ons toggleable; enforce deps; show one-time + monthly totals; disclaimer that usage (Stripe/SMS/postage) is extra.
|
||||
6. Write **SCOPE.md** — recommend add-ons for *this* business; compute totals from `features.md` prices.
|
||||
7. Write **NOTES.md** — client identity, sources, sitemap, preview reminder, next passes.
|
||||
8. Banner on marketing pages → gallery + pricing links.
|
||||
9. Smoke-test locally as static files.
|
||||
4. Apply **SEO** on every public marketing page (see [SEO checklist](#seo-public-marketing)) — meta description, unique titles, descriptive links, OG/Twitter, LocalBusiness JSON-LD on the homepage.
|
||||
5. Add **ux-gallery.html** — monica-style hub: eyebrow per feature (`Public · base`, `Portal · base`, `Portal · Email/SMS`, …). Ready screens link to real HTML; unfinished → `ux-planned.html?p=<key>`.
|
||||
6. Add **pricing.html** — base rows locked on; add-ons toggleable; enforce deps; show one-time + monthly totals; disclaimer that usage (Stripe/SMS/postage) is extra.
|
||||
7. Write **SCOPE.md** — recommend add-ons for *this* business; compute totals from `features.md` prices.
|
||||
8. Write **NOTES.md** — client identity, sources, sitemap, preview reminder, next passes.
|
||||
9. Banner on marketing pages → gallery + pricing links.
|
||||
10. Add the client row to the **Active previews** table in `README.md` (business, phone, email, preview URL). Use `_TBD_` for unknown phone/email.
|
||||
11. Smoke-test locally as static files; run Lighthouse SEO on the homepage (target 100).
|
||||
|
||||
### Reuse
|
||||
|
||||
@@ -85,6 +88,76 @@ Copy gallery/pricing/stub patterns from:
|
||||
|
||||
- `proposals/eds-plumbing-and-sewer/mockup/`
|
||||
- `proposals/paint-to-please/mockup/`
|
||||
- `proposals/select-electrical/mockup/`
|
||||
|
||||
---
|
||||
|
||||
## SEO (public marketing)
|
||||
|
||||
Ship Lighthouse SEO **100** on the public homepage on the first pass. Portal / gallery / pricing pages are secondary (still need titles + footer credit).
|
||||
|
||||
### Required on every public HTML page
|
||||
|
||||
| Item | Rule |
|
||||
|------|------|
|
||||
| `<html lang="en">` | Always set `lang`. |
|
||||
| Unique `<title>` | Include business name + page topic + city/region when known. Do **not** reuse one generic title on every page. |
|
||||
| Meta description | 1–2 sentences, ~120–160 chars, business + service + locale. Required on homepage; required on About, Contact, Services, and each service page. |
|
||||
| Viewport | `width=device-width, initial-scale=1`. **Do not** use `user-scalable=0` or `maximum-scale=1` (hurts a11y; not needed for SEO). |
|
||||
| Image `alt` | Meaningful alt on content images; decorative icons may use `alt=""`. |
|
||||
| Crawlable links | Real `href` to real pages (or `#section`). Prefer no empty `#` CTAs for primary nav/services. |
|
||||
|
||||
### Homepage extras (do these on `index.html`)
|
||||
|
||||
```html
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="canonical" href="https://<client>-preview.aimloperations.com/">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:title" content="…same as title…">
|
||||
<meta property="og:description" content="…">
|
||||
<meta property="og:url" content="https://<client>-preview.aimloperations.com/">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="…">
|
||||
<meta name="twitter:description" content="…">
|
||||
```
|
||||
|
||||
Add **JSON-LD** (`application/ld+json`) for the local business — use the closest schema.org type (`PlumbingService`, `Electrician`, `HousePainter`, `LocalBusiness`, etc.) with `name`, `url`, `telephone`, `email` (if known), `address`, `areaServed`, and a short `description`. Match phone/email to what’s shown on the page and to the README Active previews row.
|
||||
|
||||
### Descriptive link text (Lighthouse `link-text`)
|
||||
|
||||
**Never** use these as the only visible link text:
|
||||
|
||||
- Learn more / Learn More / LEARN MORE
|
||||
- Click here / Click this
|
||||
- More / Here / This / Go / Start / Right here
|
||||
|
||||
**Do** name the destination, e.g.:
|
||||
|
||||
- `Water heater services` → `water-heaters.html`
|
||||
- `Lighting installation details` → `lighting-installation.html`
|
||||
- `View plumbing services` → `services.html`
|
||||
|
||||
Service-card links must point to the **correct** service page (not one shared wrong URL for every card).
|
||||
|
||||
### Quick Lighthouse check
|
||||
|
||||
```bash
|
||||
npx lighthouse@12 "https://<preview-host>/" --only-categories=seo --chrome-flags="--headless --no-sandbox"
|
||||
# or local:
|
||||
python3 -m http.server 8765
|
||||
npx lighthouse@12 "http://127.0.0.1:8765/proposals/<client>/mockup/" --only-categories=seo --chrome-flags="--headless --no-sandbox"
|
||||
```
|
||||
|
||||
Fix any SEO audit with score < 1 before calling the mockup done.
|
||||
|
||||
### Reference implementations
|
||||
|
||||
Homepages that already follow this pattern:
|
||||
|
||||
- `proposals/eds-plumbing-and-sewer/mockup/index.html`
|
||||
- `proposals/paint-to-please/mockup/index.html`
|
||||
- `proposals/select-electrical/mockup/index.html`
|
||||
|
||||
---
|
||||
|
||||
@@ -134,5 +207,7 @@ Portal mocks can be denser/app-like; still match proposal hub styling (`ux-hub.c
|
||||
- [ ] `ux-gallery.html` covers base + every add-on screen (ready or planned)
|
||||
- [ ] `pricing.html` totals correct; deps work
|
||||
- [ ] Public marketing is client-branded and concept-bannered
|
||||
- [ ] SEO: homepage Lighthouse SEO 100; unique titles + meta descriptions on public pages; no vague “Learn more” links; OG/Twitter + JSON-LD on homepage
|
||||
- [ ] `README.md` Active previews table has business, phone, email, preview URL
|
||||
- [ ] Footer credit: Made by [AI ML Operations, LLC](https://aimloperations.com)
|
||||
- [ ] No secrets committed; relative paths; opens without a server framework
|
||||
|
||||
Reference in New Issue
Block a user