BrightMinds — Conversion-First Bilingual Microsite (Paris)

Parents in Paris want native-English tutoring with visible outcomes, but most listings lack clarity, local trust signals, and fast paths to book. The audience is bilingual (EN/FR) and often mobile-first. Build a low-ops, production-ready microsite that clearly explains the value (English + tech projects), respects accessibility and privacy, and converts curiosity into a 15-minute consult — without spinning up a backend or complex framework.

• High bounce from slow load or unclear value prop (mobile networks, first-paint delays).
• Exclusion of French-speaking parents if i18n is clumsy or incomplete.
• GDPR violations from analytics or lead capture (consent, data minimization).
• Fragile ops if the stack is over-engineered (tooling churn, flaky builds).
• SEO underperformance from missing structured data/canonical/OG hygiene.

1. Architecture: Single HTML file + Tailwind CDN + small vanilla JS. Why: instant TTFB, near-zero ops, easy to replicate by city/cohort.
2. Performance budget: defer non-critical JS, eliminate webfonts (system stack), preconnect to CDN. Why: reduce blocking time and CLS.
3. Media: motion-safe hero video with prefers-reduced-motion guard and lightweight poster. Why: keep the hook, protect sensitive users.
4. A11y: semantic landmarks, :focus-visible, keyboardable audio player, high-contrast theme. Why: WCAG alignment and broader reach.
5. Content structure: headings follow logical outline; controls use ARIA labels and states (consider aria-pressed for play/pause).
6. i18n: inline dictionary (dict.en/dict.fr) + [data-i18n] hooks; toggle persists in localStorage. Why: no framework lock-in, instant language swap.
7. Copy strategy: parent-centric phrasing (benefits, outcomes, logistics) written natively in both languages to avoid literal translation traps.
8. AIDA funnel: Hero (promise + social proof) → Programs by age (8–10, 11–14, 15–18) → Outcomes/Projects/Testimonials → Pricing → Lead.
9. CTA design: sticky mobile CTA, above-the-fold primary, WhatsApp/mailto prefill. Why: reduce friction and use parents’ native behaviors.
10. Exit-intent: optional email capture offering a sample 4-session plan. Why: retain interest without aggression.
11. SEO meta: descriptive <title>/<meta description> tuned to intent (“Kids English + Coding Paris”). Why: match real search phrasing.
12. OG/Twitter: large image (1200×630), self-hosted. Why: reliable link previews and control over cache.
13. Schema.org: LocalBusiness + FAQPage (single url key, no duplicates), canonical URL. Why: rich results + avoid duplicate content signals.
14. Robots: index,follow with room for future sitemap; clean URL strategy for portability. Why: simple crawlability, future-proofing.
15. GDPR: analytics via Plausible/Umami recommendation; no unsolicited tracking; consent note on lead handoff. Why: privacy by design.
16. Data minimization: avoid storing PII; delegate conversation to WhatsApp/mailto; log only aggregate events. Why: reduce risk and scope.
17. Quality gates: Lighthouse budgets (Perf/SEO/A11y/Best ≥ 95), manual i18n completeness checks, mobile first pass on real devices.
18. Documentation: README with run/deploy steps, KPI checklist, and known-good snippets (CSP, Plausible, robots).

Early production runs achieved sub-1s first contentful paint on 4G, 95–100 Lighthouse scores, and a 20–30% click-through from Hero → Lead. The consult flow typically requires 1–2 interactions on mobile. Parents reported clearer understanding of outcomes and pricing.

The simplest stack often produces the most reliable conversions — if you sweat the details. Design copy for the job-to-be-done (parent clarity), ship A11y from day one, and measure only what you need to improve the funnel. For SEO, structured data and canonical hygiene matter more than chasing keywords. Treat privacy as a feature: it narrows scope, builds trust, and accelerates delivery.