HTML (HyperText Markup Language)

Auteur: Mohamed CHINY Durée necessaire pour le cours de HTML (HyperText Markup Language) Niveau recommandé pour le cours de HTML (HyperText Markup Language) Supports vidéo non disponibles pour ce cours Exercices de renforcement disponibles pour ce cours Quiz disponible pour ce cours

Page 2: Comment écrire un document HTML?

Toutes les pages

Format d'un document HTML

Un document HTML est un fichier texte (après tout, le code HTML est du texte) avec l'extension .html ou .htm. Il n'y a absolument aucune différence entre les deux extensions. La première est l'extension normale alors que la deuxième est plus courte et aussi plus adaptées aux anciens système d'exploitations qui comprenaient seulement les extensions en 3 caractères.

Les fichiers HTML sont déposés dans un serveur de fichiers (voir serveur Web dans le glossaire). Il ne nécessite donc aucune exécution par le serveur car HTML est un langage coté client. Par conséquent, quand vous créez votre fichier HTML, il n'y a aucun problème à le mettre n'importe où dans votre ordinateur (au bureau par exemple) car c'est le navigateur qui l’exécutera après ouverture.

Les développeurs ont pour coutume de nommer la page d'accueil de leur site Web "index", est puisque c'est un document HTML alors son nom complet sera "index.html". Essayez de faire de même.
Si vous utilisez Windows, je vous recommande d'afficher les extensions de vos fichiers, car le système a tendance à les masquer.
Pour ce faire, ouvrez n'importe quel dossier puis cliquez sur "organiser" puis "Options des dossiers et de recherche". Ensuite allez sur l'onglet "Affichage" puis décochez la case "Masquez les extensions des fichiers dont le type est connu". Vous verrez apparaître les extensions de tous vos fichiers y compris celle de votre fichier index.html.

A quoi ressemble le contenu d'un fichier HTML?

Un document écrit en HTML ressemble à cela:
<html>
   <head>
      <title>Ma première page HTML</title>
      <meta http-equiv="content-type" content="text/html;charset=utf-8">
   </head>
   <body>
      <h1>Il s'agit d'un exemple de HTML</h1>
      <div>
         <font color="#DD7700"><b>HTML</b></font>
         est un langage de description de pages Web.
      </div>
   </body>
</html>
Mieux encore, pour voir à quoi ressemble le code source de cette page Web, cliquez sur le bouton droit de votre sourie en plaçant celle ci sur la page, puis sélectionnez "Afficher le code source de la page" (le message à sélectionner peut changer légèrement d'un navigateur à un autre, mais je suis sûr que vous vous en sortirez).

Comme je l'ai signalé au début de ce chapitre, un document HTML contient du texte, mais vous avez sans doute remarqué la présence des symboles < et >. Ces deux chevrons (ouvrant et fermant) avec le mot qu'ils contiennent constituent ce que l'on appelle une balise.

Un document HTML est structuré sous forme de balises, chaque balise a un sens que le navigateur comprend et exécute pour que le document soit présenté tel que les balises le dictent.