ReviewOS

stacks/reportshq

Marketing site: landing, pricing, SEO surfaces

#19
Open chris opened this 8 days ago ·
8 days ago

Context

The public face at reportshq.org. loghq's marketing architecture is the blueprint (resources/views/index.stx, pricing.stx, features/*, use-cases/*, compare/*, marketing.stx layout, SiteNav/SiteFooter partials) - but this must NOT be a reskin; the layout owes nothing to loghq's landing beyond quality. Read stacks-design-taste and stacks-design-output first; consider stacks-imagegen-web for reference frames before coding. Be picky: this page is the first impression and the standard the rest of the app is judged by.

Scope

  • Landing (/): hero with a real product visual - the strongest candidate is a live, SSR-rendered report (the chart library #11 makes this honest: real components, seeded data), not a screenshot and never a fake one (loghq rule). Narrative: send events (code snippet with a real curl/SDK call) -> reports build themselves (auto-report templates #14) -> make them yours (builder #12). Feature bento, how-it-works steps, CTA. Waitlist capture (/api/subscribe pattern from loghq) until launch, then sign-up.
  • Pricing (/pricing): three tiers rendered from the #18 limits config (numbers can never drift from enforcement), monthly/yearly toggle, checkout wiring from #17 for authed users, honest FAQ (what happens over quota, self-hosting).
  • SEO surfaces, each a real page with real copy: features/* (builder, auto-reports, integrations, sharing, exports, self-hosting), use-cases/* (commerce reporting, SaaS user reporting, content analytics, agencies), compare/* (pick 4-6 honest comparisons in the reporting space). Breadcrumbs partial, sitemap, meta/OG per page.
  • Docs teaser section linking into #20; footer with the standard loghq-family link set.
  • Performance: static-friendly SSR, no blocking scripts, images through the asset pipeline, fonts font-display: swap; Crosswind/CSS motion only, gated on usePreferredReducedMotion().
  • stacks-browse QA at mobile/tablet/desktop, light/dark.

Acceptance

  • Pre-flight from stacks-design-taste Section 14 passes honestly on every page; zero em-dashes; pricing numbers verifiably imported from the limits config; Lighthouse-style sanity (no console errors, images sized, fonts swapped).

Depends on #3, #11, #17, #18 (pricing wiring; landing can start earlier behind the waitlist). Part of #1 (M7 Launch). Ground rules: see #1.

8 days ago

Marketing site is in. Summary of what landed and the one item still outstanding.

Landing (/) rewritten (it still described stacksjs.com). The hero renders a real report through the product's own BigNumber, LineChart and DonutChart from a fixed sample series, so it cannot drift from what a customer gets, and the sample is labelled as a sample. Narrative, feature bento, code snippets for the SDK and curl, docs teaser, CTA.

Pricing (/pricing) renders every number from app/Billing/limits.ts, verified by changing a limit and watching the page follow. Monthly/yearly toggle with the saving computed from the two prices rather than claimed beside them, and no JavaScript: a checkbox and four CSS rules, so it works on first paint and with scripting off. Honest FAQ covering the grace band and self-hosting.

SEO surfaces: 6 features, 4 use cases, 6 comparisons, plus 3 hub pages. Every comparison page names the case where the other tool is the better answer. All 16 pages and 3 hubs render with their own title, description, canonical and OG tags.

app/Marketing/pages.ts is the single list. Hubs, footer columns, breadcrumbs and the sitemap all read it, so adding a page links it site-wide and puts it in the sitemap with no second step.

sitemap.xml / robots.txt are generated into public/ rather than served from a route, because the document root is handled by the static layer and a route for /sitemap.xml is never reached (filed as stacksjs/stacks#2326; the pre-existing GET /ingest/verify has the same problem and is currently dead). tests/feature/seo-files.test.ts regenerates and compares, so a stale sitemap fails CI.

Two stx bugs fixed upstream and released in 0.2.182: @meta emitted its tag into the <body> where no crawler reads it and used name= for og:*; and page meta was appended to config meta, so every page shipped two descriptions with the site-wide one first, which is the one crawlers take.

Dead links caught: the footer linked to /docs/taxonomy, /docs/stacks and /docs/laravel, none of which existed. Both SDK docs are now written and tests/feature/marketing-links.test.ts walks every static href on the public pages and asserts it resolves.

QA: mobile (375), tablet (768) and desktop (1280), light and dark, no horizontal overflow and no clipped text. Two responsive bugs fixed at the source: BigNumber clipped its headline in a narrow block (the report viewer renders the same block on a phone), and the code samples' overflow-x-auto was defeated by the grid item default of min-width: auto.

Still outstanding: checkout wiring for authed users, which depends on #17 and is blocked on Stripe keys. Everything else in the scope list is done, so this stays open only for that.

Sign in to comment on this issue.