Tout sur le Net Bienvenue au Soutien du Net!
Générateur de cadres (frames)

[Cadres - paramètres]     [Cadres - Générateur]


Des cadres divisent la fenêtre du navigateur en différentes parties dans lesquelles une propre page HTML peut figurer. C´est particulièrement approprié dans les cas de bannières-annonces, pour la navigation ou pour des liens de partenaires.

La page d´acceuil n´a elle-même aucun contenu à part la définition des cadres (frames). En outre l´on peut y intégrer des données telles que des balises META ou des remarques pour les navigateurs qui sont inaptes à la gestion de frames. Ces définitions de frames iront charger les pages HTML dans les parties prévues pour de la fenêtre du navigateur.

Toutes les fonctions décrites ici peuvent être aisément testées avec mon générateur de cadres. Les explications sont tenues en HTML et devront être adaptées en fonction de votre éditeur WYSIWYG, car ceci exploserait le cadre de cette page.

Schématique de Structure
Rangées et colonnes
Les frames et leurs contenus
Région NoFrames
Références (Liens)
Modifier plusieurs frames

[retour]  Schématique de Structure
Voilà une schématique de Structure. Les définitions de frames doivent se trouver entre les balises <html> et </html> aprés la partie <head>.

     <HTML>
          <HEAD>
               <title>Votre-Homepage</title>
          </HEAD>

          <frameset ...>
               ... données exactes pour chaque frame
          </frameset>

     </HTML>

La définition est introduite par <frameset>; ce faisant peuvent s´ajouter d´autres paramètres. Pour chaque balise de début une balise de fin, </frameset>, sera obligatoire. En particulier dans des imbrications de frames il est extrèmement important d´insérer les balises de fin au bon endroit, sinon le résultat sera faux.
[retour]  Rangées et colonnes
La répartition peut être agrandie à volonté. Un frameset avec 4 colonnes sera défini comme ceci: cols="15%,35%,35%,15%">.

A la place de dimensions en % vous pouvez aussi bien donner des dimensions absolues en pixels. P.e. <frameset rows="100,*">. L´astérisque a une fonction de Joker et donne à cette partie le reste de la place à disposition. Dans ce cas précis vous aurez une fenêtre à 100 pixels et en dessous une fenêtre qui occupera le reste de la place de la fenêtre du navigateur. Bien entendu il ne devra y avoir qu'un seul astérisque dans votre définition.

Pour un mélange de rangées et colonnes vous devez travailler avec des frames imbriqués. Dans ce cas la fenêtre sera divisée successivement jusqu´à obtenir le résultat voulu.
Ci suivant une définition simplifiée qui divise la fenêtre d´abord en 2 colonnes et qui divise ensuite la 2ème colonne en 2 rangées. Les remarques entre parenthèses ne sont que des explications.

     <frameset cols="160,*">
          ... (2 colonnes, à gauche 160 pixel, à droite le reste qui sera encore divisé par la suite)
          <frameset rows="100,*">
               ... (colonne droite, rangée supérieure 100 Pixel)
               ... (colonne droite, rangée inférieure qui occupera le reste)
          </frameset>
     </frameset>


[retour]  Les frames et leurs contenus
Aprés avoir défini les régions de la fenêtre, frameset, vous devez définir dans quelle région devra apparaître quelle page. En plus chaque région obtiendra son propre nom unique. Ceci est nécessaire afin de pouvoir par la suite, avec des commandes spéciales, référencer ces régions dans d´autres pages. En outre là aussi peuvent s´ajouter d´autres paramètres.
Exemple: Nous construisons une page avec 3 frames. A gauche le menu de navigation, la page s´appelle: menu.html, le frame: gauche; en haut à droite une région de bannière, la page s´appelle: banner.html, le frame: haut; et en dessous nous avons la fenêtre principale que nous nommerons main.html et le frame: principal.

     <frameset cols="160,*">
          <frame src="menu.html" name="gauche">
          <frameset rows="100,*">
               <frame src="banner.html" name="haut">
               <frame src="main.html" name="principal">
          </frameset>
     </frameset>

Remarque: dans cet exemple tous les fichiers html se trouvent dans le même répertoire que la page avec les définitions de frames. Si vous voulez y mettre des pages à partir de sous-répertoires ou d´autres serveurs le lien src="x" devra être modifié en fonction. Ainsi ici pourrait se trouver p.e. src="pierre/main.html" ou src="http://www.Ledomaine/pierre/main.html".
[retour]  Région NoFrames
Dans la région noframes vous pouvez placer un texte alternatif pour les navigateurs incapables de visualiser des frames (et oui! Cela existe!). En outre vous pouvez placer ici des liens vers les sous-pages, afin que les moteurs de recherche, qui eux n´interprètent pas les frames, puisse indexer vos sous-pages.

Exemple:

     <HTML>
          <HEAD>
               <title>Votre page principale</title>
          </HEAD>

          <frameset ...>
               ... données exactes pour chaque frame

               <noframes>
                    Malheureusement ton navigateur n´affiche pas les frames. Tu peux quand-même visiter mes pages. Cliques
                    simplement sur les liens suivants:<br /><br />

                    <a href="main.html">acceuil</a><br />
                    <a href="banner.html">annonces</a>
               </noframes>

          </frameset>
     </HTML>
[retour]  Références (Liens)
Tout lien normal s´ouvre dans la fenêtre de la page active. Si cependant vous voulez que la page s´ouvre dans une nouvelle fenêtre, vous voulez terminer le frameset ou ouvrir une page dans un autre frame vous devez y ajouter une cible, target.
Exemple:
Vous voulez dans la navigation à l´exemple de Les frames et leurs contenus y ajouter 2 liens, desquels le premier ouvre une page nommée blagues.html dans la page principale et la page netsoutien.com est ouverte dans une nouvelle fenêtre.

     <a href="blagues.html" target="principal">Blagues</a>
     <a href="http://www.netsoutien.com" target="_blank">Soutien du Net</a>

Tous les éditeurs qui traitent des frames ont une simple fonction (cible, frame-cible, target ou équivalent) pour donner les informations requises aux liens. Pour ceci voir l´aide de votre éditeur.
[retour]  Modifier plusieurs frames
pour changer plusieurs frames avec un seul lien (clic) nous devrons avoir recours à un petit javascript qui devra être inséré dans la partie HEAD:

     <script language="JavaScript">
          <!--
          function fenetre(URL1,URL2,URL3) {
               parent.Frame1.location.href=URL1;
               parent.Frame2.location.href=URL2;
               parent.Frame3.location.href=URL3;
          }
          //-->
     </script>

Au lieu de Frame1 Frame2 Frame3 vous devez y placer les noms définis par name= dans le frameset.

Ceci est le lien qui devra être placé dans la partie BODY de la page:

     <a href="javascript: fenetre ('page1.html','page2.html','page3.html')">

Dans ce code de liens vous devez remplacer les URLs page1.html page2.html page3.html par les noms de pages respectives à placer dans les frames.

Si vous n´avez que 2 liens à placer, vous devez supprimer ,URL3 et parent.Frame3.location.href=URL3; dans l´appel de fonction du javascript.
Par analogie vous pouvez également en étendant la commande, y ajouter d´autres frames.