guill.net - La page des réseaux

La norme HTML


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...


Retour