Tutorial de FrontPage

Transcripción

1 Tutorial de FrontPage Con este tutorial vamos a hacer una presentación, utilizando el programa FrontPage, similar a la que se ha elaborado con el programa Neobook. FrontPage 2000 es un programa que se incluye en el paquete Microsoft Office Se trata de un editor de lenguaje HTML. Los trabajos realizados pueden publicarse en Internet. Crearemos distintas páginas a las que llamaremos: PORTADA, ABCD, ABXY,..., tal como se indica en este esquema: PORTADA A B C D A B X Y SÍ NO A D C Y A B D Y SÍ NO SÍ NO A B D C FIN Las letras representan los dibujos que contienen cada página. A:gato, B:cerdo, C:barco, D:pirata, X:cebra e Y:pato.

2 Antes de empezar es conveniente crear una carpeta que podemos llamar FrontPage donde guardaremos todos las páginas que creemos. También es conveniente copiar en ella las carpetas ImagenesFP y SonidosFP que contienen los archivos de imagen y sonido que vamos a necesitar y que se encuentran en el CD del curso. Comenzamos abriendo el programa en Inicio>Programas>Microsoft FrontPage. Sale una página en blanco: Y en Archivo>Guardar como... aparece esta ventana: La guardamos con el nombre de PORTADA y repetimos el proceso para guardar con su nombre correspondiente las distintas páginas que aparecen en el esquema anterior.

3 Volvemos a abrir la página PORTADA y vamos a poner un color de fondo. En el menú Formato>Fondo y en la ventana que aparece se elige la pestaña Fondo y en Colores Fondo el color que deseemos. Ahora se elige fuente y tamaño adecuados, color que contraste con el fondo y se escribe centrado el título Un mundo mágico (Ver resultados en página 4). Bajamos una línea, centramos e insertaremos la imagen bruja de la carpeta ImagenesFP. Para ello Insertar>Imagen>Desde archivo..., en la ventana que aparece se busca la imagen que queremos insertar, se selecciona y Aceptar. Volvemos a bajar una línea y con una letra más pequeña escribimos ENTRAR. En esta palabra pondremos más adelante un enlace o hipervínculo que nos permita pasar a la página siguiente. El resultado en el editor de FrontPage será más o menos el de la primera imagen de la página siguiente de este documento. Y la segunda imagen se corresponderá a la página tal y como se verá con el navegador Internet Explorer Para ver la imagen en el navegador deberemos picar dos veces seguidas sobre el icono PORTADA que se supone guardado en la carpeta FrontPage. Es conveniente que cada vez que hagamos alguna modificación en la página se guarde para evitar perdidas irrecuperables del trabajo realizado. Hemos de tener presente que si ya tenemos abierto el navegador en la página en la que se trabaja, para poder ver cualquier cambio hecho en FrontPage debemos hacer dos cosas: 1º Guardar los cambios en FrontPage. 2º Actualizar el navegador en Ver>Actualizar.

4 Aspecto en el editor FrontPage 2000: Aspecto en el navegador Internet Explorer:

5 Sólo falta añadir un sonido que se oiga nada más abrirse la página. Para ello en el menú Insertar>Fondo y en la ventana que aparece se elige la pestaña General. En Examinar... se busca en la carpeta Sonidos FP el que lleva por nombre truco y se selecciona. Por ultimo se desactiva la casilla Siempre y se pone 1 en Bucle y Aceptar. Para escuchar el sonido vamos al navegador. Pero sin olvidarse antes de guardar los cambios en FrontPage y actualizar el navegador si ya estaba abierto en la página PORTADA. FrontPage permite hacer algunas modificaciones a las imágenes. Veamos algunas. Entramos en el programa y abrimos PORTADA, seleccionamos la imagen haciendo clic encima de ella y aparecerán los puntos de selección. Arrastrando estos puntos con el cursor se puede cambiar el tamaño de la imagen hasta conseguir el adecuado. Se habrá observado que cuando la imagen está seleccionada aparece, en la parte inferior de la pantalla, la Barra de Dibujo que contiene varios botones. Este botón, cuando se elige, permite establecer un color transparente en la imagen que tengamos seleccionada. El formato de la imagen debe ser de tipo gif, como todas las imágenes contenidas en la carpeta ImagenesFP. Si el formato de la imagen fuera jpg, al seleccionar el botón de establecer color transparente, aparecería una ventana advirtiendo que la imagen va a cambiar al formato gif y en consecuencia podría haber una posible reducción de colores y aumento de tamaño de dicha imagen. En nuestra imagen bruja vamos a hacer transparente el color blanco. Pulsamos en el botón establecer color transparente y después en una zona completamente blanca de la imagen. El efecto resultante es inmediato.

6 El paso siguiente es guardar los cambios con el menú Archivo>Guardar. Pero aparecerá una ventana como ésta: Esto es así porque considera la imagen modificada como una imagen nueva. Es recomendable guardarla en la carpeta ImagenesFP con el botón Cambiar carpeta... Y también darle otro nombre si queremos mantener la imagen original, por ejemplo bruja2. Para esto utilizaremos el botón Cambiar nombre. Y el resultado final en el navegador es éste:

7 Abrimos en FrontPage la página que hemos llamado ABCD. Le ponemos color de fondo (ver página 3). Vamos a colocar las imágenes gata, cerda, barco y pirata. Pero antes insertaremos una tabla de 2x2. Seleccionamos el menú Tabla>Insertar>Tabla... En la ventana que aparece ponemos en Filas: 2, Columnas: 2 y Tamaño del borde: 0. Aceptar y aparece una tabla 2x2 con líneas de punto. Pero en el navegador no se verá por poner tamaño del borde 0. Se pone el cursor en la primera celda y se inserta la imagen gata siguiendo los pasos que se han indicado en la página 3. Y se hace lo mismo en las demás celdas.

8 El resultado, en el navegador, será más o menos éste: Las imágenes son muy grandes. Pueden reducirse de tamaño como se ha indicado en la página 5. Pero nos puede interesar que no aparezcan las letras de los dibujos. Para eso hay que recortarlos. Este botón, cuando se elige, permite recortar la imagen que tengamos seleccionada.

9 Aparece un cuadro de recorte. Se arrastran los identificadores del cuadro para incluir la parte de la imagen que se desea conservar. Y se hace clic de nuevo en Recortar recorte. para quitar la zona exterior al cuadro de El cambio es evidente:

10 Hacemos lo mismo con las demás imágenes. Al guardar los cambios no olvidar Cambiar el nombre y Cambiar la carpeta donde se ubicaran las nuevas imágenes. La vista en el puede ser así. Como las imágenes son grandes y las de abajo no se ven completas, podemos reducirlas en FrontPage hasta encontrar un tamaño adecuado.

11 En la celda del pirata escribimos la palabra SEGUIR e insertamos la imagen adelante. En ella pondremos un enlace o hipervínculo que nos permitirá pasar a la página siguiente. Ahora ponemos un sonido que se oiga al abrirse la página. Para ello en el menú Insertar>Fondo y en la ventana que aparece se elige la pestaña General. En Examinar... se busca en la carpeta Sonidos FP el que lleva por nombre piensa y se selecciona. Por ultimo se desactiva la casilla Siempre y se pone 1 en Bucle y Aceptar. Todo el proceso descrito para realizar la página ABCD hay que repetirlo para las páginas ABXY, ADCY y ABDY. Cada una llevará las imágenes que representan cada letra que forma su nombre como se ha indicado al final de la primera página de este documento. Al insertar las imágenes no hay que olvidar que algunas ya están recortadas y por tanto no deben ser modificadas, excepto el tamaño. En estas tres páginas hay que sustituir la palabra SEGUIR y la imagen adelante por las palabras SÍ y No. En cada palabra se establecerá un enlace que nos llevarán a una de las siguientes páginas A, B, C o D. El sonido de fondo que hay que insertar en cada una es el que lleva por nombre esta. El aspecto de las páginas ABCD, ABXY, ADCY y ABDY es el que sigue a continuación:

12 Página ABCD Página ABXY

13 Página ADCY Página ABDY

14 A continuación las páginas A, B, C y D que contienen la imagen correspondiente a la letra de su nombre y el sonido era. También pondremos abajo a la izquierda la palabra SEGUIR y la imagen adelante que enlazará con la última página FIN. Página A Página B

15 Página C Página D

16 Y solamente queda la página FIN en la que insertaremos el archivo de sonido bruja. Ahora ya están todas las páginas listas para establecer los enlaces. Comenzamos con la página PORTADA. En la palabra ENTRAR pondremos un enlace que al hacer clic nos abra la página ABCD. Para ello abrimos la página PORTADA en FrontPage, seleccionamos la palabra ENTRAR y se elige Insertar>Hipervínculo... o bien este icono de la barra estándar. Aparece una ventana: Hacemos clic en el botón Establecer un hipervínculo a un archivo de su equipo y aparece una nueva ventana.

17 Y en ella elegimos la página ABCD y Aceptar También podemos seleccionar la imagen bruja e insertar un hipervínculo a la página ABCD repitiendo el proceso. Guardamos los cambios realizados y probamos en el navegador su funcionamiento. A continuación, en la página ABCD se selecciona la palabra SEGUIR y la imagen adelante y se establece un hipervínculo a la página ABXY. En la página ABXY en la palabra SÍ se pone un hipervínculo a la página ADCY y en la palabra NO un hipervínculo a la página ABDY. Y así sucesivamente con el resto teniendo en cuenta el esquema de la primera página de este documento. Y comprobareis que... La bruja es fenómena!