Le langage HTML


Le langage HTML (HyperText Makeup Language, langage de création hypertexte) est le langage utilisé pour créér des pages WEB. Il permet de décrire la page, les images présentes dessus, le comportement des objets, des liens ,etc... Il peut être un peu déconcertant, mais souvent on peut s'en passer, en utilisant un éditeur HTML.


Une page WEB est contenue dans un fichier HTML, d'extension .htm ou .html, qui est en fait un fichier texte. Vous pouvez le visualiser sous forme HTML en choissant "Visualiser le source" dans votre navigateur.
Vous remarquez tout de suite que le texte de la page est bien present, mais qu'il y a une quantité de signes "<>". En HTML, ces signes encadrent des balises. Une balise HTML est une commande, un ordre donné au navigateur. Ce peut etre un retour chariot, un lien, une insertion d'image, etc...

Une page HTML doit obligatoirement commencer par la balise <HTML> et finir par la balise </HTML>. Le signe / indique une balise de fin. Toute la page HTML doit donc etre incluse entre les deux balises <HTML> et </HTML>.

Au début de la page HTML se trouve l'en-tête. Dans celui-ci on va déclarer :
- le titre de la page, qui apparaîtra dans la barre de titre du navigateur
- une description de la page, des mots-clés
- etc...
L'en-tete est inclus entre les balises <HEAD> et </HEAD>.
Le titre de la page est inclus entre les balises <TITLE> et </TITLE>.
Regardez les en-tetes de vos pages HTML preferees. Vous trouverez d'autres balises mais pour l'instant, seules celles-ci sont utlies.
Apres l'en-tete, on passe au corps de la page, c'est a dire son contenu proprement dit. Celui-ci est contenu entre les balises <BODY> et </BODY>.
Dans la balise BODY vous pouvez aussi déclarer l'apparence de votre page, comme ceci :
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" BACKGROUND="bois.jpg">
BGCOLOR permet de fixer la couleur du fond. Par défaut, c'est gris.
TEXT permet de fixer la couleur du texte (noir par défaut) et LINK celle des liens (bleue par défaut).
BACKGROUND permet de donner un fichier image comme fond d'écran. Le format peut être GIF ou JPEG.
Les couleurs sont indiquées entre guillemets, en format hexadecimal.


Les balises de mise en forme

Vous pouvez, comme dans un traitement de texte, mettre en forme le texte de vos pages. Les balises suivantes vous le permettent :
Gras : tout le texte entre <b> et </b> (ou bold et /bold) est en gras.
Italique : tout le texte entre <i> et </i>.
Centré : entre les balises <center> et </center>.
Saut de ligne : la balise <br>.
Saut de paragraphe : la balise <p>.
Les tailles : entre <h1> et </h1> pour le + gros, entre <h7> et </h7> pour le plus petit.
La balise FONT est tres importante : elle joue sur la police de caracteres utilisee :
Entre <FONT FACE="Comic sans MS" COLOR="#FF0000"> et </FONT> tout le texte sera en Comic sans MS de couleur rouge vif : Comme ceci !

Les balises de liens

Le plus important de l'HTML est la possibilité de faire des liens. On utilise pour cela la balise <a> et </a>. Le lien est défini entre les deux. On peut :
faire un lien vers un autre fichier du meme serveur : <a href="page1.htm"> , </a>

faire un lien vers une adresse internet : <a href="http://www.yahoo.com/"> , </a>

faire un lien vers une adresse EMAIL : <a href="mailto:alexsoft@le-village.com">, </a>

faire un lien vers un fichier local : <a href="file:///c:\windows\lisezmoi.txt">, </a>

faire un lien vers un signet : <a href="#signet1">, </a>

faire un lien vers un signet dans une autre page : <a href="page1.htm#signet"> , </a>

Pour faire un signet, il faut employer la balise <A NAME> comme ceci : <A NAME="signet">


Regardez bien comment sont faits les liens dans toutes vos pages WEB préférées.

Les balises d'insertions d'objets

L'objet le plus simple a inserer est une image. Elle doit etre au format GIF ou JPEG. La balise est IMG. On peut l'utiliser comme suit :
<IMG SRC="image.jpg">
SRC indique le fichier image. Elle peut se trouver dans un autre répertoire (IMG SRC="images/img1.gif") voire sur un autre serveur (IMG SRC="http://www.usenet.fr/biblio/chien.jpg")
On peut à la suite de SRC utiliser d'autres attributs (proprietes) de l'image. Par BORDER on regle la taille de sa bordure (si un lien est placé sur l'image) :<IMG SRC="img.gif" BORDER=0>
Avec ALT on choisit un texte de remplacement à l'image, si elle n'est pas trouvée ou non chargée : <IMG SRC="img.gif" ALT="Image n°1">

Les tableaux

Un tableau permet d'accroitre la lisibilité de vos pages. Il se trouve entre les balises table et /table.

Dans la balise table vous indiquez la taille de la bordure :< TABLE BORDER=3>

Vous pouvez indiquer la taille du tableau en pixels : <TABLE WIDTH=620> ou en pourcentage <TABLE WIDTH="100%"> de la page.
Vous avez également la possibilité d'indiquer le nombre de cellules par ligne : <TABLE CELLPADDING=5>

La balise tr vous permet de creer une nouvelle ligne du tableau. Vous indiquez dans cette balise l'alignement de cette ligne : <TR VALIGN="vtop" >aligne le texte de la ligne vers le haut.

La balise td définit la cellule. Vous indiquez la largeur de celle ci : <TD WIDTH="50%">

Voici un tableau exemple : regardez le source HTML

Première cellule Cellule n°2 : taille différente !
et ça marche
On peut mettre
plusieurs lignes par
cellule.
OK ! yes et voila
Tableau
inutile mais qui est
fini !

Vous avez bien compris ???



Page en construction