- ProblèmeMicrosite monofichier qui fait passer les parents parisiens de la curiosité au WhatsApp en deux taps.
- RôleProduct + front-end engineer
- DuréeSprint de 3 jours
- StackHTML • Tailwind • Alpine.js • Plausible
- FocusHTML • Tailwind • Accessibility
- ImpactFCP en 4G: <1 s
Problème
Microsite monofichier qui fait passer les parents parisiens de la curiosité au WhatsApp en deux taps.
Contexte
S — BrightMinds vend des camps anglais + code mais dépendait d’annuaires tutorat génériques. Les parents voulaient preuves, tarifs et contact ultra simple. T — Livrer une landing zéro maintenance, bilingue, accessible et conforme RGPD sans déployer un CMS.
Microsite bilingue conversion‑first < 1 s FCP
Build single‑file pour vitesse et maintenance minimale.
CTA optimisé pour consult WhatsApp.
SEO + capture RGPD sans CMS
Schema + OG cards améliorent la découvrabilité.
PII géré via messaging plutôt que stockage.
Architecture
- Tout développer dans un unique fichier HTML avec Tailwind CDN et ~3 Ko d’Alpine.js pour le toggle langue + FAQ.
- Rédiger une copie bilingue centrée parents, stockée dans un mini dictionnaire pour basculer sans rechargement.
- Déployer trois surfaces de conversion : CTA sticky mobile, bouton héro, cartes résultats vers WhatsApp/mailto préremplis.
- Intégrer les schémas LocalBusiness + FAQ, les cartes OG/Twitter et balises canonicals pour décrocher des rich results.
- Protéger la vie privée en renvoyant vers WhatsApp/mailto et en ne journalisant que des clics anonymisés via Plausible.
- Ajouter garde-fous accessibilité : vidéo héro en reduced-motion, gestion du focus clavier et contrastes élevés.
- Documenter la recette pour que la fondatrice clone le site pour chaque quartier sans developer.
Sécurité / Modèle de menace
- Le moindre poids/typo lente tue la conversion sur le Wi-Fi du métro.
- Traductions littérales = formulations maladroites, donc perte de confiance.
- Collecter des données perso sans CRM pouvait créer des risques conformité.
- Aucune équipe d’ingénierie pour entretenir un pipeline build.
Compromis & retours d’expérience
Vitesse, clarté et confiance battent les stacks complexes quand l’objectif est le rendez-vous. Traiter confidentialité et accessibilité comme des features de copy a débloqué les conversions.
Résultats
Le jour J, Lighthouse affiche 98/99/100/100, le FCP 4G reste <1 s et 25 % des visiteurs cliquent les CTA. Les parents comprennent programme et prix en un scroll et la fondatrice réplique maintenant le template selon les saisons.
Stack technique
FAQ
Pourquoi un build single‑file ?
Vitesse, zéro maintenance et fiabilité cross‑device.
Comment le SEO est‑il géré ?
Schema markup, rendu rapide et canonical tags.
Quels résultats ?
Taux de clic CTA élevé et Lighthouse 95+.