Service Social Breton.org

Refonte d'un site internet pour une association d'hébergement

Service Social Breton.org

Association

Refonte de site internet pour l'association Service Social Breton
La refonte d'un site internet pour l'hébergement sur Paris de l'association Service Social Breton
4.3/5 pour 35 notes

Notez cette page
Note sur 5
Je sélectionne des étoiles

Votre note a bien été prise en compte, notre équipe vous remercie pour votre collaboration.

Vous avez déjà noté cette page, encore merci pour votre collaboration !

Le projet

Service Social Breton

Après avoir réalisé la première refonte du site de l'association en 2010, notre équipe a été sollicitée pour lancer une nouvelle refonte. L'objectif de cette seconde refonte était de rendre le site plus moderne et de répondre aux exigences des nouveaux formats d'écran. La refonte a également permis à l'association de reformuler les contenus des textes et des images relatifs à l'amélioration de l'établissement.

Le nouveau site internet de l'association comporte dorénavant une grande page d'accueil comprenant le résumé des pages intérieures. Un ensemble de pages pour présenter l'association avec : bienvenue à l'association, à propos de l'association, l'établissement, les lieux de vie, l'équipe, les conditions d'admission, l'historique, l'accès au foyer, le formulaire d'inscription.

S'agissant d'un site de présentation d'activité qui n'a pas vocation à être modifié régulièrement, le site internet de l'association n'est pas dynamique et sera donc mis à jour par notre agence une fois par an. Un des avantages du choix de réaliser un site statique est d'avoir une présentation soignée de l'ensemble des pages du site. Notre agence a donc pris en charge la mise en page des contenus conformément aux exigences de l'association.

Le fait de choisir un site statique par rapport à un site dynamique a permis à l'association d'avoir un résultat plus professionnel pour un coût moins élevé comparé à un site dynamique qui nécessite plus de développement et une base de données.

Nos solutions étant garanties pour une durée de deux ans, le site internet de l'association sera mis à jour et modifié gratuitement pendant cette période.

Voir le site en ligne

Service Social Breton
Association à but non lucratif, reconnue d’utilité publique pour l'hébergement temporaire des jeunes femmes

Le haut de page après refonte

La refonte du site de l'association

Le haut de page est composé d'un menu général, séparé en deux par le logo de l'association. Le menu donne accès aux pages importantes du site internet. En version mobile, le menu est masqué pour ne laisser que le logo qui permet, par un clic sur celui-ci, d'ouvrir le menu général afin de permettre la navigation.

Le bas de page après refonte

Le bas de page est composé du logo, d'une information sur le nombre de personnes hébergées chaque année, d'un menu réseau social. Puis, plus bas, un espace dans lequel vous pourrez trouver toutes les coordonnées de l'association ainsi qu'un plan récapitulatif des pages du site internet. Enfin en bas de page, le nom du site et les informations de copyright ainsi qu'un lien vers notre agence web.

La page d'accueil

L'établissement, les lieux de vie,...

La page d'accueil regroupe en résumé les pages intérieures du site avec par ordre à partir du haut:

  • Une présentation animée composée d'une suite de grands visuels
  • Un photomontage de diverses photographies de l'association avec diaporama
  • L'association en bref avec quelques chiffres clés
  • L'établissement avec des liens vers l'historique, qui sommes nous...
  • Les lieux de vie en résumé avec quelques chiffres
  • L'équipe du foyer avec les principaux responsables de l'association
  • L'accès au Service Social Breton, plan de site et accès en transport par bus et métro.

Voir de détail de la page en ligne

Les pages de présentation

L'association, l'équipe, l'établissement...

Les pages intérieures présentent l'association en textes et en images et détaillent les informations résumées de la page d'accueil. La page d'inscription qui permet de postuler à un logement a été décomposée en plusieurs étapes. Cela a permis d'être compatible avec les versions mobiles et d'enregistrer les champs du formulaire au fur et à mesure.

Etablir ensemble les objectifs du projet

Définition de projet

Avant de lancer la production d'un site internet de présentation d'activités, il convient de prévoir un briefing de projet. Le briefing de projet nous permet de rencontrer les personnes responsables à même de nous expliciter leurs attentes. Ainsi, après une écoute attentive nous avons fixé les objectifs de la refonte qui servira de fil conducteur tout au long du projet.

En savoir plus sur le briefing de projet

Briefing de projet
Le briefing de projet est un document qui défini les orientations globales du projet avant de lancer la production.

Plan du site de l'association

S'agissant d'un mini site internet, il n'était pas nécessaire de passer du temps à l'établissement d'un plan des pages. Il était préférable de réaliser un plan de suivi et validation de toutes les étapes de la réalisation du site.

Concevoir et imaginer les différentes formes du projet

Structure et prototype

Avec un budget très réduit, il n'était pas envisageable de réaliser des maquettes pour tous les modèles de pages du site internet. Notre équipe a donc lancé la conception graphique directement sans cette étape. Des ajustements graphiques ont ensuite permis une meilleure mise en page des contenus.

Interface graphique
La conception d'interface graphique pour une expérience intuitive chez les utilisateurs.

Dessiner et mettre en image le projet

Conception graphique

Pour la conception graphique, il s'agissait de proposer un graphisme à la fois simple et moderne afin de privilégier la présentation des pages. L'association venant juste de terminer des travaux de rénovation, il était donc important de mettre en valeur l'établissement avec un graphisme adapté et une mise en page qui met en valeur le contenu.

Pour ce faire, nous avons donc procédé à un lifting du logo qui était auparavant encadré. Nous avons utilisé les couleurs jaune et orange pour souligner différents aspects importants du site. S'agissant d'un site en responsive design, nous avons travaillé à la conception d'un graphisme adaptatif pour proposer une version sur tablettes et sur smartphones privilégiée par les utilisatrices. Après quelques modifications mineures, l'étape graphique fut approuvée par l'association et nous sommes ensuite passés au développement.

En savoir plus sur la conception graphique

Produire et donner vie au projet

Production et intégration

L'utilisation du HTML5 facilite le développement des pages, grâce aux nouvelles balises qui permettent de mieux structurer le code et de gagner en lisibilité. Le CSS3 avec les Médias Queries facilite la déclinaison du site en version tablette et smartphone. S'agissant d'un site statique pour la plus grande partie, nous avons procédé au codage de toutes les pages web du site. Puis une fois codées, nous avons ajouté le contenu de l'association, les textes, les images et les autres médias.

Pour le formulaire de demande d'adhésion, celui-ci étant très long, il était préférable de procéder par étapes successives et d'enregistrer les données utilisateurs au fur et à mesure. Nous avons donc réalisé toutes les étapes du formulaire puis ajouté des actions en Ajax afin de n’afficher qu'une étape à la fois.

Déclinaison pour téléphone

Le développement dynamique

Après avoir terminé toutes les pages du site, nous avons ajouté le codage PHP pour rendre le site en partie dynamique. Cela afin de faciliter l'enregistrement du formulaire et l'interaction avec des modules indispensables au bon fonctionnement du site.

Le formulaire d'inscription

La gestion du site

Le site internet de l'association étant statique et mis à jour par notre agence, il n'était donc pas nécessaire d'ajouter notre application de gestion de contenus.

La validation du projet

Avant de procéder à l'ouverture du site, Olloweb lance une vérification complète du site internet afin de garantir le codage. Le site d'information une fois validé est garanti pour une durée de deux ans. Cette garantie couvre les bugs éventuels et les mises à jour des navigateurs.

Mesurer et analyser la réussite du projet

Référencement et statistiques

Pour obtenir les statistiques de fréquentation du site, nous procédons à l'installation de module Google ou Piwik. Un plan de l'ensemble des pages web du site est rendu disponible en ligne et ajouté dynamiquement pour Google et les autres moteurs de recherche. Par ailleurs l'hébergement OVH propose des statistiques fiables avec l'analyse des logs du site.

En savoir plus sur les statistiques

Les statistiques
Suivre une action en image par l'intermédiaire de statistiques aussi riches que possibles.

Coordonner les différentes phases du projet

Conduire et réaliser

La conduite du projet, le prototypage, la conception graphique, la réalisation technique et le CMS ont été réalisés au sein de l’agence Olloweb.

Galerie de conception

Refonte d'un site internet pour une association d'hébergement

Diaporama

Refonte de site internet pour association

Conception graphique de la page d'accueil de l'association

Refonte de site internet pour association

Conception graphique de la page de bienvenue de l'association

Refonte de site internet pour association

Conception graphique de la page de l'association

Refonte de site internet pour association

Conception graphique de la page de l'établissement de l'association

Refonte de site internet pour association

Conception graphique de la page des lieux de vie de l'association

Refonte de site internet pour association

Conception graphique de la page d'admission de l'association

Refonte de site internet pour association

Conception graphique de la page l'équipe de l'association

Refonte de site internet pour association

Conception graphique de la page historique de l'association

Solution et tarif

Relookez votre site internet de présentation d'activité pour optimiser le référencement et dynamiser votre image

Refonte de site de présentation sur-mesure
OFFRE PRO

Refonte de site internet de présentation sur-mesure

Dynamisez votre site internet de présentation d'activité avec une mise en page professionnelle, un nouveau graphisme plus original, un développement compatible avec les nouveaux formats d'écrans et un référencement naturel performant.

L'offre de refonte de site internet de présentation sur-mesure

Estimation gratuite, nous consulter

Notre équipe peut vous aider pour votre projet.
Prenez rendez-vous dès maintenant ou appelez le 01 60 08 05 11

Appelez-moi / Nous contacter

Indiquez votre nom
Indiquer votre prénom
Indiquer votre numéro de téléphone
Indiquer votre adresse email (utilisateur@domaine.com)
Indiquer le contenu de votre message
Je souhaite être appelé
J'indique une date de rendez-vous
Je sélectionne une heure de rendez-vous

*Champs obligatoire
Conformément à la loi informatique, aux fichiers et aux libertés n°78-17 du 6 janvier 1978, vous disposez d'un droit d'accès et de rectification relatif à toutes informations vous concernant sur simple demande à notre adresse.

Votre de demande de renseignements a bien été prise en compte,
notre équipe y répondra dans les plus bref délais.

  • Un projet ?
  • Faites-vous rappeler par téléphone
Indiquez votre nom
Indiquez votre prénom
Indiquez votre numéro de téléphone
Indiquez votre adresse email (utilisateur@domaine.com)
Indiquez le contenu de votre message

*Champs obligatoires
» Demande de devis

Votre demande de renseignements a bien été prise en compte,
notre équipe y répondra dans les plus brefs délais.