![]() |
guill.net
-
La page des réseaux
|
![]() |
|
![]() ![]() ![]() |
Le HTML n'est pas quelque chose de particulièrement compliqué. Ca parait un peu barbare au premier abord, mais il est tout à fait accessible de comprendre comment ça marche...
Qu'est-ce que le HTML
HTML est une norme permettant d'écrire un texte avec un certain nombre de commande possible telles que "faire un lien vers une autre page", "écrire en rouge", "insérer une image"...
Le langage HTML, vous n'avez pas besoin de connaître le HTML pour faire votre page web. Il y a quelques trucs à savoir, mais pas grand chose. En tout cas, si c'est pour faire une petite page, ce n'est pas la peine d'apprendre le HTML, Netscape Composer écrit tout pour vous, il ne vous reste plus qu'à l'utiliser comme un traitement de texte.
Pourquoi le HTML
Le but de l'HTML est de faire des pages qui prennent le moins de place possible pour que le transfert jusqu'à votre ordinateur soit rapide. Regardez la taille d'un fichier Word et la taille du fichier "équivalent" en html et vous comprendrez. Si on utlisait Word (fichiers .doc) sur le web, le surf ne serait plus un plaisir et il vous faudrait 10 bonnes minutes pour arriver jusqu'à cette page!
Un système de balises
Voici un fichier HTML...
<HTML>
<HEAD>
<TITLE>Fichier de chargement d'applet</TITLE>
</HEAD>
<BODY>
...
</BODY>
</HTML>
Remarquez simplement le
système de balises de début et de fin... On commence
un fichier HTML en disant <HTML>...
Jusque là tout va
bien. La balise de fin est presque la même:
</HTML> et
pour toutes les balises, c'est la même chose... Si il y a quelque
chose d'écrit en dehors de ces balises, le navigateur n'en tient
pas compte...
Début de l'en-tête:
<HEAD>
et fin de l'en-tête </HEAD>... Début du corps
du fichier, <BODY>, etc...
Si par exemple vous écrivez quelque chose en rouge, le HTML traduit par une balise qui signifie "début de zone de texte en rouge" et "fin de zone de texte en rouge". Simple, non?
Exemple de page "index.html" avec gestion des frames
Imaginons que vous ayez un site de recettes de cuisine... Voici un exemple de page par défaut du site (typiquement "index.html")...
<HTML>
<HEAD>
<META
NAME="Author" CONTENT="Guillaume Desgeorge">
<META
NAME="GENERATOR" CONTENT="Mozilla/4.03 [en] (Win95; I) [Netscape]">
<META
NAME="Description" CONTENT="Les nouvelles recettes de cuisines de la mère
Denis, de la véritable recette des confitures Bonne-maman aux dernières
sauces à la mode dans le fin fond du Nigeria">
<META
NAME="Keywords" CONTENT="Cuisine, recette, confiture, gateaux, cuisses
de grenouilles">
<TITLE>Mes
recettes de cuisine</TITLE>
</HEAD>
<FRAMESET COLS="20%,80%">
<FRAME src="default.html">
<FRAME src="cuisine.html"
NAME="Cible">
</FRAMESET>
</FRAMESET>
</HTML>
On commence par regarder
la partie en-tête, délimitée par <HEAD> et
</HEAD>...
On apprend le nom de l'auteur et le nom du navigateur qui l'a générée:
ici, c'est Mozilla (Netscape) version 4.03.
Les balises META NAME
"Description" et "Keywords" contiennent respectivement la description
de la page et les mots-clefs qui lui sont associés. Cette
partie est indispensable si vous voulez être référencés
correctement sous Altavista par exemple ou n'importe quel autre moteur
de recherche (et non pas annuaire comme Yahoo...).
Ensuite, il y a le titre
puis c'est la fin de la partie en-tête.
Viennent les frames... <FRAMESET
COLS="20%,80%">
cela signifie que la page
sera séparée en deux frames en colonnes, 20% de la taille
de la fenêtre pour la première, 80% de la taille de la fenêtre
pour la seconde...
<FRAME src="default.html">
<FRAME src="cuisine.html"
NAME="Cible">
Dans la première
frame, on charge le fichier "default.html" (généralement
un menu) et dans la deuxième, le fichier "cuisine.html". Au passage,
on donne un nom à la frame de droite: "Cible"... ce qui permettra
de garder la première frame chargée en permanence et de ne
changer que la deuxième...
Je ne ferais pas (pour l'instant) la liste exhaustive de toutes les balises HTML existantes, mon but était seulement de vous montrer le principe de fonctionnement du HTML...
Si vous avez des questions, des remarques, ou que vous voudriez que je complète cette page, n'hésitez pas à m'envoyer un e-mail...