Il est possible en HTML de diviser la fenêtre principal du browser en plusieurs zones, chacune d'entre elles correspondant à un document HTML. Ces zones sont appelées frames, elles possèdent un nom unique, ce qui permet à un lien hypertexte de mettre à jour une zone sans modifier les autres.
Avec un document HTML standard, la connexion sur un nouveau document écrase le précédent. Il est possible à l'aide des frames de dédier certaines zones à des actions spécifiques. Par exemple, on peut très bien imaginer pour un livre de définir une zone contenant la table des matières et une autre affichant le chapitre courant.
L'élaboration d'un document intégrant les frames se fait en deux temps:
. Mise au point du découpage de la fenêtre,
. Construction des documents HTML correspondant aux différentes zones.
10.1. Construction d'une maquette On utilise pour celà trois balises <FRAMESET>, <FRAME> et <NOFRAMES>. Le corps du document n'est plus inséré entre <BODY> et </BODY> mais entre les balises <FRAMESET> et </FRAMESET>. Cette balise accepte l'un ou l'autre de ces attributs:
  • ROWS="h1,...,hm": divise la fenêtre en m lignes de tailles respectives h1,...,hmhi peut être de la forme suivante:
    n : hauteur de la sous-zone en pixels.
    n% : hauteur de la sous-zone exprimée en % de la taille de la zone mère.
    * : la hauteur de la sous-zone occupe la taille disponible restante dans la zone mère. Si plusieurs sous-zones utilisent ce format, la taille disponible est répartie équitablement.
    n* : ne s'utilise que lorsque la taille d'au moins une sous-zone a été définie avec le format *. Ceci indique alors que la sous-zone doit recevoir une proportion n fois supérieure de la place encore disponible.
  • COLS="h1,...,hm": divise la fenêtre en m colonnes de tailles respectives h1,...,hm (cf. ci-dessus pour le format de hi).
    Exemple: La division ci-dessous (3 zones, la taille des 2 zones supérieures étant égale au double de la zone inférieure):

    ZONE 1
    ZONE 2
    ZONE 3

    correspond au code suivant:

    <FRAMESET ROWS="40%,40%,20%">
         ...
    </FRAMESET>
    
    ou
    <FRAMESET ROWS="2*,*,*">
         ...
    </FRAMESET>
    
    Entre les balises <FRAMESET> et </FRAMESET>, il faut insérer, pour chaque sous-zone définie, la balise <FRAME> permettant de rattacher la sous-zone à un document. Cette balise accepte six attributs:
    SRC="URL" : indique l'emplacement du document devant être affiché dans la zone.
    NAME="NOM" : donne un nom à la frame afin qu'elle puisse devenir la cible d'un lien hypertexte.
    MARGINWIDTH="n" : espace en pixels entre les frontières gauches et droites de la zone et le document HTML à afficher.
    MARGINHEIGHT="n" : espace en pixels entre les frontières hautes et basses de la zone et le document HTML à afficher.
    SCROLLING="YES|NO|AUTO" : indique si la zone doit posséder une barre de défilement, ou si ce choix est géré automatiquement par le browser.
    NORESIZE : indique au browser qu'il doit inhiber la possibilité de redéfinir la taille de la zone à l'aide de la souris.

    Une autre balise peut s'insérer entre les définitions de <FRAMESET> et </FRAMESET>, la balise <NOFRAMES>. Tout ce qui se trouve entre <NOFRAMES> et </NOFRAMES> sera affiché à la place des frames si le browser ne gère pas ces dernières (ce qui est de plus en plus rare).

    10.2. Imbrication de frames Il est possible d'imbriquer les balises <FRAMESET> afin de diviser une fenêtre en un ensemble de lignes et de colonnes.
    Exemple: Le découpage suivant

    ZONE 1
    ZONE 2.1 ZONE 2.2 ZONE 2.3

    est obtenu par:

    <FRAMESET ROWS="75%,25%">
         <FRAME SRC="fic1.html" NAME="haut">
         <FRAMESET COLS="*,*,*">
              <FRAME SRC="fic2.html" NAME="basgauche">
              <FRAME SRC="fic3.html" NAME="basmilieu">
              <FRAME SRC="fic4.html" NAME="basdroite">
         </FRAMESET>
         <NOFRAMES>
              Votre browser ne g&egrave;re pas les frames !
         </NOFRAMES>
    </FRAMESET>
    
    Il est déconseillé d'utiliser cette méthode. En effet, dans ce cas, si on veut afficher un document dans la zone inférieure, il faut absolument le faire dans l'une des 3 sous-zones disponibles, il est impossible de le faire dans la zone inférieure complète. C'est pourquoi, il est préférable de décrire la structure ci-dessus en 2 étapes:
    1. Création d'un premier fichier zone.html décrivant le découpage en lignes:
    <FRAMESET ROWS="75%,25%">
         <FRAME SRC="fic1.html" NAME="haut">
         <FRAME SRC="zonebas.html" NAME="bas">
    </FRAMESET>
    
    2. Le fichier zonebas.html contient alors la description des trois sous-zones:
    <FRAMESET COLS="*,*,*">
         <FRAME SRC="fic21.html" NAME="basdroite">
         <FRAME SRC="fic22.html" NAME="basmilieu">
         <FRAME SRC="fic23.html" NAME="basgauche">
    </FRAMESET>
    
    Avec cette description, on possède un contrôle total sur le découpage de la fenêtre. Un document peut occuper entièrement la zone inférieure (car elle possède maintenant un nom) ou bien l'une des trois sous-zones qui la composent.

    10.3. Activation d'une zone via un lien hypertexte Avec l'utilisation des frames, la balise <A HREF="URL"> accepte l'attribut TARGET qui permet de spécifier le nom de la zone devant recevoir le document correspondant au lien.
    Exemple: <A HREF="test.html" TARGET="basgauche">
    permet avec la structure définie précédemment d'afficher le contenu du fichier test.html dans la fenêtre inférieure gauche du browser. Deux autres cas sont à considérer:

    a) l'attribut TARGET a une valeur qui ne correspond à aucune des frames existantes. Le browser ouvre alors une nouvelle fenêtre et y affiche le document. Cette fenêtre est considérée comme une frame dont le nom est la valeur de l'attribut TARGET.

    b) l'attribut TARGET prend l'une des valeurs prédéfinies suivantes:
    _blank : le browser crée une nouvelle fenêtre sans nom.
    _self : le document est chargé dans la même zone que celle dans laquelle se trouve le lien.
    _top : le browser supprime toute la hiérarchie des frames existantes et le document occupe toute la surface du browser.
    _parent : affiche le document dans la zone mère de la frame dans laquelle se trouve le lien.

    Cette dernière option n'est exploitable que si différents niveaux de frames ont été définis comme cela a été expliqué au paragraphe 10.2. En reprenant l'exemple qui y est décrit, le fichier zone.html correspond au niveau hiérarchique 0 et le fichier zonebas.html au niveau hiérarchique 1.
    La frame "bas" est la zone mère des frames "basgauche", "basmilieu", "basdroite".
    La zone "basdroite.html" correspond au fichier fic23.html. Si ce fichier contient un lien de la forme:

    <A HREF="test.html" TARGET="_parent">...</A>
    alors le fichier test.html sera affiché dans toute la zone inférieure du browser (élimination des 3 sous-zones). Par contre un lien de la forme:
    <A HREF="test.html" TARGET="_top">...</a>
    affichera le fichier test.html sur toute la surface du browser et repositionnera le niveau hiérarchique des frames à 0.