Los frames sirven para colocar la diagramación de una página web. En el siguiente ejercicio utilizaremos 4 frames.
Para comenzar, se debe realizar una previa maquinación de la página. Usaremos 4 divisiones de las cuales una será el cabezal, otra contendrá los botones, otra tendrá el contenido, y por ultimo el pie de pagina.
El tamaño completo de la pagina será de 800x600. La maquetación será la siguiente:
En dreamweaver, abrimos una nueva página, en site; new site, en la pestaña de avanzado ponemos el nombre del sitio y lo dirigimos a la carpeta raíz.
Una vez creado la pagina html, se abrira automaticamente la carpeta de “files” con todos los elementos que estan dentro de la carpeta raíz.
Esta vez vamos a trabajar en modo diseño, abrimos el panel de layout, aqui se estructura la diagramación de la pagina, y se insertan los frames, tambien se pueden insertar en window, insert, frame..
La diagramacion de una pagina siempre se maneja del lado izquierdo superior al derecho inferior. Al elegir los frames, se despliega un menu en el cual elegimos el “top frame” ponemos el titulo y listo, tenemos nuestro primer frame.
Necesitamos dividir la parte de abajo en 2, para esto, debemos seleccionarlo y le insertamos un nuevo frame, en este caso, “left frame”, otra forma, es abriendo la ventana de frames, en donde se ve una pequeña maqueta de la pagina.
Una vez armados los frames, nos dirigimos al icono de las imagenes que eta en la barra de common, y le damos en exportar fireworks html, o bien, ir al menu, insert, image objects, y ahi esta el icono de fireworks html.
Una vez que abrimos las imagenes, elegimos el archivo htm previamente creado en fireworks, que corresponda al frame creado en html. Salvamos cada uno de los frames. El conjunto de todos los frames, se guarda como frameset, este lo guardamos como index. Cuyos frames se encuentran previamente guardados.
En page properties, se puede cambiar el color de fondo de cada uno de los frames. Mientras tanto, abrimos 3 nuevas paginas en fireworks, con las medidas del main frame, es decir, 600x400, y exportamos los 3 documentos como htm. Estos seran los contenidos de los botones.
En dreamweaber, seleccionamos el boton, uno, y en las propiedades, cargamos la opcion de link, y elegimos la pagina de contenido uno, la forma mas segura es tomando el pointfile y arrastrandolo al contenido de file. Luego, en el target debemos definir que queremos que carge en el main frame. Podemos ir pubicando en el boton con el mundo, para ir viendo como va quedando la página, y verificar que no haya ningun error.
Para poder ajustar los cuadros de los frames con los del contenido, vamos a modify, y en las propiedades de la pagina le ponemos cero a todas las dimensiones del sitio, asi se ajustaran.
Solo faltaria ajustar las medidas de los frames, subire esa informacion la proxima clase, ya que ahorita no la tengo.
No hay comentarios:
Publicar un comentario