Une page qui répond dans l'ordre
Les sections suivent les questions du visiteur : pour qui, quels concours, quelle méthode, quelles preuves, quel prix, comment s'inscrire.
Étude de cas
LANDING PAGE CONCOURS
Une landing page pour ConcoursElite, un service de préparation aux concours de la fonction publique burkinabè : promesse claire, parcours par profil, méthode, tarifs et inscription.
Le formulaire d'inscription est pour l'instant une maquette : il n'envoie pas encore de message.
LE DÉFI
Faire comprendre en quelques secondes pour qui est la formation, comment elle fonctionne, combien elle coûte et comment s'inscrire.
Une page unique, légère et lisible sur mobile, avec un ton rassurant pour des candidats qui jouent un concours.
CE QUE FAIT L'APPLICATION
- Hero avec une promesse claire et quatre chiffres clés.
- Parcours selon le profil : élèves et étudiants, candidats libres, travailleurs, reconversion.
- Six concours présentés : ENAREF, Douanes, IDS, Police, Infirmier et professeur des écoles.
- Présentation de la méthode, avec six éléments d'accompagnement.
- Témoignages et trois formules tarifaires en FCFA.
- Formulaire d'inscription, bouton WhatsApp, navigation fixe et menu mobile.
DÉCISIONS TECHNIQUES
Un thème Tailwind piloté par variables
Les couleurs sont des variables CSS en HSL branchées dans la configuration Tailwind. Les titres utilisent Playfair Display, le texte DM Sans.
Une navigation qui s'adapte au défilement
L'en-tête est transparent sur le hero, puis prend un fond flou et une ombre dès qu'on descend. Le défilement vers les sections est fluide.
Un JavaScript minimal
Environ 150 lignes, sans framework : menu mobile, défilement vers les sections et état de l'en-tête.
APERÇU
MISE EN LIGNE
- CSS Tailwind compilé et minifié en un seul fichier.
- Environ 150 lignes de JavaScript, sans framework.
- Hébergement statique sur Vercel.
Suite