¿Tienes una pagina Web? o ¿la quieres hacer?, pos muy bien, ah! pero... ¿que no sabes hacer FRAMES?... eso no es problema, ahora mismo te cuento como se hacen...
Manos a la obra!!!
Para empezar a utilizar frames es necesario
definir un archivo HTML en el que se definan, valga la redundacia, aquellos
ficheros HTML que deberán de aparecer en los frames que nosotros
creemos. Este fichero suele recibir el nombre del tipo index.htm y lo único
que contendrá, como ya he citado, es la información relativa
a los frames que vamos a utilizar y cuales van a ser los archivos HTML
que carguemos en dichos frames.
Para llevar todo esto a la práctica
vamos a necesitar de muy pocas directivas como vamos a ver a continuación.
Con la directiva <FRAMESET>
tendremos la oportunidad de dividir la pantalla de nuestro navegador favorito
en las zonas que estimemos nos sean necesarias. Lógicamente podremos
realizar divisiones tanto verticales como horizontales.
Junto a la directiva <FRAMESET>
deberemos de utilizar un par de parámetros más que son ROWS
y COLS.
Con el parámetro ROWS podremos dividir la pantalla en zonas horizontales. A su vez, también podremos determinar el tamaño de cada una de ellas medido siempre en tanto porcien (también podremos utilizar valores decimales de tanto por cien para ello bastará con poner la coma ',' separando ambas partes, por ejemplo 22,35%) haciendo incluso más fácil y cómoda su utilización. Un ejemplo de cómo poder dividir la pantalla del navegador a la mitad sería la siguiente:
<FRAMESET
ROWS="50%,50%">
.......
</FRAMESET>
Como podéis comprobar es muy fácil realizar una división de pantalla. Además, también tenemos la oportunidad de dejar al navegador que calcule por si mismo las dimensiones de las zonas (en cuanto a porcentaje a cubrir) de las parcelas que creemos. Para ello sólo tendremos que poner un asterísco y el resto se realizará automáticamente. Ahí va un ejemplo y, después, su explicación para ver todo más claro.
<FRAMESET
ROWS="20%,40%,*">
.......
</FRAMESET>
Esa sencilla instrucción <FRAMESET>
se va a encargar de dividir la pantalla en tres zonas horizontales diferentes.
Una de ellas, la primera, ocupará un 20% del total de pantalla,
la otra un 40% y, por último, la tercera zona ¿qué
ocupará?. Muy sencillo, ocupará simplemente el resto que
será de 40%.
En el caso de que queramos dividir
la pantalla de forma vertical deberemos de utilizar el parámetro
COLS que funciona exactamente igual que lo visto para la ROWS, es decir,
el ejemplo siguiente divide la pantalla en dos zonas verticales.
<FRAMESET
COLS="50%,50%">
.......
</FRAMESET>
Cómo indicarle al navegador la división
Una vez que hemos aprendido cómo
dividir nuestra página para mostrar la información en diferentes
zonas, deberemos de saber cómo indicarle al navegador que queremos
utilizar la división que tenemos en mente.
Para ello utilizaremos un archivo
.HTM que contendrá todas las divisiones que deseamos realizar en
nuestra página así como los archivos HTML que se cargarán
nada más que sean inicializadas. En dicho archivo meteremos, por
tanto, las órdenes relacionadas con la división de la pantalla
(descrita anteriormente) junto a las relacionadas con la carga de los archivos
.HTM que se llevarán a cabo con la directiva <FRAME> y
los parámetros SRC, NAME, SCROLLING y NORESIZE.
Todas ellos son opcionales salvo SRC que deberá de estar presente
obligatoriamente. Pero vayamos por partes:
<FRAME
SRC="hola.htm">
El primero de los planos de que dispongamos se verá cargado con el archivo hola.htm.
<FRAME
SRC="hola.htm" NAME="plano1">
Como veremos más adelante, la asignación de nombres a los planos será muy importante pues nos permitirá poder volcar la información que seleccionemos en un plano o frame determinado a otro distinto.
<FRAME SRC="hola.htm" NAME="plano1" NORESIZE SCROLLING="auto">
Esta instrucción nos cargaría en un plano el archivo hola.htm. Además de no permitir al usuario modificar el tamaño del mismo, crear barras de desplazamiento, si la información no entrara y etiquetar el plano con el nombre plano1.
Os pongo a continuación nuestro archivo index.htm que utiliza todo lo visto hasta ahora.
<HTML>
<HEAD>
<TITLE> Binary
Zone e-zine</TITLE>
</HEAD>
<FRAMESET
COLS="23%,*">
<FRAME SRC="index0.htm"
NAME = "MENU" SCROLLING ="auto" NORESIZE>
<FRAME SRC="hola.htm"
NAME = "TEXTO" SCROLLING ="auto" NORESIZE>
</FRAMESET>
<BODY>
</BODY>
</HTML>
Como podéis comprobar no tiene ningún misterio...
La etiqueta <BASE>
Ya para finalizar, vamos a ver cómo poder hacer que desde un frame o plano podamos cargar la información en otro diferente.
Antes de continuar, debemos de tener
bien claro que hasta ahora, al realizar el enlace desde una página
o frame concreto a un archivo HTML (independientemente de su localización,
esto es, de si es de nuestra propia página o de otra distinta),
se realizaba "machacando" la información de la parcela o frame en
el que estábamos, o lo que es lo mismos, desde el que realizábamos
tal petición de carga.
Pues bien, ahora vamos a aprender
cómo podemos beneficiarnos de los frames para poder realizar cargas
de información en los distintos frames de que dispongamos, es decir,
veremos cómo poder construirnos una página que tenga un menú
a la izquierda y muestre la información a la derecha.
Si volvéis a repasar los atributos que se pueden poner a un frame que creemos, encontraréis que, de entre ellos, había uno destinado a poner el nombre del mismo. Recordémoslo:
<FRAME SRC="index0.htm"
NAME = "MENU" SCROLLING ="auto" NORESIZE>
Si os fijáis, en la directiva FRAME, el atributo NAME = "MENU" lo que hacía era dar un nombre al frame que vamos a definir, pues bien, si nosotros al comienzo de dicho frame, el cual cargará en el ejemplo el archivo index0.htm, ponemos <BASE TARGET="MENU">, haremos que la información siempre se cargue en la parcela o frame al que habíamos llamado MENU y que, en este caso, va a ser el mismísimo lugar en dónde se ha cargado el archivo "index0.htm", es decir, no hemos conseguido nada nuevo... Sin embargo, ¿qué pasaría si en lugar de poner el nombre que habíamos dado al frame en el que se carga el archivo index0.htm ponemos el de otro frame?. Pues muy sencillo, que habremos conseguido volcar el "link" o archivo .htm justo en el lugar que a nosotros más nos interesa en estos momentos, en otro frame distinto al actual.
Un ejemplo
Con esto, ya habremos logrado "configurar" una ventana con las mismas "facilidades" que puede ofrecer tanto Binary Zone como cualquier otra página de las que circulan por Internet. Los frames son un estupendo aliado a la hora de separar y ofrecer la información de la forma más ordenada posible, si bien, todo en abuso es malo. Os lo digo ahora, ojo con el uso que dáis a los frames pues pueden mandar "al carajo" vuestra página. Recordad, no es bueno utilizar ni muchos frames ni muchos gif animados, estáis avisados.
Bien, como creo que ya toca ofrecer un ejemplo más claro de todo lo explicado os mostraré un ejemplo con la cabecerá de la definición de frame y, después, el código de los dos archivos que utiliza. Pensad que en el caso de Binary Zone, se utiliza un archivo .htm que crea los frames y, en cada uno de ellos, carga su archivo .htm correspondiente. En fín, que ahi va un frame parecido al que utiliza Binary Zone, un archivo para menú y otro para la información.
Código del fichero index.htm
<HTML>
<HEAD>
<TITLE>Creador
de frames. index.htm </TITLE>
</HEAD>
<FRAMESET
COLS="25%,75%">
<FRAME SRC="index0.htm"
NAME = "MENU" SCROLLING ="auto" NORESIZE>
<FRAME SRC="hola.htm"
NAME = "TEXTO" SCROLLING ="auto" NORESIZE>
</FRAMESET>
<BODY>
</BODY>
</HTML>
Código
del fichero index0.htm
<HTML>
<HEAD>
<TITLE>Frame
lado izquierdo. index0.htm</TITLE>
</HEAD>
<BODY><h2>Texto
de la frame izquierda </h2>
</BODY>
</HTML>
Código
del fichero index1.htm
<HTML>
<HEAD>
<TITLE>Frame
lado derecho. index1.htm</TITLE>
</HEAD>
<BODY><h2>Texto
de la frame derecha </h2>
</BODY>
</HTML>
Al interpretarse el archivo index.htm se crearán dos frames en pantalla, uno a la izquierda y otro a la derecha. El del lado izquierdo ocupará sólo un 25% del total de la pantalla mientras que el del lado derecho estará "apoderado" de un 75% utilizable.
Esto es todo lo que tienes que hacer
para crearte un frame, nada dificil ¿verdad?... os dejo ya porque
teneis que empezar ha crearos vuestra web.