La version française de cette traduction est :
http://www.la-grange.net/w3c/html4.01/
Traducteur : J.J.Solari dans le cadre de l'effort de la liste de discussion w3c-translators.fr@w3.org
La version française peut contenir des erreurs. La version anglaise de cette note est l'unique version
normative. Version originale : http://www.w3.org/TR/1999/REC-html401-19991224
Sommaire
Les cadres HTML permettent aux auteurs de présenter les documents selon des vues multiples, qui peuvent être des fenêtres indépendantes ou bien des sous-fenêtres. Les vues multiples offrent aux concepteurs les moyens de garder visibles certaines informations, tandis que d'autres vues sont défilées ou remplacées. Par exemple, dans la même fenêtre, un cadre pourrait afficher une bannière statique, un deuxième cadre afficher un menu de navigation et un troisième le document principal qui peut défiler ou être remplacé au gré de la navigation via le deuxième cadre.
Voici un document avec des cadres simple :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un document avec un jeu d'encadrement simple</TITLE>
</HEAD>
<FRAMESET cols="20%, 80%">
<FRAMESET rows="100, 200">
<FRAME src="contenu_du_cadre1.html">
<FRAME src="contenu_du_cadre2.gif">
</FRAMESET>
<FRAME src="contenu_du_cadre3.html">
<NOFRAMES>
<P>Ce document avec un jeu d'encadrement contient :
<UL>
<LI><A href="contenu_du_cadre1.html">Un contenu sympa</A>
<LI><IMG src="contenu_du_cadre2.gif" alt="Une image sympa">
<LI><A href="contenu_du_cadre3.html">D'autres contenus sympas</A>
</UL>
</NOFRAMES>
</FRAMESET>
</HTML>
ce qui pourrait créer la disposition de cadres suivante :
--------------------------------------- | | | | | | | Cadre 1 | | | | | | | | |---------| | | | Cadre 3 | | | | | | | | | | | Cadre 2 | | | | | | | | | | | | | | ---------------------------------------
Si l'agent utilisateur ne peut pas afficher les cadres ou bien n'est pas configuré pour le faire, alors il restituera le contenu de l'élément NOFRAMES.
Le document HTML qui décrit la disposition des cadres (appelé document avec jeu d'encadrement [ndt. frameset document]) obéit à une structure différente de celle du document HTML sans cadres. Le document standard possède une section HEAD et une section BODY. Le document avec jeu d'encadrement possède une section HEAD et une section FRAMESET à la place de BODY.
La section FRAMESET du document spécifie la disposition des vues dans la fenêtre principale de l'agent utilisateur. En outre, la section FRAMESET peut contenir un élément NOFRAMES afin d'offrir un contenu de remplacement aux agents utilisateurs qui ne reconnaissent pas les cadres ou bien ne sont pas configurés pour afficher ces cadres.
Les éléments, qui normalement seraient placés dans la section BODY, ne doivent pas apparaître avant le premier élément FRAMESET, sinon cet élément FRAMESET sera ignoré.
<![ %HTML.Frameset; [ <!ELEMENT FRAMESET - - ((FRAMESET|FRAME)+ & NOFRAMES?) -- subdivision de fenêtre --> <!ATTLIST FRAMESET %coreattrs; -- id, class, style, title -- rows %MultiLengths; #IMPLIED -- liste de longueurs, par défaut : 100% (une seule rangée) -- cols %MultiLengths; #IMPLIED -- liste de longueurs, par défaut : 100% (une seule colonne) -- onload %Script; #IMPLIED -- tous les cadres ont été chargés -- onunload %Script; #IMPLIED -- tous les cadres ont été retirés -- > ]]>
Définition des attributs
Attributs définis ailleurs
L'élément FRAMESET spécifie la disposition de la fenêtre principale de l'utilisateur selon des subdivisions rectangulaires.
La spécification de l'attribut rows définit le nombre de subdivisions horizontales dans un jeu d'encadrement. La spécification de l'attribut cols définit le nombre de subdivisions verticales. Les deux attributs peuvent être utilisés simultanément pour créer une grille.
Si l'attribut rows est absent, chaque colonne occupe la hauteur entière de la page. Si l'attribut cols est absent, chaque rangée occupe la largeur entière de la page. Si aucun de ces attributs n'est présent, alors le cadre occupe exactement les dimensions de la page.
Les cadres sont créés de gauche à droite pour les colonnes et de haut en bas pour les rangées. Quand les deux attributs sont spécifiés, les vues sont créées de gauche à droite dans la rangée supérieure, de gauche à droite dans la rangée suivante, etc.
Le premier exemple divise l'écran en deux verticalement (i.e., crée une moitié supérieure et une moitié inférieure).
<FRAMESET rows="50%, 50%"> ...le reste de la définition... </FRAMESET>
L'exemple suivant crée trois colonnes. La deuxième a une largeur fixe de 250 pixels (qui peut servir, par exemple, à contenir une image dont les dimensions sont connues). La première reçoit 25% de l'espace disponible et la troisième les 75% restant.
<FRAMESET cols="1*,250,3*"> ...le reste de la définition... </FRAMESET>
L'exemple suivant crée une grille de 2×3 subdivisions.
<FRAMESET rows="30%,70%" cols="33%,34%,33%"> ...le reste de la définition... </FRAMESET>
Pour l'exemple qui va suivre, on suppose que la fenêtre du navigateur fait 1000 pixels de haut. La première vue se voit allouer 30% de la hauteur totale (300 pixels). La seconde vue est fixée pour avoir exactement 400 pixels de haut. Il reste 300 pixels à répartir entre les deux autres cadres. La hauteur du quatrième cadre est définie comme étant "2*", il est donc deux fois plus haut que le troisième cadre, dont la hauteur n'est que de "*" (équivalant à "1*"). Ainsi, le troisième cadre fera 100 pixels de haut et le quatrième 200 pixels de haut.
<FRAMESET rows="30%,400,*,2*"> ...le reste de la définition... </FRAMESET>
Les longueurs absolues dont le total n'est pas égal à 100% de l'espace disponible réel devraient être ajustées par l'agent utilisateur. Quand ce total est inférieur à 100%, l'espace restant devrait être alloué proportionnellement à chaque vue. Quand il est supérieur, chaque vue devrait être réduite en fonction de la proportion de l'espace total qui lui est spécifiée.
Les jeux d'encadrement peuvent s'imbriquer à n'importe quel niveau.
Dans l'exemple suivant, l'élément FRAMESET externe divise l'espace disponible en trois colonnes égales. L'élément FRAMESET interne partage alors la deuxième en deux rangées de hauteur inégale.
<FRAMESET cols="33%, 33%, 34%">
...le contenu du premier cadre...
<FRAMESET rows="40%, 50%">
...le contenu du deuxième cadre, première rangée...
...le contenu du deuxième cadre, seconde rangée...
</FRAMESET>
...le contenu du troisième cadre...
</FRAMESET>
Les auteurs peuvent partager des données entre plusieurs cadres en incluant celles-ci au moyen de l'élément OBJECT. Les auteurs devraient inclure l'élément OBJECT dans l'élément HEAD du document avec jeu d'encadrement et nommer cet objet avec un attribut id. Tout document qui est le contenu d'un cadre dans le jeu d'encadrement peut se référer à cet identifiant.
L'exemple suivant illustre la manière dont un script pourrait appeler un élément OBJECT défini pour le jeu d'encadrement entier :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Voici un jeu d'encadrement avec un OBJECT dans HEAD</TITLE>
<!-- Cet OBJECT n'est pas restitué ! -->
<OBJECT id="monobjet" data="data.bar"></OBJECT>
</HEAD>
<FRAMESET>
<FRAME src="bianca.html" name="bianca">
</FRAMESET>
</HTML>
<!-- Dans le document bianca.html -->
<HTML>
<HEAD>
<TITLE>La page de Bianca</TITLE>
</HEAD>
<BODY>
...le début du document...
<P>
<SCRIPT type="text/javascript">
parent.monobjet.propriété
</SCRIPT>
...le reste du document...
</BODY>
</HTML>
<![ %HTML.Frameset; [ <!-- Les noms de cadre réservés commencent par le caractère souligné « _ », sinon ils commencent par une lettre --> <!ELEMENT FRAME - O EMPTY -- sous-fenêtre --> <!ATTLIST FRAME %coreattrs; -- id, class, style, title -- longdesc %URI; #IMPLIED -- lien vers une description longue (en complément de l'attribut title) -- name CDATA #IMPLIED -- nom du cadre à viser -- src %URI; #IMPLIED -- source du contenu du cadre -- frameborder (1|0) 1 -- bordure de cadre ou non ? -- marginwidth %Pixels; #IMPLIED -- les marges horizontales en pixels -- marginheight %Pixels; #IMPLIED -- les marges verticales en pixels -- noresize (noresize) #IMPLIED -- autoriser le redimensionnement du cadre ? -- scrolling (yes|no|auto) auto -- ascenseurs ou non -- > ]]>
Définition des attributs
Attributs définis ailleurs
L'élément FRAME définit le contenu et l'apparence d'un seul cadre.
L'attribut src spécifie le document initial que le cadre va contenir.
Soit l'exemple de document HTML suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un document avec jeu d'encadrement</TITLE>
</HEAD>
<FRAMESET cols="33%,33%,33%">
<FRAMESET rows="*,200">
<FRAME src="contenu_du_cadre1.html">
<FRAME src="contenu_du_cadre2.gif">
</FRAMESET>
<FRAME src="contenu_du_cadre3.html">
<FRAME src="contenu_du_cadre4.html">
</FRAMESET>
</HTML>
celui-ci devraient produire une disposition des cadres semblable à :
------------------------------------------ |Cadre 1 |Cadre 3 |Cadre 4 | | | | | | | | | | | | | | | | | | | | | | | | | | | | | -------------| | | |Cadre 2 | | | | | | | | | | | ------------------------------------------
ainsi qu'il va entraîner l'agent utilisateur à charger chaque fichier dans une vue séparée.
Le contenu d'un cadre ne doit pas se trouver dans le même document que la définition de ce cadre.
EXEMPLE ILLÉGAL :
La définition de jeu d'encadrement suivante n'est pas légale pour HTML,
parce que le contenu du deuxième cadre se trouve dans le même document que le jeu d'encadrement.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un document avec jeu d'encadrement</TITLE> </HEAD> <FRAMESET cols="50%,50%"> <FRAME src="contenu_du_cadre1.html"> <FRAME src="#ancre_dans_le_meme_document"> <NOFRAMES> ...un texte... <H2><A name="ancre_dans_le_meme_document">Passage important</A></H2> ...un texte... </NOFRAMES> </FRAMESET> </HTML>
L'exemple suivant illustre l'utilisation des attributs décoratifs de l'élément FRAME. On spécifie que le cadre 1 n'aura pas de barre de défilement. Le cadre 2 laissera un espace autour de son contenu (initialement, un fichier d'image) et ne sera pas redimensionnable. Aucune bordure ne sera dessinée entre les cadres 3 et 4. Des bordures seront dessinées (par défaut) entre les cadres 1, 2 et 3.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un document avec jeu d'encadrement</TITLE>
</HEAD>
<FRAMESET cols="33%,33%,33%">
<FRAMESET rows="*,200">
<FRAME src="contenu_du_cadre1.html" scrolling="no">
<FRAME src="contenu_du_cadre2.gif"
marginwidth="10" marginheight="15"
noresize>
</FRAMESET>
<FRAME src="contenu_du_cadre3.html" frameborder="0">
<FRAME src="contenu_du_cadre4.html" frameborder="0">
</FRAMESET>
</HTML>
Remarque : Pour des renseignements au sujet des pratiques actuelles pour déterminer la cible d'un cadre, veuillez consulter les remarques sur les cadres en appendice.
Définition des attributs
Veuillez consulter la section sur les noms des cadres cibles pour des précisions sur les noms de cadre reconnus.
Cet exemple illustre la manière dont l'attribut target autorise la modification dynamique du contenu d'un cadre. Nous définissons d'abord un jeu d'encadrement dans le document "frameset.html suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un document avec jeu d'encadrement</TITLE> </HEAD> <FRAMESET rows="50%,50%"> <FRAME name="fixe" src="init_fixe.html"> <FRAME name="dynamique" src="init_dynamique.html"> </FRAMESET> </HTML>
Ensuite, dans le document "init_dynamique.html" suivant, nous effectuons une liaison vers le cadre nommé « dynamique ».
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Un document ayant des ancres avec des cibles spécifiques</TITLE>
</HEAD>
<BODY>
...commencement du document...
<P>Maintenant vous pouvez aller à la
<A href="diapo2.html" target="dynamique">diapositive 2.</A>
...more document...
<P>Vous vous débrouillez bien. Allez à la
<A href="diapo3.html" target="dynamique">diapositive 3.</A>
</BODY>
</HTML>
L'activation de l'un ou l'autre lien entraîne l'ouverture d'un nouveau document dans le cadre nommé « dynamique », tandis que l'autre cadre nommé « fixe » conserve son contenu initial.
Pour l'instant, il n'existe aucun moyen pour coder le statut complet d'un jeu d'encadrement dans un URI. C'est pourquoi, nombre d'agents utilisateurs ne permettent pas de placer un signet [ndt. bookmark] sur un jeu d'encadrement.
Quand, dans le même document, plusieurs liens désignent la même cible, il est possible de spécifier la cible une seule fois et de se passer de l'attribut target de chaque élément. On réalise ceci en définissant l'attribut target sur l'élément BASE.
Revenons à l'exemple précédent, cette fois par la mise en facteur des informations de cible, en les définissant dans l'élément BASE et en les supprimant des éléments A.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Un document ayant un élément BASE avec une cible particulièret</TITLE>
<BASE href="http://www.mycom.com/diapos" target="dynamique">
</HEAD>
<BODY>
...commencement du document...
<P>Maintenant vous pouvez aller à la <A href="slide2.html">diapositive 2.</A>
...suite du document...
<P>Vous vous débrouillez bien. Allez à la
<A href="slide3.html">diapositive 3.</A>
</BODY>
</HTML>
Les agents utilisateurs devraient déterminer le cadre cible, dans lequel charger une ressource reliée, selon la préséance suivante (de la priorité la plus élevée à la plus basse) :
Les agents utilisateurs devraient fournir aux utilisateurs un mécanisme pour surclasser l'attribut target.
Les auteurs devraient fournir un contenu de remplacement pour les agents utilisateurs qui ne reconnaissent pas les cadres ou qui sont configurés pour ne pas les afficher.
<![ %HTML.Frameset; [ <!ENTITY % noframes.content "(BODY) -(NOFRAMES)"> ]]> <!ENTITY % noframes.content "(%flow;)*"> <!ELEMENT NOFRAMES - - %noframes.content; -- enveloppe du contenu de remplacement pour une restitution sans cadres --> <!ATTLIST NOFRAMES %attrs; -- %coreattrs, %i18n, %events -- >
Attributs définis ailleurs
L'élément NOFRAMES spécifie le contenu qui ne devrait être affiché que par les agents utilisateurs ne reconnaissant pas les cadres ou non configurés pour les afficher. Les agents utilisateurs qui reconnaissent les cadres doivent seulement afficher le contenu d'une déclaration NOFRAMES que s'ils sont configurés pour ne pas afficher les cadres. Les agents utilisateurs qui ne reconnaissent pas les cadres doivent afficher le contenu de l'élément NOFRAMES dans tous les cas.
L'élément NOFRAMES fait partie à la fois des DTD transitoire et de jeu d'encadrement. Dans un document qui fait appel au DTD de jeu d'encadrement, l'élément NOFRAMES peut s'utiliser à la fin de la section FRAMESET du document.
Par exemple :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un document avec jeu d'encadrement et NOFRAMES</TITLE>
</HEAD>
<FRAMESET cols="50%, 50%">
<FRAME src="principal.html">
<FRAME src="table_des_matieres.html">
<NOFRAMES>
<P>Voici la <A href="principal-noframes.html">
version sans cadres du document.</A>
</NOFRAMES>
</FRAMESET>
</HTML>
On peut utiliser l'élément NOFRAMES, par exemple, dans un document qui est la source d'un cadre et qui utilise le DTD transitoire. Cela permet aux auteurs d'expliquer l'objet du document, au cas où celui-ci serait vu indépendamment du jeu d'encadrement, ou avec un agent utilisateur qui ne reconnaît pas les cadres.
L'attribut longdesc permet aux auteurs de rendre les documents avec des cadres plus accessibles aux personnes utilisant des agents utilisateurs non-visuels. Cet attribut désigne une ressource qui fournit une description longue du cadre. Les auteurs devraient remarquer que les longues descriptions associées aux cadres sont attachées aux cadres, et non au contenu de ceux-ci. Étant donné que le contenu peut varier au cours du temps, la description longue initiale va vraisemblablement devenir inadéquate pour les contenus ultérieurs du cadre. En particulier, les auteurs ne devraient pas inclure une image comme seul contenu d'un cadre.
Le document avec jeu d'encadrement suivant décrit deux cadres. Le cadre de gauche contient une table des matières et celui de droite contient initialement l'image d'une autruche :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un document avec jeu d'encadrement mal fait</TITLE> </HEAD> <FRAMESET cols="20%, 80%"> <FRAME src="table_des_matieres.html"> <FRAME src="autruche.gif" longdesc="autruche-desc.html"> </FRAMESET> </HTML>
Remarquez que l'image est incluse dans le cadre indépendamment de tout élément HTML, de sorte que l'auteur n'a pas d'autres moyens pour spécifier un texte de remplacement que l'attribut longdesc. Si le contenu du cadre de droite change (par exemple, l'utilisateur choisi un serpent à sonnettes dans la table des matières), les utilisateurs n'auront aucun accès textuel au nouveau contenu du cadre.
Les auteurs ne devraient donc pas mettre une image directement dans un cadre. L'image devrait plutôt être spécifiée dans un document HTML séparé dans lequel elle sera annotée avec le texte de remplacement adéquat :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un document avec jeu d'encadrement bien fait</TITLE> </HEAD> <FRAMESET cols="20%, 80%"> <FRAME src="table_des_matieres.html"> <FRAME src="autruche-conteneur.html"> </FRAMESET> </HTML>
<!-- Dans le document autruche-conteneur.html: --> <HTML> <HEAD> <TITLE>L'autruche rapide et puissante</TITLE> </HEAD> <P> <OBJECT data="autruche.gif" type="image/gif"> Ces autruches ont vraiment bon goût ! </OBJECT> </HTML>
<!ELEMENT IFRAME - - (%flow;)* -- sous-fenêtre en-ligne --> <!ATTLIST IFRAME %coreattrs; -- id, class, style, title -- longdesc %URI; #IMPLIED -- lien vers une description longue (complément de l'attribut title) -- name CDATA #IMPLIED -- nom du cadre pour ciblage -- src %URI; #IMPLIED -- source du contenu du cadre -- frameborder (1|0) 1 -- request frame borders? -- marginwidth %Pixels; #IMPLIED -- marges horizontales en pixels -- marginheight %Pixels; #IMPLIED -- marges verticales en pixels -- scrolling (yes|no|auto) auto -- scrollbar or none -- align %IAlign; #IMPLIED -- alignement vertical ou horizontal -- height %Length; #IMPLIED -- hauteur du cadre -- width %Length; #IMPLIED -- largeur du cadre -- >
Définition des attributs
Attributs définis ailleurs
Les informations qui doivent être insérées en-ligne sont désignées par l'attribut src de cet élément. Par contre, le contenu de l'élément IFRAME ne devraient être affiché que par les agents utilisateurs qui ne reconnaissent pas les cadres ou qui sont configurés pour ne pas les afficher.
Pour les agents utilisateurs qui reconnaissent les cadres, l'exemple suivant placera un cadre en-ligne, entouré par une bordure, au milieu du texte.
<IFRAME src="foo.html" width="400" height="500"
scrolling="auto" frameborder="1">
[Votre agent utilisateur ne reconnaît pas les cadres ou n'est pas
configuré pour les afficher pour l'instant. Cependant, vous pouvez visiter le
<A href="foo.html">document concerné.</A>]
</IFRAME>
Les cadres en-ligne ne peuvent pas être redimensionnés (et donc n'acceptent pas l'attribut noresize).
Remarque : On peut également incorporer un document HTML dans un autre document HTML avec l'élément OBJECT. Voir la section sur les documents incorporés pour des précisions.