BrightMinds — Conversion-First Bilingual Microsite

Single-file microsite that converts Parisian parents from curiosity to WhatsApp consult in under two taps.

Role: Product + front-end engineerTimeframe: 3-day sprintStack: HTML • Tailwind • Alpine.js • Plausible
HTMLTailwindAccessibilityi18nSEOGDPRLead Gen
BrightMinds — Conversion-First Bilingual Microsite
At a glance
  • Problem
    Single-file microsite that converts Parisian parents from curiosity to WhatsApp consult in under two taps.
  • Role
    Product + front-end engineer
  • Timeframe
    3-day sprint
  • Stack
    HTML • Tailwind • Alpine.js • Plausible
  • Focus
    HTML • Tailwind • Accessibility
  • Impact
    FCP on 4G: <1 s
FCP on 4G
<1 s
Hero → CTA clicks
20–30%
Lighthouse
95–100

Problem

Single-file microsite that converts Parisian parents from curiosity to WhatsApp consult in under two taps.

Context

S — BrightMinds sells English + coding camps but relied on generic tutor listings. Parents needed proof, pricing, and a low-friction way to talk. T — Ship a zero-maintenance landing page that nails bilingual storytelling, accessibility, and GDPR-friendly lead capture without spinning up a CMS.

Conversion-first bilingual microsite under 1-second FCP

Single-file build minimizes load time and maintenance.

CTA flow is optimized for WhatsApp consults.

SEO + GDPR lead capture without a CMS

Structured data and OG cards improve discoverability.

PII is handled via messaging rather than stored on the site.

Architecture

  1. Built everything in a single HTML file with Tailwind CDN and ~3 KB of Alpine.js for the language toggle and FAQ accordions.
  2. Crafted bilingual copy with parent-centric framing, storing translations in a mini dictionary so toggles never reload.
  3. Shipped three conversion surfaces: sticky mobile CTA, hero button, and outcome cards linking to WhatsApp + mailto flows with prefilled context.
  4. Embedded LocalBusiness + FAQ Schema, OG/Twitter cards, and canonical tags to earn rich results.
  5. Guarded privacy by delegating conversations to WhatsApp/mailto, logging only anonymized click analytics via Plausible.
  6. Added reduced-motion guard on looping hero video, keyboard traps coverage, and focus-visible styles for inclusive browsing.
  7. Documented the playbook so the founder can clone the site for other neighborhoods without calling engineering.

Security / Threat Model

  • Slow load or heavy fonts would kill conversions on metro Wi-Fi.
  • Literal translations risked awkward phrasing and trust gaps.
  • Collecting PII without a CRM could create compliance risks.
  • No engineering team to maintain build pipelines.

Tradeoffs & Lessons

Speed, clarity, and trust beat complex stacks when the goal is meetings, not content velocity. Treating privacy and accessibility as features baked into the copy was the real unlock for this microsite.

Results

Launch-day Lighthouse scores hit 98/99/100/100, 4G first contentful paint stayed under a second, and hero-to-CTA clicks averaged 25%. Parents reported finally understanding the curriculum and pricing in one scroll, and the founder now clones the template for seasonal cohorts.

Stack

HTMLTailwindAlpine.jsPlausible

FAQ

Why a single-file build?

Speed, zero maintenance, and reliable performance across devices.

How is SEO handled?

Schema markup, fast rendering, and canonical tags drive visibility.

What results did it drive?

High CTA click rates and Lighthouse scores in the 95–100 range.

    BrightMinds — Conversion-First Bilingual Microsite — Case Study