5.1 - Installez le pied de page (footer)
Vous allez maintenant insérer le pied de page (souvent appelé "footer"). Pour cela, ouvrez index.html avec votre bloc note et copier le code ci-dessous après votre article (après la balise HTML </p>).
Actualisez la page dans votre navigateur internet. Vous devez avoir "Copyright Nom de mon site", écrit sur fond blanc.
5.2 - Installez le haut du site (header)
Vous allez maintenant insérer le haut de votre site (souvent appelé "header"). Pour cela copier le code ci-dessous après le conteneur <div id="global">.
5.3 - Creez une deuxieme page
Vous allez maintenant passer à la création de votre seconde page. L'objectif est de vous expliquer comment fonctionne les liens entre les pages de votre site.
Pour commencer, rendez-vous dans votre dossier "Mon-Site". Copier/coller votre page index.html et renommez la en contact.html. (Attention : Nous n'avons pas mis de majuscules !).
5.4 - Modifiez votre page contact
Ouvrez avec votre bloc note la page contact.html et modifiez le titre de la page dans la balise <title> et le <h1>. Ecrivez par exemple "Page Contact".
Supprimez la balise <h2> et son contenu.
Supprimez l'image.
Remplacez le contenu de votre article avec vos coordonnées (par exemple).
Vous risquez de rencontrer des problèmes avec les accents. Pour cela, il suffit de copier le code qui est dans la colonne Entité HTML de la page des
caractères spéciaux.Voir l'exemple ci-dessous avec l'accent grave :
5.5 - Ajoutez un lien dans votre menu
Vous allez maintenant lier les pages accueil et contact entrent elles. Pour cela, nous allons insérer un lien dans votre menu de navigation.
Dans notre exemple, nous avons utilisés "Accueil", "Les photos", "Les informations" et "Contact" que nous avons mis à l'intérieur des des balises <ul></li>.
Le code pour insérer un lien est le suivant :
<a href="" title=""></a>
Vous allez attribuer un nom à votre lien :
<a href="" title="">Accueil</a>
Vous devez écrire le nom de la page dans la balise <a href="index.html">Accueil</a>
Lorsque vous cliquerez sur le lien Accueil, vous arriverez sur la page index.
Vous devez faire pareil avec le lien contact. Vous pouvez éventuellement écrire la description dans la balise title="" de la page vers laquelle pointe le lien.
<a href="contact.html" title="Voir la page Contact">Contact</a>
Rendez-vous sur index.html dans votre navigateur. Actualisez la page et cliquez sur le lien Contact. Si tout est correct, vous devez pouvoir accéder à la page contact.html.
Vous devez penser à changer les liens sur votre page contact.html afin de pouvoir passer de la page contact à la page d'accueil.
