Une maquette respectée à la lettre, un site que l'association fait vivre seule.

Refonte du site de La Courte Échelle, association de soutien scolaire à Sèvres : intégration fidèle des maquettes fournies et gabarits dynamiques pour que l'équipe publie sans aide.

Associations Site public et actualités Divi 2025

5

pages intégrées et mises en forme à partir des maquettes fournies

3

gabarits dynamiques : activités, témoignages et actualités

3

rubriques de navigation, de la présentation à l'engagement

Le projet

Recruter des bénévoles avec un site à leur image

La Courte Échelle est une association loi 1901 fondée en 1996 à Sèvres. Ses bénévoles accompagnent des élèves en difficulté dans les écoles élémentaires publiques de la ville et au collège, en séances hebdomadaires, en lien avec les enseignants et les familles. L’association propose aussi des ateliers, du français langue étrangère, des sorties et La Boîte à mots, une correspondance anonyme entre enfants et bénévoles. Elle annonce 50 bénévoles, 150 élèves et 7 000 heures sur son site.

Son ancien site ne portait plus cette image, et il devait surtout aider à recruter de nouveaux bénévoles. L’association arrivait avec des maquettes graphiques déjà réalisées : le projet ne consistait pas à redessiner le site, mais à l’intégrer sans le trahir, tout en laissant à l’équipe un outil qu’elle peut faire vivre elle-même.

Nous avons intégré les maquettes au plus près, en uniformisant typographies, couleurs, boutons et sections pour que chaque page reste cohérente avec les autres. Les contenus qui reviennent reposent sur trois gabarits dynamiques : les pages d’activités, la liste de témoignages filtrable et les actualités. Ajouter un témoignage ou une actualité revient à remplir une fiche, sans toucher à la mise en page.

Le site s’organise en trois rubriques, de la présentation de l’association à l’engagement des futurs bénévoles. Il a été développé sur un environnement dédié, puis déployé sur le serveur de l’association, avec une configuration sécurisée, des sauvegardes automatisées et des mentions de confidentialité conformes au RGPD.

Ce qui a été livré
  • Un site fidèle aux maquettes fournies par l'association
  • Une page par activité : primaire, collège et Boîte à mots
  • Des témoignages filtrables, ajoutés sans retoucher la mise en page
  • Une rubrique d'actualités tenue par l'équipe
  • Un parcours Rejoignez-nous pour les futurs bénévoles
  • Un formulaire de contact protégé contre le spam
  • Des mentions de confidentialité conformes au RGPD

En un coup d'œil

Des messages clés hiérarchisés dès l'accueil

Messages clés hiérarchisés, image humaine et associative mise en avant : le visiteur comprend vite à quoi sert l'association.

Ce que ça donne

Trois écrans, trois décisions.

01

Une page par activité, sur le même modèle

Primaire, collège et Boîte à mots partagent un gabarit : l'équipe met à jour une activité sans craindre de casser la mise en page.
02

Des témoignages qui se filtrent

La liste des témoignages est filtrable : le visiteur va directement à ceux qui le concernent.
03

Le même site dans la poche

Les maquettes se déclinent sur mobile avec la même hiérarchie des messages.
Technique

Trois gabarits pour les contenus qui changent, la maquette pour le reste

Le site repose sur WordPress et le constructeur Divi. Les pages fixes reprennent les maquettes à l’identique ; les activités, les témoignages et les actualités sont produits par des gabarits dynamiques personnalisés, qui séparent le contenu de la mise en forme. L’architecture modulaire laisse la place à de futures rubriques. Les gabarits reprennent les styles des maquettes : une actualité ou un témoignage ajouté par l’équipe prend automatiquement la mise en forme validée par l’association, sans réglage manuel.

Le référencement a été pris en compte dès la conception : structure Hn hiérarchisée, title et méta descriptions personnalisés, URL structurées, maillage interne et travail sur les performances. La configuration WordPress a été sécurisée, avec des sauvegardes automatisées et une protection de base contre les robots.

  • WordPress et Divi, styles uniformisés sur toutes les sections
  • Gabarits dynamiques personnalisés pour activités, témoignages et actualités
  • Structure Hn, title et méta descriptions définis dès la conception
  • URL structurées et optimisation des performances (Core Web Vitals)
  • Configuration sécurisée, sauvegardes automatisées et protection contre les robots
  • Environnement de développement dédié, puis déploiement sur le serveur de l'association
Pour aller plus loin

Ce projet a mobilisé deux expertises.

Expertises mobilisées
Le secteur
Voisins
Parlons-en

Vous avez déjà la maquette, il vous manque le site ?

Réponse sous 48 heures ouvrées, avec une première lecture technique et un ordre de grandeur.

28 rue du Sentier
75002 Paris


    * Champs obligatoires. Vos données sont conservées trois ans, ne sont ni cédées ni revendues, et effaçables sur simple demande.