Chapitre 1

Architecture des documents HTML.

Règles HTML et balises
Structure et en-tête du document (<HEAD>)
Le corps du document (<BODY>)
Commenter un document

Règles HTML et balises.

Toutes les instructions HTML sont exprimées dans des balises (ou "tags"), élimitées par des crochets (signe inférieur < et signe supérieur >). Cette structure est toujours la même, cependant chaque balise doit être ouverte et fermée (sauf à de rares exceptions), à noter que la balise de fermeture est toujours identique à la balise d'ouverture sauf qu'elle comporte une barre oblique après le signe <.

ex:
 <TABLE> et </TABLE>  
Les majuscules et minuscules dans les instructions n'ont aucune importance <TABLE> est équivalent à <table>. Attention quand même de bien respecter les ordres d'ouverture et de fermeture sinon vous risquez de perdre en lisibilité.

Structure et en-tête du document (<HEAD>).

Avant de commencer à écrire l'en-tête, votre document principal (ou chaque page de votre projet, mais ce n'est pas obligatoire) doit comporter une instruction DOCTYPE qui permet de définir le standard HTML que vous allez utiliser.

Commandes DOCTYPE pour les différentes versions HTML.

Commande.	Version HTML.
<!DOCTYPE HTML PUBLIC "-//IETF//DTD Level1//EN">	HTML 1.0
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">	HTML 2.0
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.0//EN">	HTML 3.0
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">	HTML 3.2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 TRANSITIONAL//EN">	HTML 4.0 en "transition"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">	HTML 4.0

Ensuite vous devez entrer la balise <HTML> qui indique le début de votre fichier, puis la balise <HEAD> dans laquelle sont résumées des informations générales, c'est à dire le titre de votre page (c'est aussi le titre qui apparaîtra dans les favoris du visiteur s'il vous ajoute à sa liste de favoris) et les balises qui permettent d'indexer (référencer) votre site (ces balises seront étudiées dans la rubrique suivante).

Le corps du document (<BODY>).

Il est à noter que pour l'instant le navigateur n'affichera rien, car les véritables données qu'il va afficher vont se trouver dans la balise <BODY>. Cette balise détermine le corps du document, c'est ici que vous allez intégrer titres, textes, images, tableaux, liens, ... Le tag <BODY> a de nombreux attributs

BGCOLOR : Définit la couleur du fond de l'écran. TEXT : Définit la couleur du texte. LINK : Définit la couleur des liens. VLINK : Définit la couleur des liens déjà visités. ALINK : Définit la couleur des liens activés, c'est à dire quand le pointeur de la souris passe au-dessus. BACKGROUND : Définit l'image (gif ou jpeg) à utiliser comme fond d'écran. BGPROPERTIES : Quand elle est définie à FIXED, l'image de fond ne défile pas (fonctionne qu'avec I.Explorer). LEFTMARGIN : Définit la largeur de la marge de gauche en pixels.

TOPMARGIN : Définit la largeur de la marge du haut en pixels.

Exemple typique d'une page HTML (sans les balises META).
<HTML> 
<HEAD> 
<TITLE> Ma première page</TITLE> 
</HEAD> 
<BODY BGCOLOR="WHITE" TEXT="BLACK" LINK="BLUE" VLINK="GREEN" ALINK="RED"> Voici votre première page 
</BODY> 
</HTML> 
Commenter un document.

Vous pouvez commenter votre code source sans que le navigateur affiche ce commentaire, cela peut s'avérer pratique si vous êtes plusieurs à travailler sur le même document. Cette instruction est aussi utilisée lors de l'écriture d'un script Javascript pour cacher le code aux navigateurs non compatibles.

Exemple d'un commentaire