Creation D Une Page Web

Cration des pages web
Creation dune page Web

Par Romica TRANDAFIR
Table des matires 4. Cration des pages web...................................................... 2

4.1. Prsentation gnrale du langage HTML...........................................................................2 4.2. Les principales balises du langage HTML.........................................................................2 4.3. Les listes ..................................................................................................................................4 4.4. Les liens...................................................................................................................................5 4.1.1. Lien externe.....................................................................................................................5 4.1.2. Lien local.........................................................................................................................6 4.1.3. Lien mixte........................................................................................................................6 4.5. Insertion des images ..............................................................................................................7 4.6. Le fond (background)............................................................................................................9 4.7. Les tableaux............................................................................................................................9 4.7.1. Le contenu des cellules dun tableau........................................................................10 4.8. Les frames .............................................................................................................................10 4.9. Langages spcialiss en rdigeant des pages web..........................................................12 4.10. Conseils finals utiles..........................................................................................................12 4.11. Cration dun site Internet................................................................................................12 4.11. Application..........................................................................................................................13 Fichier EX.HTM........................................................................................................................16 Fichier TABLEAUX.HTM......................................................................................................18 Fichier FRAMES.HTM............................................................................................................20 Fichier DEP.HTM .....................................................................................................................21 Fichier AUF.HTM.....................................................................................................................22 Fichier FRANAIS.HTM........................................................................................................22 Fichier ANGLAIS.HTM ..........................................................................................................23 Fichier IMAGES.HTM.............................................................................................................24 Fichier PH11.HTM....................................................................................................................25 Fichier PH21.HTM....................................................................................................................25 Fichier PH22.HTM....................................................................................................................26 Fichier LISTECA.HTM ...........................................................................................................26 Bibliographie...................................................................................................................................28
Utilisation des ordinateurs
4. Cration des pages web

Un site Internet est un ensemble de pages web, relies entre elles, gnralement consacres un sujet dtermin, et qui sont portes la libre connaissance de la communaut des internautes. Un site Internet constitue l'outil le plus moderne de communication et de publication. Pour la ralisation dune page web on a besoin dun langage specialis, le langage HTML (Hyper Text Markup Language).
4.1. Prsentation gnrale du langage HTML

HTML (HyperText Maker Language) est le langage universel utilis pour communiquer sur le Web. Linformation sera transporte sur Internet, pour aboutir sur l'ordinateur dun lecteur grce un programme appel navigateur ou browser.
Un browser permet de surfer sur le Net et d'afficher sur cran les "pages" qu'il a interceptes. Il y a beaucoup de marques et de types de browsers diffrents. Les plus connus sont Netscape et Internet Explorer de Microsoft mais il en existe beaucoup d'autres. Chaque browser a sa propre faon de travailler.
Html est un langage universel qui s'adapte toutes les plates-formes que ce soit Windows, Macintoch, Unix, OS/2... Dans le texte de la page il faudra inclure des instructions pour le browser de celui-ci. Ces instructions seront diffrencies de texte par les signes < et > par exemple <html>. Ces "instructions" s'appellent des tags ou des balises. Les balises de la page HTML marquent une action pour le browser et prcisent les modalits de faire cette action par les attributs. Le langage Html tant un ensemble de balises et d'attributs, il parat utile de les passer en revue.
4.2. Les principales balises du langage HTML

Pour dfinir un document HTML ayant un titre et un corps on utilise les balises ou tags suivantes :
Balise <HTML> </HTML> <HEAD> </HEAD> <TITLE> </TITLE> <BODY> </BODY>
Action le dbut d'un document de type HTML la fin d'un document de type HTML le dbut de la zone d'en-tte la fin de la zone d'en-tte le dbut du titre de la page la fin du titre de la page le dbut du document proprement dit la fin du document proprement dit
Remarques : 1. chaque balise de dbut d'une action, soit <...>, correspond (en toute logique) une balise de fin d'une action </...> 2. les balises ne sont pas "case sensitive" (par exemple, les formes suivantes sont quivalentes : <HTML>, <html>, <Html> ). Pour introduire un texte sous le format voulu on emploie les balises Type Gras Italique Taille de caractre Couleur de caractre A la ligne Commentaires Centrage En anglais Bold Italic Font size Font color Line break Comments Center Balises ; <!commentaire--> <Center> </Center> Actions Dbut et fin de zone en gras Dbut et fin de zone en italique Dbut et fin de zone avec cette taille Dbut et fin de zone en couleur Aller la ligne Ne pas afficher Centrer
Remarques. 1. Le mme browser ne tient compte que d'un seul espace entre les mots. Exemple :
texte
en bleu est quivalent texteen bleu Attention lutilisation des balises imbriques. Ainsi ... est correct et ... risque de vous crer des ennuis. 2. La taille dans peut tre indique de deux faons : a) avec un nombre de 1 7. La valeur par dfaut tant 3. b) de faon relative par rapport la valeur par dfaut (ici 0). Soit -3 -2 -1 0 +1 +2 +3. 3. Quelques codes des couleurs sont donnes dans le tableau
Couleur Bleu Rouge Vert Jaune
Code #0000FF #FF0000 #00FF00 #FFFF00
Couleur Blanc Gris clair Violet Noire
Code #FFFFFF #C0C0C0 #8000FF #000000
Pour introduire une citation ayant un lger retrait gauche et droite on utilise le tag <BlockQuote> </BlockQuote> . La balise <PRE>...</PRE> affiche un texte dit prformat. Le browser prend ainsi en compte tous les espaces et sauts de ligne dfinis l'cran. Par exemple : <Pre>U t i l i s a t i o n d e s o r d i n a t e u r </Pre> Le tag <ADDRESS>...</ADDRESS> est utilis pour indiquer une adresse postale (gnralement en fin de document). Exemple : Universit Tchnique de Constructions Bdoul Lacul Tei, 124, Bucarest 2 , Ro 72302 La balise texte souligne le texte. Par la balise <BLINK>...</BLINK> on introduit un texte clignotant. Les tags ... et ... placent le texte respectivement en indice et en exposant. Ainsi, indexbasepuissence aura comme rsultat puissence . indexbase Pour aligner du texte, on a utilis l'attribut ALIGN ou le tag <CENTER>. Il existe une balise permettant d'aligner diffrents lments. C'est le tag : <DIV align=left>...</DIV> <DIV align=center>...</DIV> <DIV align=right>...</DIV>
4.3. Les listes

Tout document d'une certaine consistance se doit de prsenter, par exemple dans la table des matires, le s diffrents niveaux de son expos. Html dispose d'outils spcialement conus cet effet. Le tableau ci-dessus les prsentes.
Pour crer En-ttes
En anglais [Heading]
Liste non-ordonne [Bullet list] Liste ordonne [Numbered list]
Elment de liste Paragraphe
[List items] [Paragraph]
La balise Action <Hn></Hn> avec Afficher un en-tte n=1 6 de niveau n et sauter une ligne <UL></UL> Afficher le texte sous forme d'une liste non-ordonne. <OL></OL> Afficher le texte sous forme d'une liste ordonne. <LI> Voici un lment de la liste Saut de ligne, insrer une ligne vierge et commencer un paragraphe
4.4. Les liens

Html est un langage hypertexte (et hypergraphique) qui permet en cliquant sur un mot, gnralement soulign (ou une image) de transporter : vers un autre endroit du document vers un autre fichier Html situ sur le mme ordinateur vers un autre ordinateur situ sur le Web. Ce systme d'hypertexte est pareil comme les fichiers d'aide de Windows. Ce sont les liens qui permettent de surfer de page en page qui constituent l'essence des documents Html. La syntaxe de ces liens entre plusieurs pages, est simple mais entranera de nombreux commentaires : <A HREF="URL ou Adresse">...</A>
4.1.1. Lien externe
Tout ordinateur situ sur le rseau Internet possde une adresse ou une URL (Universal Ressource Locator). Html permet d'accder toutes les machines et toutes les ressources du Net. Ces sont les adresses du type : http://serveur/chemin.../fichier ftp://serveur/chemin.../fichier
mailto:utilisateur@hte
4.1.2. Lien local

L'organisation classique et plus que conseille d'un site Web consiste regrouper l'ensemble des lments de celui-ci (fichiers htm, images, ...) dans un mme rpertoire. On pourrait ainsi "transporter" aisment un site pour le prsenter sur un autre ordinateur et le charger sur un serveur. Cette faon de procder est la plus aise et vitera pas mal de problmes. L'adresse du lien sera alors tout simplement fichier.htm
4.1.3. Lien mixte

On entend par-l un lien vers un fichier situ un autre ordinateur que celui qui contient le site. Il est peut probable que le serveur Web qui hbergera le site, possde la mme arborescence que le disque local. L'adresse prendra la forme
file:///lecteur:/rpertoire/fichier.htm (en adressage absolu)
../../../fichier.htm (en adressage relatif). Cette matire d'adressage absolu et relatif dpasse le cadre du ce cours et il est indiqu de consulter la documentation relative ce sujet. Des liens peuvent aussi pointer vers un endroit prcis du mme document ou d'un autre fichier. C'est ce qu'on appelle les ancres, ancrages ou pointeurs [Anchor]. Lien Point d'ancrage Vers une ancre dans la mme page Vers une ancre dans une autre page La balise <A NAME="***">...</A> <A HREF="#***">...</A> <A HREF="URL#***">...</A> Effet Ceci est une cible Lien vers la cible *** dans la mme page Lien vers la cible *** dans une autre page
Rgle pratique Plusieurs liens l'intrieur d'un mme document supposent que ce document prsente une certaine longueur sinon une longueur certaine (et donc un temps de chargement assez long). Ainsi, on prfrera gnralement cette technique le dcoupage d'une longue page en un ensemble de plusieurs pages de dimension plus rduite.
4.5. Insertion des images

Il y a deux formats d'image reconnus sur le Web, qui sont le format GIF (version 89a) et le format JPEG. Pour le format GIF (maximum 256 couleurs), on retiendra la caractristique "entrelac" qui permet de charger progressivement l'image lors de l'ouverture de la page. Ces deux formats donnent des rsultats assez quivalents bien que JPG soit plutt recommand pour des images avec des tons nuancs ou dgrads. Plus l'image sera grande, plus le temps de chargement sera long... au risque de dcourager les visiteurs de la page. Si cela est possible, une image en 16 couleurs peut trs bien faire l'affaire. On peut prsenter une petite image indiquant un lien vers l'image complte. Pour insrer une image qui se trouve ladresse de limage le code HTML est <IMG SRC="Adresse de l'image"> Le tableau suivant donne les attributs de la balise IMG Action Texte alternatif Dimensions Bordure Alignement Attribut alt="****" width=? height=? border=? align=top align=middle align=botton align=left align=right Effet Pour les browser n'ayant pas l'option "image" active Hauteur et largeur (en pixels) (en pixels) Etablie la position
4.5.1. Commentaires
En Html, l' image ne fait pas partie de document. Le browser va la chercher l'adresse indique. Gnralement, on place les images dans le mme rpertoire que les pages Html. Le fait d'utiliser la mme image plusieurs reprises dans un fichier Html ne modifie en rie n sa taille. Prvoir un texte pour les browsers n'ayant pas l'option image active, permet au lecteur de ne pas perdre le fil de l'expos. Il est important pour la fluidit de l'affichage de prciser la taille en hauteur et largeur de l'image car le browser peut ainsi connaissant l'emplacement rserver pour celle -ci, continuer afficher le texte. Cette information est donne par Paint Shop Pro.
4.5.2. L'attribut Align

L'attribut align positionne l'image par rapport au texte : Exemple. <IMG SRC="UTCB.gif" align=TOP>Fichier d'adresse <IMG SRC="UTCB.gif" align=CENTER>Fichier d' adresse <IMG SRC="UTCB.gif" align=BOTTOM>Fichier d' adresse
4.5.3. Lien sur image

Les balises sont : <A HREF="UTCB.htm"><IMG SRC="UTCB.gif"></A> En cliquant sur l'image, on ouvre un fichier nomm "UTCB". Remarquons que les images cliquables sont entoures d'une bordure.
4.5.4. Les sparateurs

Les browsers intgrent un outil de mise en forme intressant pour clarifier la prsentation du texte. C'est la ligne horizontale. La syntaxe en est simple: Sparateur Ligne horizontale En anglais Horizontal Rule Balise <HR> Effet Insrer une ligne horizontale
Ce tag simple, permettra de comprendre un peu mieux le fonctionnement du navigateur. D'abord, vous avez dj dcouvert au fil de vos erreurs qu'il est plutt gentil car il s'efforce toujours d'afficher quelque chose. Ensuite, il vous mnage le travail en prenant sa charge des valeurs par dfaut d'un certain nombre d'attributs. Dans le cas prsent, les valeurs par dfaut de la balise <HR> sont : une paisseur de trait de 2 pixels, un alignement centr et une largeur de 100% de la fentre. Vous pouvez trs bien modifier au gr de votre fantaisie les valeurs de ces diffrents attributs
Action Balise Remarques
Epaisseur Largeur Alignement
<HR size=?> HR width=?> <HR width="%"> <HR align=left> <HR align=right> <HR align=center>
en pixels en pixels en % de la fentre gauche

droite
centr
Commentaires On prfrera spcifier la largeur en % de la fentre plutt qu'en pixels car l'affichage s'adaptera ainsi toutes les tailles et rsolutions d'cran. On peut prfrer l'usage d'images comme sparateur pour personnaliser louvrage.
4.6. Le fond (background)

Le langage Html permet d'agrmenter la prsentation du document d'un arrire-plan [background] color ou compos d'une image. Ce qui apporte un lment "artistique" la page. Les balises sont donnes dans le tableau suivant. Etablir Couleur du fond Texture du fond Balise <BODY BGCOLOR="#$$$$$$"> <BODY BACKGROUND="Adresse">
Il y a des balises pour modifier les couleurs utilises par dfaut par le browser pour le texte et les lie ns (voir le tableau suivant). Couleur de Balise
Couleur de texte Couleur de lien Lien visit Lien actif
<BODY TEXT="#$$$$$$"> <BODY LINK="#$$$$$$> <BODY VLINK="#$$$$$$> <BODY ALINK="#$$$$$$>
4.7. Les tableaux

En Html, les tableaux servent non seulement aligner des chiffres mais surtout placer des lments l'emplacement qsouhait. Un tableau est compos de lignes et de colonnes qui forment les cellules du tableau. Les balises de base sont donc Dfinition En anglais Balise Tableau [Table] <TABLE></TABLE> Ligne [Table Row] <TR></TR> Cellule [Table Data] <TD></TD> Signification Dbut et fin de tableau Dbut et fin de ligne Dbut et fin de cellule
On peut adjoindre des bordures en utilisant la balise <TABLE border=?></TABLE> . Il y a encore trois lments (dfinis par dfauts mais modifiables) :
10
Elment modifier Balise L'espace entre les cellules ou l'paisseur <TABLE cellspacing=?> des lignes du quadrillage L'enrobage des cellules ou l'espace entre le <TABLE cellpadding=?> bord et le contenu La largeur de la table <TABLE width=?> <TABLE width=%>
4.7.1. Le contenu des cellules dun tableau

Les cellules dun tableau peuvent contenir tous les lments Html dj passs en revue soit : du texte des images des liens des arrire-plans et mme des tableaux. On peut modifier les cellules en utilisant les balises suivantes. Modification Largeur d'une cellule Fusion de lignes Fusion de colonnes Balise <TD width=?> <TD width=%> TD rowspan=?> <TD colspan=?> Remarque En pixels en pourcentage
On peur arranger le contenu du tableau par les balises : Arrangement Ligne de tableau Cellule de tableau Couleur de la cellule Balise <TR align=left/center/right> <TR valign=top/middle/bottom> <TD align=left/center/right> <TD valign=top/middle/bottom> <TD BGCOLOR="#$$$$$$"> Remarque Horizontalement Verticalement Horizontalement Verticalement
4.8. Les frames

Pour diviser l'cran en plusieurs fentres, sont utilises les balises suivantes.
11
Arrangement Zone avec des fentres Agencement des fentres
Balise <FRAMESET> </FRAMESET> FRAMESET ROWS="..."> <FRAMESET COLS="...">
Dfinition Dbut de zone avec des fentres Fin de zone avec des fentres Fentres horizontales Fentres verticales
Attention! <FRAMESET></FRAMESET> remplace <BODY></BODY> Pour dfinir les caractristiques dune fentre on utilise les attributs de la balise FRAME. L'attribut ROWS="hauteur1,hauteur2,...,hauteurN" dfinit la hauteur des diffrentes fentres en cas de division horizontale. La hauteur s'exprime en pixels ou en %. Dans ce cas, on veillera ce que le total soit gal 100%. Le mme pour un agencement vertical. L'attribut COLS="largeur1,largeur2,...,largeurN" dfinit la largeur des diffrentes fentres en cas de division verticale. La hauteur s'exprime en pixels ou en %. Dans ce cas, on veillera ce que le total soit gal 100% Pour remplir une fentre on utilise lattribut SCR . La syntaxe de cet attribut est SRC="URL", o URL donne ladresse du document afficher dans la fentre. Une barre de dfilement dans une fentre est indique par lattribut SCROLLING. SCROLLING="yes/no/auto" indique si la fentre doit ou non possder une barre de dfilement. Un autre attribut de cette balise <FRAME> est NAME="NOM". Name indique le nom de la fentre de telle sorte que cette frame puisse tre utilise comme cible d'un lien hypertexte. L'attribut TARGET peut aussi prendre certaines valeurs prdfinis : _blank qui indique au browser qu'il doit crer une nouvelle fentre afin d'y afficher le fichier. Dans ce cas, on ouvre en fait un nouveau browser. _self qui indique que le fichier sera charg dans la mme fentre que celle dans laquelle se trouve le lien. _top qui implique l'affichage du fichier sur toute la surface de la fentre du browser. Par dfaut, les cadres sont spars par des bordures. Il est possible de supprimer ces bordures mais les attributs utiliser diffrent selon Netscape ou Internet Explorer. Netscape utilise l'attribut "border=0" et Explorer, les attributs "frameborder=no" et "framespacing=0" (pour enlever l'espace entre les cadres). Le tout cohabite sans problme. La balise devient alors par exemple <FRAMESET COLS="m%,n%" border=0 frameborder=no framespacing=0>
12
Il y a pour terminer la balise <NOFRAMES>...</NOFRAMES> qui est utilise pour indiquer le texte que doivent afficher les browsers incapables de grer les frames. Il est mme indiqu de prvoir une page sans fentres pour que ces visiteurs puissent profiter quand-mme de site.
4.9. Langages spcialiss en rdigeant des pages web

Il y a des langages spcialiss en rdigeant des pages web, par exemple : Dreamweaver, FrontPage 2000, WebExpert 4.0, Adobe Golive, Na mo, WebEditor, Netscape, Composer, FrontPage, Express, HotDog, Webfast, HotMetal, HomePage, PageMill, 1st Page 2000, CoffeeCup HTML, HomeSite.
4.10. Conseils finals utiles

Il faut tester la fin de la cration dune page web les suivantes : Tous les liens sont-ils bien dfinis? Toutes les images sont-elles bien prsentes? Que se passe-t-il avec un browser diffrent? Si le site change d'emplacement? Que se passe-t-il avec une autre rsolution d'cran?
4.11. Cration dun site Internet

En cration dun site Internet il est mieux de suivi les tapes ci-dessous : Trouver un contenu ; Structurer le contenu : La ralisation d'un site est que chaque page Html ne peut dpasser 3 5 crans, pour des raisons de temps de chargement et de lisibilit. Il faudra donc dcouper le contenu en pages et sous-pages (qui ne correspondront pas forcment aux chapitres). Ensuite il faudra relier ses diffrentes pages de faon logique afin que le lecteur puisse naviguer avec aisance dans le site. Des petits repres graphiques rendront cette navigation plus intuitive pour le lecteur. On prvoit gnralement sur chaque page, un retour vers la page d'accueil ou table des matires pour venir au secours des lecteurs gars ou encore ceux (et cela arrive plus souvent qu'on le pense) qui entrent dans le site par le thme d'une page dtermine. Communiquer avec le public Communiquer avec des mots, des couleurs, la mise en page et les images. L'auteur d'un site Web se voit confront avec la forme la plus aboutie de ce qu'on appelle la
13
communication. Sobrit des mots et de la prsentation graphique, concision, efficacit seront les lments dterminants. Mais ce ne sera pas forcment la rgle Connatre le langage Html Le Web parle en langage Html. Il n'empche que mme avec le meilleur diteur, vous devrez tt ou tard plonger dans le code source Html. C'est pourquoi une bonne connaissance du Html se rvlera trs vite comme indispensable. Avoir quelques connaissances graphiques La bonne connaissance d'un logiciel comme Paint Shop Pro, est une bonne introduction en matire de traitement graphique. Le temps de chargement dune page, que la plus petite image correspond une ou plusieurs pages de texte. L'utilisation des images, aussi indispensable soit-elle pour la prsentation, est donc toujours un compromis.
4.11. Application
Nous allons faire un site en appliquant les questions prsentes ci-dessus. On utilise lditeur MS DOS pour rdiger le fichier HTM avec les instructions pour obtenir ce site. Les commentaires expliquent les actions faites pour obtenir le site.
14
15
16
Les fichiers suivants contiennent les instructions pour raliser lexemple ci-dessus.
Fichier EX.HTM
<html> <head> <Title>Creation d'un site </title> </head>  <Img src="http://www.compteur.com/cgi-bin/compteur.cpt?ID=66207&num=1">  <body background="sky.jpg">  <div align =center> <Blink> Construction d'un site </Blink> </div>  <Center> Un site Internet est un ensemble de pages web, Wi reliees entre elles, et constitue l'outil le plus moderne de communication et de publication </Center> On peut introduire: 
17
 <!- Liste ordonee--> <ol> <li>listes, </li> <li> texte, <li> tableaux, </li> <li> frames, </li> <li>images,</li> <li> liens</li> </ol> <div align=center> Nous allons montrer comment s'utilisent la plupart des tags et leurs attributs </div>  <div align=center> <pre><BIG> E X E M P L E S </BIG></pre> </div>  <center> <Img src="ex.gif" width=50 height=50 border=3>  <Div align=right> <A href="d:/tableaux.htm"> Aller au document qui present les tableaux
18
 </a> </Div> </body> </html>
Fichier TABLEAUX.HTM
<HTML> <HEAD> <TITLE>Tableaux</TITLE> </HEAD>  <Div align=right><A HREF="d:/ex.htm"> Aller a l'ecran precedent </A></Div> Presentation generale de l'UTCB <Body background="fond.jpg"></Body>  <CENTER><TABLE BORDER CELLSPACING=1 WIDTH=80%> <TR><TD COLSPAN=3 BGCOLOR="#00ff00">  Univesite </TD> </TR> <TR><TD ROWSPAN=6 BGCOLOR="#0000ff"> Facultes </TD> <TD COLSPAN=2 WIDTH="50%" BGCOLOR="#c0c0c0"> Genie Civil </TD> </TR> Technique de Constructions
19
<TR><TD WIDTH="50%" COLSPAN=2 BGCOLOR="#c0c0c0"> Hydrotechnique </TD> </TR> <TR><TD WIDTH="50%" COLSPAN=2 BGCOLOR="#c0c0c0"> Ponts et Chausses </TD> </TR> <TR><TD WIDTH="50%" COLSPAN=2 BGCOLOR="#c0c0c0"> Equipaments </TD> </TR> <TR><TD WIDTH="50%" COLSPAN=2 BGCOLOR="#c0c0c0"> Outilages en Constructions </TD> </TR> <TR><TD WIDTH="50%" COLSPAN=2 BGCOLOR="#c0c0c0"> Geodesie </TD> </TR> <TR><TD WIDTH="50%" ROWSPAN=3 BGCOLOR="#ff0000"> Departament de sciences de l'ingenieur </TD> <TD WIDTH="15%" ROWSPAN=2 BGCOLOR="#ffff00">  <A HREF="d:/frames.htm">Section francaise </A> </TD> <TD WIDTH="35%" BGCOLOR="#ffff00"> Genie Civil </TD> </TR> <TR><TD WIDTH="35%" BGCOLOR="#ffff00"> Equipaments en Constructions 
20
</TD> </TR> <TR><TD COLSPAN=2 BGCOLOR="#0000ff"> Section anglaise </TD> </TR> <TR><TD WIDTH="50%" BGCOLOR="#000000"> Colege universitaire </TD> <TD COLSPAN=2 BGCOLOR="#ffffff"> 9 Sections qui ne sont pas toujours activees </TD> </TR> </TABLE> </CENTER> <Div align=right> <A href="d:/frames.htm">Aller au document qui present les frames </a> </Div> </HTML>
Fichier FRAMES.HTM
<html> <head> <Title> Frames vericales </title> </head>   <Frameset cols="40%,60%"> <frame SRc="dep.htm"> 
21
<frameset rows="20%,40%,40%"> SRc="auf.htm"bordercolor="ff0000">  <frame scrolling="yes" src="francais.htm"> <frame scrolling="yes" src="anglais.htm">  </frameset> </Frameset> </html>
<Frame
Fichier DEP.HTM
<html> <head> <title>departement </title> </head>  <Body bgcolor="#00ff00">  <Div align=left><A href="tableaux.htm" target=_top> Aller a l'ecran precedent </A></Div>  <center> Departement de Science de l'Ingenieur </center>  <Div align=left><A href="images.htm" target=_top>Aller a la presentation des images</A></Div> </body> </html>
22
Fichier AUF.HTM
<html> <head> <title>auf </title> </head>  <Body bgcolor="#80000ff">  <center> Le sylabus </center> </body> </html>
Fichier FRANAIS.HTM
<html> <head> <title>francaise </title> </head>  <Body bgcolor="#0000ff">  <center> Section francaise Premier annee </center>  <OL> <Li> Analyse Mathematique I, II</Li> <Li> Algebre lineaire I, II</Li> <Li> Chimie </Li> <Li> Topographie</Li> <Li> Geometrie descriptive</Li> <Li> Utilisation des ordinateurs</Li>
23
<Li> Langues etrangeres </Li> <Li> Mecanique I</Li> <Li> Physique des constructions I</Li> <Li> Materiaux de constructions</Li> <Li> Genie graphique I</Li> <Li> Sport</Li> </Ol> <center> Deuxieme annee </center> <OL> <Li> Mathematiques Avancees</Li> <Li> Physique des constructions II</Li> <Li> Resistence des materiaux </Li> <Li> Statique </Li> <Li> Hydraulique</Li> <Li> Langues etrangeres </Li> <Li> Mecanique II</Li> <Li> Analyse Numerique</Li> <Li> Langages de programmation</Li> <Li> Genie graphique II</Li> <Li> Sport</Li> </Ul> </center> </body> </html>
Fichier ANGLAIS.HTM
<html> <head> <title>anglaise </title> </head>  <Body bgcolor="#ffff00">  <center>
24
Section Anglaise First year </center> <OL> <Li> Mathematical Analysis</Li> <Li> Linear Algebra </Li> <Li> Chimie </Li> <Li> Topographie</Li> <Li> Geometrie descriptive</Li> <Li> Physics I</Li> <Li> Mechanics</Li> <Li> Programming languages</Li> <Li> Programming languages</Li> <Li> Sports</Li> </Ul> </center> </body> </html>
Fichier IMAGES.HTM
<html> <head> <title>Images </title> </head>  <frameset rows="50%,50%">  <frame src="ph11.htm" aligh=center>  <frameset cols="50%,50%">  <frame src="ph21.htm" align=center> <frame src="ph22.htm" align=center> </frame>
25
</frame> </html>
Fichier PH11.HTM
<html> <head> <title>Photo </title> </head> <Body>  <Div align=left><A precedent</A></Div> href="tableaux.htm" target=_top> Aller a l'ecran
 <Center> <Pre>R E C T O R A T </pre> </Center> </Body> <Center> <img src="photo21.jpg" width=240 height=165 border=5> </Center>  <Div align=left><A href="Listeca.htm" target=_top> Aller a la presentation des listes caches</A></Div> </html>
Fichier PH21.HTM
<html> <head> <title>Photo </title> </head>  <Body> <Center>Genie Civil </Center> </Body>
26
 <Center> <img src="photo21.jpg" width=210 height=210 border=5> </Center> </html>
Fichier PH22.HTM
<html> <head> <title>Photo </title> </head>  <Body> <Center> Hydrotechnique </Center> </Body>  <Center> <img src="photo22.jpg" width=210 height=210 border=5> </Center> </html>
Fichier LISTECA.HTM
<Html> <Head> <Title> Listes caches></Title> </Head>  <Body background="fin.jpg">  <Select name=Facultatea size=1> <Option> Genie Civil <Option> Hydrotechnique <Option> Ponts et Chasses
27
<Option> Equipaments <Option> Outilages en constructions <Option> Geodesie <Option> Departement de Sciences d'ingenieur <Option> Colege universitaire </Select> <center>  <Marquee height=50 width="70%" loop=3 behavior=alternate direction= left bgcolor="bleu" alternate hspace=10 vspace=15 scrollamount= 10 scrolldelay=200> Merci de votre attention! </Marquee> </center> <center> <Marquee align=center behavior=alternate align=bottom height=10 width="33%" loop=4 direction= right bgcolor="#ffFF00" hspace=10 vspace=15 scrollamount= 20 scrolldelay=200> Au revoir! </Marquee> </center>  <Div align=right> <a href="images.htm"> Aller a l'ecran precedent </a></Div> </Html>
28
Bibliographie
1. Apprendre le langage HTML, Van Lancker Luc, http://www.ccim.be/ccim328/html 2000. 2. Crez vos propres sites Web, Pete Muller, Ed. Data Becker GmbH&co. KG Dusseldorf, Micro Application Paris, 1999. 3. HTML The Definitive Guide, Chuck Musciano & Bill Kennedy, Ed. OREILLY Beijing Cambridge Koln Paris Sebastopol Taipei Tokyo, Third Edition, 1998.

Creation D Une Page Web

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Creation D Une Page Web

Transféré par

Droits d'auteur :

Formats disponibles

Cration des pages web