3. Site avec plusieurs pages

3.1 Notion de Liens
 

____________________________________  Données ______________________________________

Insérer un lien vers un autre site
Il est facile de reconnaître les liens sur une page : ils sont écrits d'une façon différente (par défaut en bleu souligné) et en général un curseur en forme de main apparaît lorsqu'on pointe dessus.
Pour faire un lien, la balise que nous allons utiliser est très simple à retenir : <a>. Il faut cependant lui ajouter un attribut, href, pour indiquer vers quelle page on souhaite amener.

Exemple : Adresse du site du Lycée : http://ecolelamache.org/
    code :  <a href="http://ecolelamache.org/">Site de mon Lycée </a>

On peut aussi avoir un lien sur une autre page de son propre site. Le code est alors du type (si la page est placée dans le même dossier) :   
    <a href="ma_page2.html"> page2 </a>
ou si le fichier est dans un autre répertoire :
    <a href="/repertoire/ma_page2.html"> page 2 </a>
______________________________________________________________________________________


Réalisation :

1. Dans votre fichier test6.html , enlever l'image du lycée
2. Rajouter un lien sur le site internet du lycée
3. Enregistrer le fichier sous le nom test7.html
4. Ouvrir ce nouveau fichier avec Mozilla Firefox
5. Faire valider par le professeur.





3.2 Site avec plusieurs pages

Vous allez maintenant créer 3 pages (index.html, page1.html et page2.html).

Contenu de la page d'accueil de votre site : index.html

• titre de la page web:  Page d'accueil de mon site
• En haut du site : Bienvenue sur la présentation de mon site (format : en titre important)
• puis 3 sauts de lignes
• Ajouter l'image du logo du lycée "logo_lamache.png" avec une bordure d'épaisseur 3 pixels, une largeur de 300 pixels et une hauteur de 60 pixels
• Ajouter 1 saut de ligne
• Ajouter l'image "photo_lamache.jpg" avec une bordure d'épaisseur 4 pixels, une largeur de 480 pixels et une hauteur de 320 pixels
• Ajouter 1 saut de ligne
• Ajouter un lien vers le Lycée LaMache lorsque l'on clique sur "Visiter le site de mon Lycée ?" (format : en titre important)
• Ajouter 1 saut de ligne
• Ajouter l'image du logo de la section STI SIN "logo_STI2D.jpg" avec une bordure d'épaisseur 3 pixels, une largeur de 241 pixels et une hauteur de 147 pixels
• Ajouter 1 saut de ligne
• Ajouter un lien vers la page1.html lorsque l'on clique sur "Aller sur la page 1 de mon site ?" (en titre important)

Contenu de la page 1 de votre site : page1.html

• titre de la page web:  Page 1 de mon site
• En haut du site : Bonjour et bienvenue sur la page 1 de mon site (format : en titre important)
• on saute 2 lignes
• on écrit : Cette année je suis en STI2D option SIN  (format : en titre important)
• on écrit : Voici les disciplines enseignées en STI2D_SIN: (format : en titre un peu moins important)
• On affiche une liste non numérotée des matières enseignées
• Ajouter 1 saut de ligne
• Ajouter un lien vers la page2.html lorsque l'on clique sur "Aller sur la page 2 de mon site ?" (en titre important)

Contenu de la page 2 de votre site : page2.html

• titre de la page web:  Page 2 de mon site
• En haut du site : Bonjour et bienvenue sur la page 2 de mon site (format : en titre important)
• on saute 2 lignes
• on écrit : Ce TP fait partie de la 2ème série étudiée en spécialité SIN  (format : en titre moins important)
• Ajouter 1 saut de ligne
• Ajouter l'image « logo_tp_BQ.png » sans bordure, une largeur de 600 pixels et une hauteur de 292 pixels
• Ajouter un lien vers la page1.html lorsque l'on clique sur "Revenir à la page 1 de mon site ?" (en titre important)
• Ajouter un lien vers la index.html lorsque l'on clique sur "Revenir à la page d'accueil de mon site?" (en titre important)

1. Essayer vote site internet composé de ces 3 pages.
2. Faire valider par le professeur.