Page minimale



Ossature du document source

Une page HTML repose sur une structure de base, règle fondamentale sans laquelle l'utilisateur n'aurait pas accès à son contenu.

Cette structure est ce qui permet au navigateur d'interpréter le texte du code source, qui ne contient pas de mise en forme mais des instructions d'affichage : les commandes et les fonctions.

Ce sont ces commandes (instructions valides depuis leur ouverture jusqu'à leur fermeture)et fonctions (instructions instantanées, qui ne sont valides qu'au moment où elles sont interprétées) qui offrent les nombreuses possibilités de présentation d'une page HTML : mise en forme des caractères, formatage du texte, fond d'écran, liste, tableaux, insertion d'images...

Structure minimale

<HTML> ... </HTML>
Type de document (HyperText Markup Langage), placée au début et à la fin du code source, cette commande délimite la page HTML, c'est-à-dire les instructions qui seront interprétées par le navigateur.
À l'intérieur de cette structure de base, les commandes<HEAD> ... </HEAD> délimitent l'en-tête et <BODY> ... </BODY> le corps du document qui sera affiché dans la fenêtre du navigateur (titres, texte, liens, images,...).
<HEAD> ... </HEAD>
En-tête (Header), qui résume les informations générales de la page.
<BODY> ... </BODY>
Corps de texte, qui correspond à la page HTML que le navigateur interprète et affiche à l'écran.
Exemple :
<HTML>
<HEAD>
   <TITLE> ... </TITLE>      En-tête
</HEAD>
<BODY>

          Corps de texte
</BODY>
</HTML>
Ces trois commandes sont essentielles, elles correspondent au code source minimal d'une page HTML, sans lequel le navigateur serait incapable d'interpréter quoi que ce soit.

Informations d'en-tête

Déclaration de langage

<!DOCTYPE...>
Définition du type de document (Document Type Definition), indication de la version de langage HTML utilisée, toujours placée avant la fonction <HTML>.
Versions :

1.0 : <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML Level 1//EN">
2.0 : <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
3.0 : <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.0//EN">
3.2 : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
4.0 : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

Titre

<TITLE> ... </TITLE>
Titre de la page, qui s'affichera dans la barre de titre du navigateur.
Certains lecteurs hors ligne, utilitaires de gestion de pages Web ou moteurs de recherche élaborent leurs bases de données à partir de ce titre.

Adresse relative de base

<BASE HREF="url" TARGET="cible">
Adresse relative de base, utilisée dans la section d'en-tête : permet à l'adresse URL du document courant d'être enregistrée en tant qu'adresse de base pour les liens du document.
HREF="url"
Spécifie un lien URL identificateur.
TARGET="cible"
Cible : dans le cas des partitions d'écran, permet de définir une fenêtre comme cible pour tous les liens du document.

Meta-informations

<META>
Permet d'associer à un document HTML des informations d'en-tête qui seront lues par le serveur HTTP.
Ces informations peuvent servir à identifier un nom (name), un nom d'auteur (author), un contenu (content) et/ou une directive HTTP-EQUIV.
Attributs :
HTTP-EQUIV="nom"
Spécifie un lien entre le contenu de l'élément et la réponse HTTP.
CONTENT="nom"
Spécifie une meta-information associée au nom ou à la réponse HTTP.
NAME="nom"
Spécifie un nom à l'élément.

Commentaires

<!--commentaire-->
Commentaire (Comment), permet d'insérer une information qui est ignorée par les navigateurs et ne s'affiche pas à l'écran.
Ces commentaires, qui peuvent aussi bien figurer dans l'en-tête que dans le corps du document, permettent d'ajouter dans le code source HTML des informations utiles au développeur dans les tâches de mise à jour, par exemple. De nombreux éditeurs HTML les utilisent, notamment pour caser dans le code source des informations de copyright ou de la publicité.
Spécificité Internet Explorer Spécificité Internet Explorer :
<COMMENT> ... </COMMENT>
Commentaire, permet de mettre du texte en commentaire, sans qu'il s'affiche dans la page, mais uniquement sur Internet Explorer.

Attributs de la page

Il est possible de définir la couleur de fond et celle du texte pour l'ensemble d'une page HTML à l'aide de la commande <BODY>, à laquelle il faut ajouter différents attributs, qui introduisent la valeur de la couleur choisie pour chaque élément.

L'indication de couleur est introduite entre guillemet, à l'aide d'un nom de couleur ou de sa valeur sous forme de chiffres hexadécimaux.

Couleur du fond

<BODY BGCOLOR="?">
Couleur de fond (Background Color), définit la couleur de fond de la page.
Exemple :
<BODY BGCOLOR="#FFFFFF"> ou <BODY BGCOLOR="blanc">

Couleur du texte

<BODY TEXT="?">
Couleur du texte (Text Color).
<BODY LINK="?">
Couleur des liens (Link Color), affichés tels quels tant qu'ils n'ont pas été visités.
<BODY VLINK="?">
Couleur des liens visités (Visited Color).
<BODY ALINK="?">
Couleur des liens actifs (Active Color).
Exemple :
<TEXT="#000000" LINK="#0000FF" VLINK="#FF0000" ALINK="#00FF00">
ou
<TEXT="black" LINK="blue" VLINK="red" ALINK="green">

Note :
Il est important de prêter une attention particulière au choix des couleurs, qui doivent s'accorder entre elles dans la mesure où elles font partie d'un ensemble qui se veut lisible d'une part, attrayant d'autre part.

De manière à faciliter l'orientation de l'utilisateur, il est donc souhaitable que la couleur du fond soit la même sur toutes les pages, ou du moins sur celles qui traitent un même sujet, de même que celle des différents éléments de page qui remplissent la même fonction.

Image de fond

Il est possible de charger une image au format GIF ou JPEG, qui s'affichera en arrière plan de la page.
<BODY BACKGROUND="URL et|ou nom">
Arrière plan (Background), associe une image de fond à la page en indiquant au navigateur l'endroit où il doit aller la chercher.
Exemple :
<BODY BACKGROUND="image.gif">

Selon la taille du graphisme, l'image s'affichera dans sa totalité ou se répètera sur toute la surface de la page en créant un effet de mosaïque.

Chargement d'un fichier sonore ou vidéo

Il est possible de charger un certain nombre de fichiers sonores ou videos lors de l'affichage d'une page en faisant appel à des programmes externes que lance le navigateur (Plug-in).

La lecture de ces fichiers n'est cependant possible que dans la mesure où l'utilisateur a sur sa machine les programmes ainsi sollicités.
Spécificité Netscape Modules enchâssés
<EMBED>
Module enchâssé, permet d'insérer des programmes directement dans un document HTML, notamment pour lire des fichiers audio ou vidéo (l'utilisateur aura besoin d'avoir sur son système le programme qui pourra lire ces fichiers).
EMBED est partiellement supportée à partir d'Internet Explorer 3.0 et Netscape 2.0.
SRC="url"
Spécifie la source du fichier.
Exemple :
<EMBED "SRC=hiver.mid" WIDTH="150" HEIGHT="50" AUTOSTART="true" LOOP="true" HIDDEN=false> Netscape

Attributs :
BORDER="?"
Définit la largeur de la bordure lors de l'exécution du programme audio ou vidéo.
HEIGHT="?"
Définit la hauteur de l'espace disponible à l'affichage du programme audio ou vidéo.
WIDTH="?"
Définit la largeur de l'espace disponible à l'affichage du programme audio ou vidéo.
PALETTE="BACKGROUND|FOREGROUND"
Spécifie si la palette du programme doit être en avant-plan ou en arrière-plan.
Spécificité NetScape Spécificité Netscape :
AUTOSTART="TRUE|FALSE"
Permet de faire partir automatiquement les fichiers audio de format WAV, AIFF, AU et MIDI et des fichiers vidéo de format AVI au chargement du document.
AUTOPLAY="TRUE|FALSE"
Permet de lire des séquences audio ou vidéo : AUTOPLAY="TRUE", la séquence vidéo s'exécutera dès que le PLUG-IN estime qu'il est en mesure de lire la totalité du fichier, FALSE il attend les données additionnelles.
HIDDEN="TRUE|FALSE"
Affichage du panneau de contrôle (TRUE par défaut): la valeur FALSE permet de ne pas l'afficher.
CONTROLS="SMALLCONSOLE|LARGECONSOLE"
Permet de lire des séquences audio ou vidéo en spécifiant si les boutons de contrôle STOP, PLAY et PAUSE seront affichés .
LOOP="TRUE|FALSE"
Permet de répéter en boucle ou non la lecture du fichier audio ou vidéo.
Spécificité Internet Explorer Spécificité Internet Explorer :
ALIGN="ABSBOTTOM|ABSMIDDLE|BASELINE|BOTTOM|LEFT|MIDDLE|RIGHT|TEXTTOP|TOP"
Permet de spécifier un alignement au programme.
PLUGINSPACE="nom"
Permet d'attribuer un nom au panneau d'affichage du programme.

Spécificité Internet Explorer Fond sonore spécifique à Internet Explorer :
<BGSOUND>
Fond sonore (Background Sound), permet de lire un fichier audio de type .wav, .au ou .mid au chargement de la page.
SRC="url"
Source du fichier audio.
LOOP="?"
Permet de répéter ou non la lecture du fichier audio (1 par défaut): la valeur -1 spécifie une répétition en boucle.
Exemple :
<BGSOUND SRC="hiver.mid" LOOP="-1"> Internet Explorer



Réalisation : Lise-Emilie Lévy - Dernière modification le 23 août 1999 - © 1997/1998