Pour encore améliorer l’aspect d’un titre (ou d’un paragraphe), il serait utile de pouvoir agir sur l’alignement.
HTML dispose d’un attribut d’alignement applicable à de nombreux éléments,align.
Vous allez un peu améliorer l’aspect de la première page en jouant sur l’alignement.
1 Revenez dans le Bloc-Notes au fichier précédent (pageacc1_3_3.html).
2 Centrez les deux titres, à l’aide de l’attribut align:
<H1 align="center">Ma page d’accueil</H1>
<H2 align="center">Bienvenue sur mon site.</H2>
3 Modifiez le lien qui permet de vous envoyer un message. Ajoutez ce qui suit :
<P align="center"><A href="mailto:votre_nom@votre_FAI">
Ecrivez-moi !</A>.</P>
4 Enregistrez votre fichier sous le nom pageacc1_3_3.html. Le code complet de cette page est présenté dans le Listing 3.4.
5 Pour la bonne forme, nous allons également créer le squelette des autres pages. En partant du fichier actuellement ouvert, commencez par modifier l’élément TITLE:
<TITLE>"Ma région "</TITLE>
6 Modifiez ensuite le titre et le sous-titre …
<H1 align="center">Ma région </H1>
<H2 align="center">...à complèter.</H2>
7 … puis le paragraphe de texte :
<P>... à compléter.</P>
8 Vous pouvez à votre guise conserver ou supprimer la ligne établissant un lien vers un message électronique. En revanche, il est capital de toujours prévoir sur une page secondaire un lien vers la page d’accueil principale. Ajoutez donc la ligne suivante, juste avant la balise </BODY>:
<P align="center"><A href="pageacc1_3_3.html">Retour vers la page d’accueil</A></P>
9 Enregistrez ce fichier sous le nom region.html.
10Créez ensuite les deux autres pages (famille.html etpassions.html), en modifiant comme il se doit le contenu des éléments TITLEet H1.
L’attribut align possède plusieurs valeurs possibles, dont la signification est présentée dans le Tableau 3.2. Remarquez toutefois que son emploi avec des titres et paragraphes est désormais déconseillé : mieux vaut recourir aux feuilles de style, que vous découvrirez dans le Chapitre 8.
Tableau 3.2 :Valeurs d’alignement des paragraphes Attribut deP Alignement de texte
<P align="left"> Alignement à gauche.
Tableau 3.2 : Valeurs d’alignement des paragraphes Attribut deP Alignement de texte
<P align="right"> Alignement sur la marge de droite, sans justification à gauche : celle-ci est plutôt
désordonnée, mais cette disposition est pratique dans le cas d’images et de colonnes de texte.
<P
align="center"> Le texte est centré.
<P
align="justify"> Le texte est justifié, comme avec un traitement de texte.
Listing 3-5 : Page d’accueil modifiée (version 1.3.3).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>"Ma page d’accueil"</TITLE>
<META name="author" content="mon nom">
<META name="version" content="1.3.3">
</HEAD>
<BODY>
<H1 align="center">Ma page d’accueil</H1>
<H2 align="center">Bienvenue sur mon site.</H2>
<P>Vous trouverez sur ce site des informations :<BR>
sur ma <A href="region.html">région</A> ;<BR>
sur ma <A href="famille.html">famille</A> ;<BR>
sur mes <A href="passions.html">passions</A>.</P>
<P align="center"><A href="mailto:votre_nom@votre_FAI">
Ecrivez-moi !</A>.</P>
</BODY>
</HTML>
Examinez votre nouvelle page d’accueil dans votre navigateur. Ouvrez celui-ci, puis naviguez jusqu’au fichierpageacc1_3_3.html.
Figure 3.13: Page d’accueil
Cliquez sur un lien : vous accédez à l’une des nouvelles pages.
Revenez à la page d’accueil, testez les autres liens, puis, revenu sur la page d’accueil, testez le lien d’envoi de courriel : votre logiciel de messagerie s’ouvre.
3.3. Résumé
j L’instruction !DOCTYPE permet de stipuler la DTD (Document Type Definition) employée pour le document HTML.
j Un document HTML se compose d’un élément parent HTML qui contient des éléments enfants HEADet BODY.
j La seule information affichée par le navigateur appartenant à l’élément HEADest le contenu de l’élément TITLE, figurant dans la barre de titre de la fenêtre. Les éléments META de l’élément
Figure 3.14:
Une des pages secondaires
Figure 3.15:
Logiciel de messagerie lancé à partir de la page
HEAD servent à fournir des méta-informations employées par certains agents utilisateurs (comme les robots des moteurs de recherche), dont les mots-clés, une description, l’auteur, la version et le générateur de la page.
j L’élémentBODYconstitue le corps du document : tout son contenu est visible dans le navigateur.
j Ce contenu doit être structuré de façon logique. HTML propose les éléments Hn pour des titres de niveaux différents, ainsi que l’élément Ppour un paragraphe de texte.
j Les liens hypertextes sont créés à l’aide de l’élément A suivi de l’attribut href stipulant la cible du lien. Cet attribut href est suivi d’un nom de protocole, comme http:/ ou mailto:, spécifiant le type de cible et l’action à suivre.
j Un lien hypertexte peut être absolu ou relatif.
j Un saut de ligne est obtenu à l’aide de l’élément vide BR.
j Les titres et les paragraphes admettent l’emploi de l’attribut align pour obtenir un alignement particulier. Cet attribut est toutefois désormais déconseillé : mieux vaut recourir aux feuilles de style.