Rapport de Projet No du projet Stagiaire(s) Module Année Groupe Formateur Conception d’un site Web Table des matières INTRODUCTION ........................................................................ ERROR! BOOKMARK NOT DEFINED. ANALYSE ..................................................................................................................................................... 3 CONCEPTION ............................................................................................................................................. 4 IMPLEMENTATION .................................................................................................................................. 7 Algorithmes ..................................................................................................................... 7 DISCUSSION................................................................................................................................................ 9 MANUEL DE L’UTILISATEUR ..............................................................................................................10 CONCLUSION ............................................................................................................................................11 REFERENCES ............................................................................................................................................12 1 Conception d'un site Web, Projet N° Error! Reference source not found. Ce rapport représente la démarche de création d’un site Web (ensemble de services et de fichiers d’information hébergés par un ordinateur (ou serveur) accessible sur Internet), par le langage HTML (Hypertext Markup Langage). En effet, ce site est un site personnel, statique, leur sujet s’intéresse à la programmation Informatique (Algorithmique, programmation Java). Ces sujets sont présentés par un style très claire et facile à consulter. En fait, l’algorithmique et la programmation Java s’avèrent indispensables pour la consolidation des connaissances informatique de base pour les débutants ainsi que pour les professionnels. Tout en offrant un arsenal important servant par la suite de développer la création des applications ou des programmes (projets). 2 Conception d'un site Web, Projet N° Error! Reference source not found. Ce projet a pour objet primordial de résoudre certains problèmes pléthoriques qu’affrontent les programmeurs débutants, dont on peut citer : o La rareté des références liées à la programmation o Les ressources disponibles sont difficiles à concevoir ou même à comprendre. o La clarté s’absente est l’ambiguïté s’impose quant à la consultation de certains sites Web appréhendés comme références de langage de programmation. Ex : o La majorité des ressources sont anglo-saxonnes, ce qui présente un obstacle face à nos recherches Webographique et bibliographique (francophone). o La pédagogie suivie par la structure de ce site vise l’analogie du duel théorie - pratique sous forme des exercices attachés au cours. 3 Conception d'un site Web, Projet N° Error! Reference source not found. J’ai réalisé ce projet (site Web) par le langage HTML qui permet de désigner la structure d’un document à l’aide de balises et d’établir des liens hypertextuels entre ses différents constituants et d’autres textes. La première étape de ce travail est la recherche d’un sujet ou bien le contenu qu’on doit traiter dans le site Web. J’ai fait des recherches sur le NET, sur des livres, des documents et d’autres ressources qui traitent le même sujet de ce site Web en n'oubliant pas bien sûr les cours et les documents de nos professeurs de l’institut. La deuxième étape est la réponse de certain nombre de questions : « comment je peux ajouter ces informations ? de quelle manière ? Et sous quelle structure ? ». L’ajout des informations dans la page Web exige une connaissance d’un langage de création d’un site Web (pas du plagiat bien sûr ) dont on note le langage HTML. Premièrement, j’ai procédé au dispatching de la page Web en frame pour bien visualiser la structure éventuelle du site, tout en faisant appel au code suivant : <frameset rows="120,*" > <frameset cols="60,156,60"> <frame > <frame > <frame > </frameset> <frameset cols="178,*"> <frame name="sommaire”> <frame name= "principal”> </frameset> </frameset> 4 Conception d'un site Web, Projet N° Error! Reference source not found. Frame1 : c’est le sommaire qui présente la structure générale du site en question (voir le code approprié a cette Frame dans la partie Algorithme : « code sommaire »). Frame2 : c’est la page principale du site qui présente les différentes rubriques citées en sommaire (voir le code approprié a cette Frame dans la partie Algorithme : « code principal »). Frame3 : c’est le bannier du site (voir le code approprié a cette Frame dans la partie Algorithme : « code bannier »). Deuxièmement, j’ai opté pour l’affectation entre ces Frames par des liens hypertextuels, en procédant le code suivant : 5 Conception d'un site Web, Projet N° Error! Reference source not found. <html> <Head> <base target="principal"> </Head> <body> <a href="principal.html"><img border=0></a> ……… </body> </html> src="images\index.png" alt="index" <base target="principal"> : c’est le code HTML qui renvoie le contenu de la rubrique sur laquelle en avait cliqué dans Frame2 (principal). 6 Conception d'un site Web, Projet N° Error! Reference source not found. J’ai choisie l’aspect général du site (sommaire, bannier, principal), car la plupart des sites personnels Web utilisent ce style et aussi l’extensibilité de naviguer dedans le site (clique sur une rubrique dans le sommaire et l’affichage dans la page principal). Par la suite je décrit les différents codes utiliser dans chaque Frame du site. Algorithmes Le code général de la page Web : <html> <head> <title>Algorithme Java</title> </head> <frameset rows="120,*" border=0> <frameset cols="60,156,60"> <frame src="bannier1.html"> <frame noresize name=bannier src=bannier.html> <frame src=bannier2.html> </frameset> <frameset cols="178,*"> <frame noresize name=sommaire src=sommaire.html> <frame name=principal src=principal.html> </frameset> <noframes> <BODY onLoad="alert(' Bienvenue dans le site de programmation');" onUnload="alert('Merci pour ta visite');"> <p>Cette page utilise des cadres, mais votre navigateur ne les prend pas en charge.</p> </body> </noframes> </frameset> </html> Code Frame1 : <html> <head> <base target="principal"> <LINK rel=STYLESHEET href="pages\régle.css" type="text/css"> </head> <body> 7 Conception d'un site Web, Projet N° Error! Reference source not found. <div align="center"> <a href="principal.html" ><img src="images\index.png" alt="index" border=0></a><br> <a href="biographie.html" ><img src="images\biographie.png" alt="Ma biographie" border=0></a><br> <a href="courjava.html" ><img src="images\courj.png" alt="Cours java" border=0></a><br> <a href="couralgo.html" ><img src="images\coura.png" alt="cours algorithme" border=0></a><br> <a href="exejava.html" ><img src="images\exej.png" alt="exercices java" border=0></a><br> <a href="exealgo.html" ><img src="images\exealgo.png" alt="exercices algorithme" border=0></a><br> <a href="livre.html" ><img src="images\livre.png" alt="livre d'or" border=0></a><br> <br><br><br><br><bR> Copyright © 2005 Pino<br> </div> </body > </html> Code Frame2 : Cette partie a pour but d’afficher des déférentes pages dans le site après une clique d’un lien dans la section sommaire, c’est à dire que cette partie (principal) n’a pas un code HTML principal. Code Frame3 : <html> <body> <center><img src="images\image2.gif"></center> </body> </html> Le code des autres pages (index, Ma biographie, cours Java, cour algorithme, Exercices Java, Exercices algo, Livre d’or) contient les informations traiter dans la page lui même avec des balises, fichier CSS, images… <html> <head> <LINK rel=STYLESHEET href="régle.css" type="text/css"> </head> <body> « informations traiter à la page » …… </body> </html> 8 Conception d'un site Web, Projet N° Error! Reference source not found. Chaque projet avoir des points forts et d’autres faibles. Les points forts de ce projet sont : Le site traite un sujet qui nous émouvons (les stagiaires de l’informatique). La ductilité des informations présenter dans le site par contre les autres sites Web sur le Net. La commodité de naviguer dans le site sans avoir des difficultés d’appréhender les liens ou bien l’affichage des informations. La pédagogique théorie – compréhension de sujet traiter. pratique pour une bonne La céleste interface avec des images qui donnes aux l’internautes un bon début de naviguer dans le site et de lire les sujets dedans le site. Les points faibles de ce projet sont : Les différents affichages (résolution de l’écran) ne donne pas au site une immobilisation de leur aspect. La taille de la police est petite. Les solutions des exercices java ou bien algorithme ne sont pas traitées dans le site 9 Conception d'un site Web, Projet N° Error! Reference source not found. Le stagiaire, le professeur, le débutant et aussi le professionnel trouveront dans ce manuel les éléments qui le dirige pendant leur visite. Le site est divisé en sept parties : L’index vous permet de reconnaître le principe et le sujet de site et aussi l’email de l’auteur. La biographie vous permet de savoir la vie de l’auteur de site. Cours java vous permet d’étudier le langage java en détail avec des exemples pour commodité la compréhensibilité du langage. Cours algorithme vous permet de résoudre des problèmes posés par l’informatique avant d’écrire un programme en utilisant un langage compréhensible par la machine. Exercices java vous permet de pratiquer le langage après une étude dans la partie cours java. Exercices algo vous permet de pratiquer le langage après une étude dans la partie cours algorithme. Livre d’or vous permet d’ajouter vos questions et remarques pour améliorer le site. Plus que ces éléments, un administrateur peut gérer le site a partir de son code HTML. 10 Conception d'un site Web, Projet N° Error! Reference source not found. La création d’un site Web constitue une phase essentielle pour la formation de tous stagiaires. Apprendre le langage HTML (les balises HTML, l’insertion des images, les liens hypertextuel, les frames…) est l’objectif primordial de ce projet, ainsi la recherche des autres informations concernant le langage. Algojava est une solution efficace pour comprendre l’algorithme et java (même il n’y a pas beaucoup des exercices), Enfin, je remercie à ceux qui ont participé de prés ou de loin à la réussite de mon travail. 11 Conception d'un site Web, Projet N° Error! Reference source not found. « Programmation des applications informatiques » Kalifa MANSOURI « l’objet par java : initiation au langage [base] » Mr Valéry Guilhem Frémaux www.ccim.be/ccim328/html/index.html 12 Mr