AEHPI · rendre les ressources HPI accessibles à tous.

Le contexte

L'AEHPI existe depuis 2005. Elle accompagne deux publics très différents : d'un côté, des parents perdus face au diagnostic HPI de leur enfant, qui cherchent des ressources fiables, des formations, des contacts ; de l'autre, des professionnels (enseignants, psychologues, médecins) qui veulent comprendre et mieux accompagner ces profils atypiques.

L'ancien site avait été construit à une époque où le mobile n'existait pas comme canal principal. En 2024, plus de 60 % des visiteurs arrivaient sur smartphone et tombaient sur une mise en page pensée pour un écran d'ordinateur de bureau : textes trop petits, menus inaccessibles, ressources introuvables. Un site qui donnait l'image inverse de ce que l'association incarne : clarté, accompagnement, modernité pédagogique.

Le défi

Ce n'est pas qu'une question de design. Refondre ce site, c'était résoudre trois problèmes simultanément :

1. Deux audiences aux besoins opposés. Un parent en détresse ne cherche pas la même chose qu'un enseignant en formation continue. Le site devait parler aux deux sans perdre l'un dans le parcours de l'autre.
2. Un volume de contenu important. Années de ressources, d'actualités, de comptes-rendus d'actions. Tout organiser sans noyer le visiteur.
3. Une association, pas une entreprise. Pas de budget illimité, besoin d'autonomie totale après livraison : l'équipe devait pouvoir mettre à jour le contenu elle-même, sans dépendre d'un prestataire.

L'intervention

Avant de toucher au code, j'ai cartographié les besoins des deux publics cibles et structuré l'arborescence en conséquence. Deux chemins distincts dès la page d'accueil, une navigation claire, des rubriques qui répondent aux vraies questions posées par les familles.

• Refonte mobile-first complète : chaque écran pensé depuis le format smartphone, puis adapté au desktop. Finies les lignes de texte illisibles sur téléphone.
• Architecture à deux entrées : la page d'accueil oriente immédiatement vers « Je suis parent » ou « Je suis professionnel », avec des rubriques adaptées à chaque profil.
• Espace ressources structuré : les documents, guides et outils de l'association organisés par thématique et par public, accessibles en 2 clics au lieu de fouiller dans les archives.
• Agenda des formations : calendrier des actions et formations clairement affiché, avec procédure d'inscription intégrée directement dans le site.
• Actualités et vie de l'association : section blog/news permettant à l'équipe de publier elle-même, sans manipulation technique.
• Espace adhérents : présentation claire des avantages de l'adhésion et formulaire en ligne, qui remplace le retour par courrier postal.
• SEO structurel : balisage Schema.org Organization, balises méta optimisées, temps de chargement réduit. Les familles qui tapent « association HPI France » ou « accompagnement enfant précoce » trouvent l'AEHPI.

Le résultat

Ce qui a fait la différence

Ce projet, comme tous les projets d'association, avait une contrainte rare dans le monde commercial : l'équipe qui utilise le site n'est pas technique, et il n'y aura pas de budget maintenance récurrent. Ce n'est pas une contrainte gênante, c'est une donnée de conception. Chaque choix technique a été fait pour maximiser l'autonomie : éditeur de contenu simple, documentation transmise à la livraison, formation de l'équipe incluse.

J'ai également pris le temps de comprendre les spécificités du sujet HPI, pas pour devenir expert, mais pour que les textes et la navigation reflètent la réalité vécue par les familles qui arrivent sur le site dans un moment souvent difficile. Un parent qui vient de recevoir le diagnostic de son enfant ne doit pas tomber sur un site froid et confus.

Stack technique

• HTML / CSS / JS (vanilla, sans dépendance externe)
• Architecture mobile-first, optimisée Core Web Vitals
• Système de contenu autonome : publication sans intervention technique
• Schema.org Organization + BreadcrumbList pour le SEO
• Formulaire d'adhésion en ligne intégré
• Hébergement chez le client (propriété totale du code)