Marcos en DW

Para poder dividir nuestra página web en dos "partes" (en una estará siempre el menú y en la otra, el contenido que deseemos), podemos insertar marcos.

Puedes hacerlo yendo a "Insertar", HTML  , Marcos y ahora, fíjate en las opciones disponibles. Ahí podemos encontrar distintas combinaciones de marcos, para que elijamos la que más se ajuste a nuestras necesidades.

Podemos empezar eligiendo el marco "izquierda", para que aparezca sólo en ese lado. Dependiendo de nuestra configuración, puede que aparezca este diálogo, donde podemos cambiar el título de los marcos.

(O sea, que donde pone "título", cambiaríamos "mainframe" por el nombre que deseamos)

Aceptamos. Ahora, comprueba que a la izquierda aparece una división nueva, con una zona en blanco.

En realidad, se ha creado un nuevo documento que contiene 2 marcos, el izquierdo y el que se conoce como principal (main), que contiene la página que estaba abierta (o sea, la "principal", la de la derecha).

En la parte inferior, a la derecha, tenemos un "mapa" , con los 2 marcos que estamos usando ahora. Puedes cambiar de una a otra, pulsando en la zona deseada.

Ahora, comprueba que en la parte inferior y a la izquierda, podemos cambiar las propiedades del borde del marco seleccionado (que forma parte de algo llamado "frameset", conjunto de marcos).

En general, cuando un documento se divide en 2 marcos y uno de ellos contiene el menú, es preferible que el tamaño del menú lo dejemos en píxeles (o sea, fijo) y la otra parte será "relativa" (proporcional al tamaño disponible).

Podemos cambiar el tamaño de los marcos (las divisiones, para que nos entendamos), moviendo "manualmente" esos límites, como haríamos con una tabla.

En la parte inferior, ha cambiado el "mapa" , reflejando ese cambio. Compruébalo.

Para establecer otras propiedades diferentes de los marcos, podemos utilizar el panel "Marcos", buscándolo en el menú "ventana" (o pulsando "mayúsc" y F2).

Recuerda que en "origen", podemos especificar "qué archivo debe figurar". Por tanto, a la izquierda, ten listo tu menú. Y a la derecha, la parte "principal", donde figure la información genérica (que luego cambiará, según lo que vayamos eligiendo en el menú de la izquierda).

Justo en esa zona, la opción "Desplaz.", nos sirve para indicar si aparecerán las barras de desplazamiento, cuando no pueda visualizarse completamente.

(vamos, que si quieres que salgan barras de "subir y bajar", aunque la página no las necesite y además, evitas que la persona que vea nuestra página cambie el tamaño del marco)

Si la opción "mismo tamaño" está activada, indica que los usuarios no podrán variar las medidas del marco desde el navegador.

En estas dos casillas (ancho y alto del margen), especificamos la separación que habrá entre el contenido del marco y sus bordes "izquierdo-derecho" y "superior-inferior"). Prueba con diferentes valores y observa el cambio que se ha producido.

En "bordes", como podrás imaginar, elegiremos si aparecerá o no una línea separando cada marco, para poder apreciar mejor el espacio disponible. Puedes elegir entre "predeterminado" (o sea, que decida DW), "sí" o "no" (todo bien clarito).

Si usas la opción de "bordes", podrás elegir también el color. Compruébalo.

Si quieres un tono concreto, busca en google "código color html" y en la primera página que aparezca, puedes elegir otros tonos y copiar ese código alfanumérico (letras y números), directamente en la casilla de "color de borde".

La gran ventaja de trabajar con marcos, es que podemos editar los archivos que veremos en cada marco sin mayor problema (es cómodo, rápido y relativamente sencillo).


Ahora, dentro del menú que hemos situado en la parte izquierda, podemos especificar "dónde" ha de verse esa información (en la parte derecha -marco principal- o en una nueva ventana, por ejemplo).

Como hemos probado en clase, "Destino", es para elegir de qué manera se mostrará esa información. "Mainframe" nos enseñará el contenido de esa otra página web (la que elegimos hace un momento en el menú izquierdo), en la parte derecha de la pantalla. Justo lo que queríamos!

Tenemos que hacer lo mismo con cada enlace (es obvio). Cuando quieras, guarda el proyecto y pulsa "F12", para ir viendo que tal queda antes de subirlo a Internet.

En la ventana "marcos" (o sea, menú "Ventana" y luego "Marcos") , selecciona el contorno externo (para marcar todo el conjunto) y guárdalo con la opción "Archivo - Guardar conjunto de marcos como....". De esa forma, podrás aprovechar tu trabajo para cualquier otra página web que vayas haciendo en el futuro.

Lo habitual es  como vengo recordando últimamente, el poner un nombre "básico" como puede ser index.html  .  Cuando subamos el proyecto de página web que estamos haciendo a Internet, veremos que es la primera página que se cargará siempre que alguien nos visite.

(Recuerda: las fotos y otros elementos, si no están en la misma carpeta de nuestra página web, DW te pedirá que las guardes -basta con aceptar ese proceso, no hay que hacer nada más-)