PROGRAMMATION DE SITE INTERNET
Etude de cas : Nathalie Amiand
Aujourd'hui, plus que jamais, il est inévitable pour une entreprise de posséder un site internet. Que ce soit simplement pour entrer en communication avec les internautes ou bien pour agrandir sa clientèle, un site web, à l'inverse des autres médias, permet de créer un lien direct avec ses clients partout et en temps réel.
​
Un site web est un investissement et non une dépense et les professionnels l'ont compris... En effet, même les TPE / PME investissent de nos jours dans un site web qui est, pour elles, un véritable moyen d'augmenter leur notoriété et améliorer leur visibilité sur le web.
​
​
Ainsi, dans notre module "Programmation de site internet", nous avons étudié les bases du langage HTML et CSS que nous avons mis en pratique par la suite lors de la création d'un site web pour le compte d'une conseillère en image, Nathalie AMIAND.
Notre intervenant, Mr Fabrice TARAUD, a mit à notre disposition un CMS (logiciel permettant de concevoir et gérer un site web via une base de donnée) ainsi qu'une plaquette PDF avec les contenus de la cliente (textes et images) afin de nous aider à concevoir ce site.
​
Cette création s'est effectuée en plusieurs étapes et devait respecter certaines normes imposées, telles que le code couleur, les contenus textes, les illustrations ainsi que les différentes catégories d'activité présentées sur la plaquette. Nous avons pu cependant choisir nous même l'arborescence du site, la mise en page et l'ajout d'éléments supplémentaires (illustrations, formulaire de contact...). Ce site a été conçu individuellement par chaque étudiant.
1ère étape : Arborescence
Les différents onglets du site étaient plus ou moins définit suivant la plaquette. Il était possible de distinguer assez facilement de l'arborescence que nous devions choisir.
​
Pour ma part, j'ai organisé le site en 6 pages distinctes dont 7 parentes :
​
- Page 1 : Accueil
- Page 2 : Pourquoi ?
- Page 3 : Les 4 étapes d'un conseil en image
dont 4 pages parentes ; La Colorimétrie, La Morphologie, Le Style, l'Accompagnement Shopping.
​
- Page 4 : Espace affaire
dont 3 pages parentes : Formation, Lieux d'intervention, Animation commerciale.
- Page 5 : Prestations - Tarifs
- Page 6 : Contact
2ème étape : Intégration sur CMS
Suite à l'élaboration du plan, j'ai commencé à créer mes différentes pages et à intégrer tous les contenus du PDF dans les pages correspondantes sur le CMS.
​
Concernant les illustrations, j'ai effectué une recherche sur la cliente (notamment sur sa page Facebook) afin d'intégrer des visuels différents de ceux déjà proposés dans la plaquette.
​
Egalement, afin de proposer un site design (au goût du jour) et afin de mettre en pratique mes connaissances en code HTML/ CSS, j'ai souhaité intégrer des éléments supplémentaires à mon site, non indiqués sur la plaquette. A savoir :
​
- Des pictogrammes cliquables en page d'accueil renvoyants directement vers les pages dédiées.
​
- Un formulaire de contact sur la dernière page "Contact" avec différentes possibilités de réponse (liste déroulante, question ouverte, choix d'une couleur sur un nuancier...).
​
- Une Google Map dans le footer (bas de page)
- Ainsi que quelques citations et un exemple de témoignage client fictif.
​
J'ai également utilisé Photoshop afin d'obtenir toutes les illustrations au format PNG (fond transparent) ainsi que pour mettre des images sous forme de "bulle".
3ème étape : Harmonisation du site
Harmoniser le site internet après intégration du contenu n'a pas été un travail simple. En effet, il fallait respecter les couleurs de la charte sur la plaquette, c'est-à-dire une dominance de gris/ blanc/ noir et rose.
Pour ce faire, il était nécessaire d'effectuer ses modifications directement dans la feuille de style CSS puisque l'éditeur ne le permettait pas.
​
​
Egalement, j'ai souhaité harmoniser les typographies de mon site ainsi que la taille des titres en respectant un certain ordre pour le bon référencement de celui-ci, à savoir les titres H1, H2, H3 et H4.
Pour consulter mon site, c'est par ici !
