Comunidades Virtuales

MODULO 4 EDITORES WEB
LENGUAJES

Frames
Las vistas (frames) permiten dividir las páginas HTML en varias regiones con barras de desplazamiento, lo que permite presentar la información de manera muy flexible.
Cada vista o región tiene distintas características:
* Se le puede asignar un URL, de modo que puede cargar información independientemente de otras vistas de la página.
* Puede asignársele un nombre (NAME), permitiendo que sean referenciadas por otros URL.
* Puede redimensionarse dinámicamente si el usuario cambia el tamaño de la ventana (aunque el redimensionamiento puede deshabilitarse, asegurando un tamaño constante de las vistas).
Estas propiedades ofrecen nuevas posibilidades:
* Los elementos que el usuario debe ver siempre, como barras de control, copyrights o títulos gráficos pueden colocarse en vistas individuales estáticas. Mientras el usuario navega por el servidor en las vistas dinámicas, los contenidos de la vista estática permanecen fijos, independientemente de que otras vistas sean redibujadas.
* Los índices de contenidos son más funcionales. Una vista puede contener una página con enlaces que, al seleccionarse, muestren los resultados en una vista contigua.
* El diseño de vistas paralelas permite enviar consultas desde una de ellas y ver los resultados en la otra, teniendo pregunta y respuesta visibles en la misma página.
La sintaxis de las vistas es muy similar a la de las tablas, y están diseñadas para ser procesadas rápidamente por los visores.
Los nuevos elementos definidos son:
* FRAMESET, que define un conjunto de vistas,
* FRAME, que define las características de una vista concreta, y
* NOFRAMES, que permite incluir información para visores que no disponen de soporte para múltiples vistas.
Comentaremos a continuación cada uno de ellos.
El primer elemento, <FRAMESET>, es el principal contenedor para una vista. Toma dos atributos ROWS y COLS (filas y columnas). Un documento con vistas no tiene cuerpo (BODY) y ninguna de las marcas que normalmente se colocarían en él puede aparecer antes de la marca <FRAMESET> o esta última será ignorada.
La marca inicial FRAMESET tiene su correspondiente marca de cierre </FRAMESET>, y dentro de ellas sólo se pueden tener otras marcas de FRAMESET anidadas, marcas FRAME o la marca NOFRAMES.
Los valores de los atributos (ROWS y COLS) necesitan explicación; tanto uno como otro toman como valor una lista de valores separados por comas. Estos valores pueden ser: valores absolutos en píxeles, porcentajes entre 1 y 100 (tantos por cien), o valores de escala relativos.
En el caso del atributo ROWS, el número de filas está implícito en el número de elementos de la lista. Dado que el tamaño total de todas las filas debe coincidir con la altura de la ventana, el alto de las filas debe ser normalizado. Si no se incluye el atributo ROWS, se asume una sola fila de la misma altura que la ventana. El atributo COLS se comporta de manera similar.
Una vez definidas las filas y columnas, la asociación de elementos se hace en función de la forma de declararlas, por ejemplo si tenemos 4 filas y 2 columnas, tendremos un total de 8 valores, donde los primeros cuatro se asignarán a las vistas 1, 2, 3 y 4 de la primera columna, mientras los cuatro restantes corresponderán a las mismas vistas de la segunda columna.
Comentemos con algo más de detalle la sintaxis de la lista de valores:
* valor. Se asume que un valor numérico simple es un tamaño fijo en píxeles. éste es el tipo de valor más crítico, ya que el tamaño de la ventana del cliente variará mucho entre unos y otros. Si se usan valores fijos, será necesario mezclarlos con uno o más valores relativos, ya que en otro caso el visor del usuario probablemente ignorará los valores dados para asegurarse que las proporciones totales de las vistas toman el 100% del ancho y alto de la ventana del usuario.
* valor%. Este valor indica un porcentaje simple entre 1 y 100. Si el total de porcentajes supera 100, todos los porcentajes se escalan hacia abajo. Si el total es menor que 100, y existen vistas de tamaño relativo, el espacio sobrante se les dará a ellas. Si no hay vistas de tamaño relativo, todos los porcentajes se escalarán hacia arriba para llegar a un total del 100%.
* valor*. El valor de este campo es opcional, un sólo asterisco implica una vista de "tamaño relativo", lo que se interpreta como una petición de darle a la vista todo el espacio que quede libre. Si hay varias vistas de tamaño relativo, el espacio libre se divide entre ellas. Si hay un valor delante del asterisco, la vista que lo tenga toma más espacio relativo, por ejemplo "2*,*" daría 2/3 del espacio a la primera vista y un tercio a la segunda.
Veamos algunos ejemplos (sólo hemos empleado filas, pero se haría lo mismo para poner sólo columnas o para definir filas y columnas):
La siguiente declaración implica una página con tres vistas, la primera y la segunda más pequeñas que la central:
<FRAMESET ROWS="20%,60%,20%">
esta otra implica tres filas con las dos de los extremos de tamaño fijo y la central ocupa el espacio restante (variará según el tamaño de la ventana):
<FRAMESET ROWS="100,*,100">

La marca FRAMESET puede estar incluida en otras marcas FRAMESET. En ese caso, la subvista completa se coloca en el espacio que hubiera sido empleado para vista si en lugar de una marca FRAMESET hubiéramos puesto una marca FRAME.
La marca <FRAME> define una vista dentro de un conjunto de ellas. La marca FRAME no contiene nada, por lo que no tiene marca de cierre. Puede tener hasta seis atributos: SRC, NAME, MARGINWIDTH, MARGINHEIGHT, SCROLLING, y NORESIZE. Veamos qué indica cada uno de ellos:
* SRC="url". El atributo SRC toma como valor el URL del documento que se debe mostrar en esa vista en particular. Si no se incluye, se muestra un espacio en blanco del tamaño que debería haber tenido la vista.
* NAME="nom_vista". El atributo NAME se emplea para asignarle un nombre a una vista, de manera que pueda ser referenciada por enlaces en otros documentos (generalmente desde otras vistas en el mismo documento). El atributo es opcional; por defecto las ventanas no tienen nombre. Los nombres deben comenzar con caracteres alfanuméricos y pueden tener marcados sus contenidos con el nuevo atributo TARGET.
* MARGINWIDTH="valor". Este atributo se emplea cuando se quiere controlar el ancho de los márgenes izquierdo y derecho de una vista. Si se especifica un valor, será en píxeles. Los márgenes no pueden tener un tamaño menor que uno (los objetos dentro de la vista no pueden tocar los bordes) y no pueden tener un tamaño que no deje sitio para los contenidos del documento. Este atributo es opcional; por defecto es el visor el que decide el tamaño apropiado.
* MARGINHEIGHT="valor". Es igual que el anterior, pero se refiere a los márgenes superior e inferior.
* SCROLLING="yes|no|auto". El atributo SCROLLING se emplea para indicar si la vista debe tener barras de desplazamiento o no. Si ponemos yes tendremos siempre barras en esa vista, si ponemos no, nunca usaremos barras, mientras que auto hace que el visor decida cuando son necesarias y las coloque donde sea cuando hagan falta. Este atributo es opcional; el valor por defecto es auto.
* NORESIZE. Este atributo no tiene valores, es simplemente un indicador que dice que la vista no puede ser redimensionada por el usuario. Para redimensionar los usuarios seleccionan un borde de la vista y lo desplazan a una nueva posición. Si una vista adyacente a un borde no se puede redimensionar, todo ese borde no se podrá mover, lo que condicionará el redimensionado de otras vistas. El atributo es opcional, por defecto todas las vistas son redimensionables.
Un visor que no soportara vistas no mostraría nada de un documento con cuerpo <FRAME>, para solucionarlo existe el último elemento mencionado, <NOFRAMES>, que se emplea para incluir una página alternativa para esos visores. Un visor que sí soporte la marca <FRAME> ignoraría todas las marcas y datos entre <NOFRAMES> y </NOFRAMES>.
Veamos un ejemplo:
<HTML>
<HEAD> <TITLE>La ventana Indiscreta</TITLE> </HEAD>
<FRAMESET ROWS="100, *, 100">
<NOFRAMES>
<BODY>
Su visor no tiene vistas, pinche <A HREF="nfindex.html">aquí</A> para ver un índice de contenidos.
</BODY>
</NOFRAMES>
<FRAME SRC="menu.html">
<FRAMESET COLS="30%, 70%">
<FRAME NAME="indice">
<FRAME NAME="contenido">
</FRAMESET>
<FRAME SRC="copyright.html">
</FRAMESET>
</HTML>

Script
Introducida por Netscape, permite incluir el código de programas (scripts) directamente en el documento HTML. Sólo funciona en las versiones del Netscape Navigator 2.0 y superiores.
La sintaxis de la inclusión de los scripts en los documentos es:
<SCRIPT>
Instrucciones en JavaScript
...
</SCRIPT>

El atributo opcional LANGUAGE especifica el lenguaje de programación empleado para escribir el guión (pudiendo ser empleado en un futuro para incluir guiones en otros lenguajes de automatización como el AppleScript, PERL o VisualBASIC):
<SCRIPT LANGUAGE="JavaScript">
Instrucciones en JavaScript ...
</SCRIPT>

La marca <SCRIPT>, y su cierre, </SCRIPT>, pueden contener cualquier numero de sentencias JavaScript en un documento. El JavaScript distingue entre mayúsculas y minúsculas.
Una de las peculiaridades de esta marca es que su contenido no es ignorado por los visores que no lo soportan, por lo que se ha incorporado un mecanismo de ocultación del código: los guiones o scripts se pueden colocar dentro de comentarios:
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

Aunque no vamos a describir aquí el JavaScript, hay que indicar un par de cosas sobre cómo se analizan los guiones y dónde se deben colocar en las páginas:
* Definición y llamada de funciones. Los guiones colocados entre marcas SCRIPT se evalúan después de cargar toda la página. Las funciones se almacenan, pero no se ejecutan hasta que no se produce algún evento en la página. Es importante marcar la diferencia entre la definición de la función y la llamada a la misma: la definición simplemente le asigna un nombre y especifica qué hacer cuando es llamada, mientras que la llamada es la que realmente ejecuta el código empleando los parámetros indicados.
* Situación de los guiones. Generalmente, se deben definir las funciones para una página en la cabecera de la misma (HEAD). Dado que la cabecera es lo primero que se carga, esta práctica garantiza que las funciones se han cargado antes de que el usuario tenga opción de hacer cualquier cosa que pueda llamar a una función.
Puede encontrar más información sobre el JavaScript en el URL: http://home.netscape.com/eng/mozilla/Gold/handbook/javascript/.