| Aides et tutos : Scripts : | |
|
Introduction à l'utilisation des frames |
- Exemples
- Attributs balise frameset
- Attributs balise frame
Grâce aux frames (en français "cadres"), vous pouvez afficher plusieurs pages HTML dans différentes zones (ou cadres) !
Utile pour, par exemple, garder toujours le même menu, au même endroit, sans le recharger à chaque fois !
Cependant, il est déconseillé d'utiliser des frames sur votre site, ou dumoins que des frames :
• il n'est pas possible de mettre en favoris une page précise du site.
• il est difficile d'imprimer une page comprenant plusieurs frames.
• les robots des moteurs de recherche indexent pas ou mal les pages qui sont à l'intérieur des frames; vous serez donc mal référencé.
• en supposant que toutes les pages dans les frames soient bien indexées, les visiteurs qui tomberont dessus après une recherche dans un moteur ne trouveront pas les menus de navigation dans le site.
• tout les navigateurs ne supportent pas les frames, nottament dans les anciennes installations.
Vous pouvez tout de même utiliser les frames, cela n'est pas interdit, il crée les avantages suivant :
• L'adresse dans la barre d'adresse reste toujours la même.
• L'adresse de vos page est cachée aux visiteurs.
• Un menu commun à toutes les pages, et qui ne se recharge pas.
Exemple :
Dans la page contenant la frame, il n'y a pas la balise <body> et </body>, elles sont remplacées par <frameset> et </frameset>.
A l'intérieur de ces deux dernières balises, seront écris les différentes frames qui seront visible sur votre site :
exemple 1; avec 2 frames coupées verticalement
<frameset cols="50%,
50%">
<frame src="menu.html" name="frame_1">
<frame src="accueil.html" name="frame_2">
</frameset>
Ce qui donnera :
 |
exemple 2; avec 2 frames coupées honrizontalement
<frameset rows="50%,
50%">
<frame src="menu.html" name="frame_1">
<frame src="accueil.html" name="frame_2">
</frameset>
Ce qui donnera :
 |
exemple 3; avec 1 frame coupée horizontalement et 2 verticalement
<frameset cols="20%,
80%">
<frame src="haut.html" name="frame_1">
<frameset rows="50%, 50%">
<frame src="menu.html" name="frame_2">
<frame src="accueil.html" name="frame_3">
</frameset>
</frameset>
Ce qui donnera :
 |
Remplacez bien évidement le nom des pages (menu.html, haut.html et accueil.html) par le nom de vos pages. La page accueil.html est la page qui s'affichera lors du chargement de la page !
Pour mettre un lien dans la frame frame_1 (frame couleur jaune) ou frame_2 (frame couleur rose) et qu'il soit actif dans la frame frame_3 (frame couleur bleu), mettez le nom de la frame (ici frame_3) dans le lien comme suit :
<a href="page.html" target=frame_3>ma_page.html</a>
En cliquant sur le lien ma_page.html, le fichier page.html se chargera dans la frame frame_3.
Haut de la page
Maintenant, voyons les attributs dans la balise <frameset> et leurs fonctions !
Rows :
Donne les dimensions des frames coupées horizontalement, en pourcentage (entre 1 et 100) ou en une valeur en pixels.
En fixant une seules des valeurs et en donnant à l'autre la valeur *, la valeur s'ajuste automatiquement ! |
Cols :
Donne les dimensions des frames coupées verticalement, en pourcentage (entre 1 et 100) ou en une valeur en pixels.
En fixant une seules des valeurs et en donnant à l'autre la valeur *, la valeur s'ajuste automatiquement ! |
Frameborder :
Indique si le cadre à une bordure ou non (frameborder=yes ou frameborder=no /!\). |
Border
Indique la taille de la bordure en pixels. |
Bordercolor
Indique la couleur de la bordure en héxadécimal ou nom de couleur en anglais. |
Framespacing
Indique l'espace entre les cadres. Valeur en pixels. |
Haut de la page
Maintenant, les attributs de la balise <frame> et leurs fonctions
Src="url"
Définit l'url de la page à afficher dans le cadre. |
Name
Définit un nom qui permettra d'afficher un autre document dans le cadre gâce à l'attribut target d'un lien. |
Marginwidth="x"
Taille des marges latérales en pixels (nombre entier). |
Marginheight="x"
Taille des marges du haut et du bas en pixels (nombre entier). |
Frameborder
Détermine si les cadres auront ou non une bordure (frameborder=yes ou frameborder=no /!\). |
Border="x" (Netscape seulement)
Taille de l'espace entre les cadres.
(/!\ à utiliser uniquement pour Netscape /!\) |
Noresize
Interdit à l'utilisateur de redimensionner les cadres (Ce n'est pas la valeur par défaut).
Ne mettez seulement noresize, cet attribut n'a pas de valeur ! |
Scrolling
Permet ou non l'affichage d'une barre de défilement.
scrolling=yes
scrolling=no
ou scrolling=auto (laisse le navigateur décider de son utilité). |
Retour |
|