|
Le
site que nous allons construire en utilisant uniquement du code html
est le suivant :

Il se compose de
trois fenêtres : une bannière horizontale - qui indique le titre du
site, une fenêtre verticale sur la gauche qui donne le plan du site
ou des liens, et une fenêtre horizontale sur la droite qui affiche
les pages - par défaut la page d'accueil.
· Ce
site se compose en fait de 4
fichiers HTML :
-
Un fichier qui décrit la
structure des 3 fenêtres, (appelé ici maitre.htm).
-
Un fichier accueillant la
bannière de titre, (nommé : banniere.htm).
-
Un fichier comportant le plan du
site; (nommé : plan.htm)..
-
4 fichiers potentiels dans la
page de droite, selon que l'on affiche la page d'accueil ou les
pages 1, 2 et 3. (Nous les avons appelés
accueil.htm, Page1.htm,
Page2.htm, Page3.htm).
· Commencez
par créer un dossier ou vous devez enregistrer tous les fichiers
indiqués ci-dessous.
· Nous
allons créer en premier lieu le fichier
maitre.htm.
-
Cliquez sur
démarrer/Programmes/Accessoires/Bloc-notes.
-
Copiez et collez
le code suivant :
<HTML>
<HEAD>
<TITLE>Page
de cadres</TITLE>
</HEAD>
<! Définition du cadre horizontal dans lequel viendra se
placer la bannière>
<FRAMESET
ROWS="80,*">
<FRAME SRC="banniere.htm">
<! Définition des fenêtres verticales>
<FRAMESET
COLS="150,*">
<FRAME SRC="plan.htm">
<FRAME SRC="accueil.htm" NAME="FENETRE">
</FRAMESET>
</HTML>
-
Cliquez su
Fichier/Enregistrer
sous et Sauvegardez le fichier sous le nom
Maitre.htm.
-
Cliquez sur
Fichier/Nouveau de Bloc-notes puis
créez le fichier banniere.htm. Il
s'agit d'une page classique avec les instructions suivantes à
l'intérieur des balises <BODY> et </BODY>
<BODY BGCOLOR=blue TEXT=white> <!
Texte
blanc sur fond bleu>
<FONT FACE="Arial, Helvetica">
<H1 ALIGN=center>UN SITE AVEC DES CADRES</H1>
</BODY>
-
Cliquez sur
Fichier/Nouveau de Bloc-notes puis
créez le fichier plan.htm.
<BODY>
<FONT FACE="Aria, Helvetica">
<H3>Plan du site</H3>
<A
HREF="acceuil.htm" TARGET="FENETRE">Accueil</A>
<P>
<A
HREF="page1.htm" TARGET="FENETRE">Page 1</A>
<P>
<A
HREF="page2.htm" TARGET="FENETRE">Page 2</A>
<P>
<A
HREF="page3.htm" TARGET="FENETRE">Page 3</A>
<P>
</BODY>
-
Cliquez sur
Fichier/Nouveau de Bloc-notes puis
créez le fichier accueil.htm qui
décrit la page d'accueil.
<BODY>
<FONT FACE="Arial, Helvetica">
<H1 ALIGN=center>Bienvenue dans la page d'accueil.</H1>
<H4>Voici la page d'accueil de ce site.
<P>
C'est la page qui est affichée lorsque l'on démarre le site. </H4>
</BODY>
· Créez
les trois fichiers Page1.htm,
Page2.htm et
Page3.htm selon ce modèle :
<BODY>
<H1>Page 1</H1>
<P>
<H2>C'est La page 1 de ce site.</H2>
</BODY>
· Enregistrez
la page sous Page1.htm.
<BODY>
<H1>Page 2</H1>
<P>
<H2>C'est La page 2 de ce site.</H2>
</BODY>
· Enregistrez
la page sous Page2.htm.
<BODY>
<H1>Page 3</H1>
<P>
<H2>C'est La page 3 de ce site.</H2>
</BODY>
· Enregistrez
la page sous Page3.htm.
A présent, si vous
cliquez sur n'importe lequel des liens indiqués dans la fenêtre de
gauche, vous voyez apparaître en regard la page correspondante !
Vous
pouvez utiliser le modèle ci-dessus pour définir votre propre site
au moyen de cadres, en y ajoutant toutes les caractéristiques
désirées : fond de pages, images, etc. |