Nous avons vu jusqu'ici comment créer correctement une page HTML ainsi que comment habiller cette page HTML avec les CSS. Nous allons maintenant nous préoccuper de la création d'un site web en entier et surtout de la méthodologie à employer.
La création d'un site Web professionnel peut être divisée en plusieurs étapes que voici :
Cette partie ne sera pas détaillée. Vous aurez des cours dans votre cursus sur ce sujet mais retenez que chaque projet informatique commence toujours par un cahier des charges. Il s'agit tout simplement de poser sur le papier les demandes du client de manière la plus précise possible.
Pour vous, cette étape est déjà faite ! En effet, dans le cadre du
projet de site web que nous vous demanderons de réaliser, le cahier
des charges est tout simplement l'énoncé ou les instructions que
l'on vous donnera.
Cette étape consiste à réaliser sur papier ou avec un outil informatique une maquette du site. L'idée est de savoir comment sera découper le site Web. Un menu en haut ?, un menu à gauche, quelles rubriques ?, un logo ? , que mettre dans les différentes zones définies ? , comment agencer le contenu (niveau de titres, ...), choix des couleurs ?
Soyez le plus précis possible pour cette étape ! Exemple :
Il ne suffit pas de dire : "j'aurai un menu à gauche" mais
posez-vous la question de savoir quels items constitueront ce menu
et notez-les !
Dans le monde professionnel, cette étape
sous-entend une communication avec le client car on réalise le site
Web selon ses goûts évidemment. Pour vous par contre, dans le cadre
du projet vous êtes libre de créer le site Web selon vos goûts ce
qui devrait rendre cette partie moins chronophage.
Pour cette étape, n'hésitez pas à parcourir le web à la recherche d'idées, de vous inspirer d'autres sites. Attention toutefois à rester dans l'inspiration et non pas dans la copie intégrale d'un autre site. Ce syllabus que vous êtes entrain de lire peut également faire partie de vos sources d'inpiration mais nous insistons sur le mot inspiration.
C'est cette partie qui vous prenda le plus de temps ! L'idée est la suivante : transcrire en HTML/CSS le design effectué. Pour cette étape, vous devez donc aboutir à un modèle de page pour l'ensemble de vos pages du site Web. On place généralement en premier lieu l'entête, le menu et le pied-de-page. On crée une feuille de style CSS pour positionner, habiller ces éléments comme ce qui a été décidé dans le design. On place ensuite la partie centrale et autres de la même manière dans lesquelles on peut mettre un contenu fictif dans un premier temps.
Lors de cette étape, vous n'oublierez pas de valider le HTML et CSS
régulièrement !!!
Pour être sur le Web, un site doit se trouver sur un serveur Web. Un hébergeur a pour rôle de faire marcher un (des) serveur (s) Web. Il faut donc contacter un hébergeur pour disposer son site sur Internet. Mais comment?
De nombreuses sociétés proposent ce service avec des prix divers. Voici quelques critères dont il faut tenir compte lorsqu'on recherche un hébergeur:
Cette étape finale n'est pas demandée !
La vidéo présente ci-contre montre comment appliquer cette méthodologie pour créer un site Web.
Elle vous sera normalement utile pour réaliser le petit projet HTML.
Vous avez ici un lien vers le code source de la démonstration. N'hésitez pas à le télécharger
, le tester et à vous en inspirer !
Code source de la démonstration