Créer un site internet en langage HTML et CSS

board-75660_640Dans le cadre du cours « outils » de Mr Fondrat, il nous a été demandé de créer un site internet avec le logiciel KompozerCet outil est un éditeur HTML WYSIWYG (what you see is what you get), c’est-à-dire un logiciel permettant de créer des pages web en voyant le résultat final. J’ai décidé d’exploiter ce travail dans le cadre du futur lancement d’e-formations par des établissements de formation de la région Rhône-Alpes et de créer ainsi le site internet qui leur sera dédié.

Cette première expérience de création de site web a été pour moi très enrichissante.
Après avoir travaillé les cours du module et fait beaucoup de recherches sur le Web, j’ai commencé par la rédaction d’une note d’intention, afin d’expliquer le contexte, la problématique et la manière dont j’envisageais la création du site. J’ai aussi tenté de m’approprier le logiciel Kompozer en m’entraînant à créer des pages Web avec comme point d’appui les travaux demandés dans les autres modules du Master.
Je me suis ensuite attelée à travailler sur la charte graphique et les textes.

Je me suis ensuite lancée dans « le vif du sujet » avec Kompozer en créant les différentes pages du site et en y intégrant mes textes. Je travaille aussi sur des feuilles de style CSS (Cascading Style Sheets) qui permettent de déclarer la mise en forme de l’ensemble des pages du site.
Ces feuilles de style sont externes et liées au contenu dans le code html grâce à un link placé dans l’en-tête des pages. Le contenu et la forme sont donc crées indépendamment.

Cette expérience a été passionnante. Il était pour moi essentiel de comprendre ce que je faisais et la recherche bibliographique a donc été nécessaire, ainsi que l’étude d’autres sites internet en terme de contenus, d’ergonomie, de design et de techniques. Lorsque l’on débute, le temps passé à la veille et aux « tâtonnements » avec le logiciel Kompozer est important. Ce travail est à mener régulièrement, tout en travaillant l’ensemble des autres modules de la formation : apprendre en faisant est efficace mais il faut impérativement y consacrer beaucoup de temps.

En effet, l’expérimentation du code html peut être très long pour un néophyte. J’ai toutefois appris énormément au fur et à mesure de l’avancement du travail, ce qui m’aidera notamment pour la gestion des blogs du Master.
J’aurais souhaité disposer d’encore plus de temps pour pouvoir améliorer l’esthétique du site et ses fonctionnalités.

En effet, une fonction que j’aurais souhaitée n’a pas pu être ajoutée au site par manque de connaissance. J’avais en effet annoncé dans ma note d’intention que j’intégrerai un moteur de recherche à ce site. J’ai trouvé le code et la technique sur Internet que j’aurais donc pu inclure au site,
mais ne le comprenant pas suffisamment, j’ai fait le choix de le laisser de côté. Je l’intégrerai toutefois par la suite, tout comme les boutons de partage des réseaux sociaux.
J’ai pu intégrer deux formulaires de contact dans le site. Il s’est pourtant avéré que leur utilisation par l’internaute nécessite d’utiliser Outlook, ce que j’ai trouvé peu pratique.
J’ai trouvé sur le Web comment permettre l’envoi direct des formulaires sans Outlook en utilisant un script php qui recevra le formulaire et qui enverra ensuite son contenu par mail à l’adresse que j’aurai défini. J’utiliserai cette technique pour simplifier ainsi l’envoi de message par l’utilisateur n’utilisant pas Outlook par la suite.

La réalisation du menu m’a demandé beaucoup de temps, surtout pour comprendre la manière dont il devait être codé. De nombreuses tentatives ont échoué avant d’arriver au résultat final.

Enfin, j’ai rencontré des difficultés en testant mes pages sur différents navigateurs. Internet Explorer en particulier ne reconnait pas certaines propriétés reconnues par les autres, et il faut alors en créer spécialement lui.

Ce travail m’a permis d’apprendre énormément sur le langage HTML et la création de feuille de style CSS. De plus, j’ai eu l’opportunité de réaliser le site du Pôle E-Learning dans le cadre du Master mais aussi de le mettre à profit de ma pratique professionnelle.

Publicités

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s