PARTES DE LA VENTANA PRINCIPAL DE FRONT PAGE

BARRA DE TITULO

REA O LUGAR DE TRABAJOBARRA DE FORMATOBARRA DE HERRAMIENTASESBARRA DE MENUS

PESTAA DE PGINAS

MODOS DE EDICION

BARRA DE DIBUJO

BARRA DE TAREAS

MODULO DE FRONT PAGE

El programa de Front Page se asemeja bastante al programa de Word con respecto a las caractersticas de la ventana principal, en este mdulo hablaremos de los diferentes temas que se deben de trabajar y encontrar en una pgina web tales como:

1. MODOS DE EDICIN DE UNA PGINA: Se encuentran en la parte baja de la pgina y son:1) Diseo.- Nos permite editar la Web de forma visual.2) Dividir.- Nos permite ver el diseo de la pgina y su cdigo asociado.3) Cdigo.- Podemos editar el cdigo en HTML, opcin slo para expertos.4) Vista Previa.- Veremos nuestra pgina como la veramos desde un navegador, pues slo nos permite visualizar un borrador de cmo ser la pgina Web y no podemos realizar ninguna modificacin sobre la pgina.

2. FORMATO DE TEXTO: Front page tiene una barra de formato en las cuales se pueden cambiar el aspecto de los textos que incluye nuestra pgina web, tambin se puede dar un aspecto diferente al texto utilizando el conocido WORD ART, el cual puede realzar y mejorar el aspecto de nuestra pgina web.

Introducir Listas y Vietas:Para introducir una lista, tan slo hemos de pulsar sobre el botn lista numerada o lista de vieta, segn el tipo de lista que queramos, e ir pulsando la tecla Intro a medida que rellenemos la lista o vieta.

3. INSERTAR IMGENES (ANIMADAS Y ESTTICAS): Una pgina web necesariamente tiene que tener una imagen ya sean animadas (gifs animados) o estticas (sin movimiento), las cuales realzan y dan un aspecto atractivo a la pgina web, logrando llamar la atencin por parte de los usuarios.

Formatos de Imgenes: Una Web est compuesta por mucho ms que simple texto. Un sitio Web se disea para ser grfico, en el cual vamos a aadir imgenes tanto estticas como dinmicas. Podemos aadir imgenes prediseadas de Front Page, imgenes que tengamos guardadas en el disco duro o imgenes de Internet.Las imgenes deben estar en formato GIF o JPEG para poder ser visualizadas por la mayora de los navegadores.

1) Formato JPG JPEG.-Apropiado para imgenes complejas y para fotografa. JPEG comprime y destruye parte de la informacin de la imagen, no admite transparencias.

2) Formato GIF.- Apropiado para logotipos y est comprimida de forma que no pierde definicin. Admite la propiedad de transparencia, que permite que las imgenes compartan el mismo color de fondo de la pgina. Igualmente se pueden crear los GIFS animados como sucesin de diferentes imgenes.

4. FONDOS EN FRONT PAGE: Front Page nos proporciona diferentes opciones y alternativas para insertar fondos a nuestra pgina web como fondos de color, imgenes y temas.

Pasos para Insertar Fondos:1) Hacer clic sobre el men FORMATO y elegir la opcin FONDO

2) Nos muestra la siguiente ventana:

2

1

3) Como se puede observar aqu se eligen dos opciones de fondo: Fondo de Colores.- Aqu se elige el color entero que quieres de fondo en tu pgina Web.

Imagen de Fondo.- Aqu se puede elegir una imagen como fondo en tu pgina Web de cualquier unidad de almacenamiento a travs del botn

En este cuadro se puede ver lasdiferentes imgenes que puedenexistir en alguna unidad de almacenamiento.

5. TEMAS EN FRONT PAGE: Para conseguir un aspecto ms atractivo de la pgina Web o de todas las pginas Web de un sitio, podemos aplicar TEMAS.Un TEMA es una combinacin de colores, tipos de letras, separadores, etc. que guardan un mismo estilo y tienen una cierta concordancia y una ambientacin comn.

Pasos para Insertar Fondos:1) Clic en el men Formato.2) Elegir la opcin Tema, aparecer una lista de diversos Temas al lado derecho de la pgina.3) Para elegir el Tema que ms nos agrade simplemente hacemos clic sobre sta.

NOTA: Si deseamos cambiar a otro tipo de fondo ya sea de colores o imgenes; primero tenemos que desactivar el Tema elegido mediante la opcin SIN TEMA.

6. TABLAS EN FRONT PAGE: Lo primero que vamos a hacer es activar la barra de men de Tabla; elegir la opcin Insertar, Tabla

Nos muestra el siguiente cuadro:

Donde se puede observar todas las opciones que estn disponibles y la manera de usar es ms cmoda y rpida.

Formato de Celdas.- Dar formato a la tabla la hace ms atractiva a la vista. Adems, podemos dar formato a determinadas celdas cuyo contenido queramos destacar.

1st Situamos el cursor sobre la celda elegida o marcamos las celdas a las que deseamos cambiar el formato.

2nd A travs del Autoformato de Tablas; nos ubicamos en cualquier lugar de la tabla, luego en el men TABLA elegir la opcin Autoformato de celdas

3rd Se puede elegir el tipo de Autoforma que ms te agrade.

7. HIPERVNCULOS EN FRONT PAGE: Un hipervnculo es una conexin de una pgina a otro destino como por ejemplo, otra pgina Web o una ubicacin diferente en la misma pgina, tambin puede ser una imagen, una direccin de correo electrnico, un archivo, etc.

Pasos para insertar Hipervnculos:1. Ubicarse en el lugar o seleccionar el texto en donde se desea insertar el hipervnculo.2. Hacer clic sobre el men INSERTAR o clic derecho, nos muestran los siguientes cuadros:

MENU INSERTAR CLIC DERECHO

3. Se escribe un nombre o texto al hipervnculoHacemos clic sobre la opcin Hipervnculo y nos muestra el cuadro de Insertar Hipervnculo:

Se ubica el nombre de un archivo o pgina Web

4. Una vez que hayamos dado un nombre al hipervnculo y ubicado el archivo al cual deseamos hipervincular, hacer clic sobre el botn ACEPTAR, el texto o imagen cambia de color y aparece subrayada.Anclas o Marcadores.- Es una ubicacin o conjunto de caracteres que se ha marcado en una pgina. Un Ancla o Marcador es una seal invisible que se deja en ciertas partes de una pgina Web para acceder directamente a esas partes.

8. ELEMENTOS INTERACTIVOS Y MULTIMEDIA.- Una pgina Web puede tener distintos tipos de elementos multimedia: Elemento Interactivo.- Es un elemento que puede cambiar dependiendo de cmo acte el usuario. Elemento Multimedia.- Un elemento multimedia puede ser un sonido, una cancin, una animacin, un video, etc.Ambos tipos de elementos pueden darle vida a una Web, pero utilizar en exceso esta clase de elementos har que la carga de nuestra Web sea lenta y engorrosa, por lo que los visitantes podran perder el inters.

9. BOTONES DE DESPLAZAMIENTO: Estos son elementos interactivos y vamos a ver cmo crear algunos botones bsicos que son muy usados en la mayora de las pginas Web; las cuales se pueden crear de dos maneras distintas:

1st Haciendo clic sobre el Men INSERTAR, la opcin Componente Web, clic sobre la opcin Botn Interactivo y hacer clic en el botn Finalizar.

Nos mostrar el siguiente recuadro de Botones Interactivos:

En este recuadro podemos cambiar la fuente y el tipo de la imagen del botn. FUENTEIMAGEN

2nd Haciendo clic sobre el Men INSERTAR, clic en la opcin Botn Interactivo,

Aqu tambin nos mostrar el recuadro de Botones Interactivos

Estos son ejemplos de los Botones Interactivos:

10. EL HTML DINAMICO: Se refiere al uso de JavaScript, Hojas de Estilo en Cascada (CSS) y tecnologa de navegador para hacer pginas ms vibrantes y activas. Para aadir efectos DHTML debemos mostrar la barra de herramientas especfica:1. Clic en el Men Ver.2. Clic en la opcin Barra de Herramientas, Efectos DHTML.

3. Nos muestra el siguiente recuadro, con las siguientes opciones:

4. El efecto HTML se visualizar en la Vista Previa de la pgina Web, de acuerdo a las opciones que hayamos elegido en la Barra de Efectos DHTML.

Podemos aadir efectos tanto a textos como a imgenes:

Texto Animado.- Siga los pasos para insertar un texto animado:Pasos:1. Seleccionar el texto que se quiere animar.2. En la barra de Efectos DHTML podemos elegir entre cuatro alternativas: Clic: hace que la animacin ocurra cuando se haga clic en el texto. Doble Clic: la animacin ocurrir tras un doble clic en el texto. Pasar el mouse: la animacin ocurrir cuando el ratn pasa por el texto. Carga de pgina: la animacin se producir cuando se carga la pgina.3. Elegimos entre dos opciones: Volar hacia fuera (el texto se mover de la forma que indiquemos) o Formato (cambia la fuente, tamao, color, relleno, del texto).

Imgenes Animadas.- Podemos hacer que una imagen vuele, que su borde cambie de estilo o incluso que se cambie la imagen al situar el ratn encima de ella. Pasos:1. Seleccionamos la imagen que se quiere animar.2. En la Barra de Efectos DHTML seleccionamos las mismas alternativas que en el texto (clic, doble clic, pasar el mouse y carga de pagina), aunque con posibilidades diferentes.3. Por ejemplo: Podemos hacer que al situar el ratn sobre una imagen, esta cambie a otra imagen.Para ello insertamos una imagen, la seleccionamos y en la Barra de Efectos DHTML escogemos Pasar el mouse, Aplicar Intercambiar imgenes y seleccionamos la imagen que deseamos que aparezca. 11. AADIR MUSICA DE FONDO A LA PGINA: Esto puede aportar cierta personalidad a nuestra pgina, sin embrago puede llegar a ser un poco molesto orla cada vez que un visitante la vea. Por lo tanto podemos configurar la meloda para que suene una, varias o de forma indefinida.

PASOS:1. Hacer un clic derecho en cualquier parte de la pgina Web.2. Hacemos clic en Propiedades de Pgina.3. En el cuadro que nos muestra clic en la ficha General, si no est seleccionada y 4. Buscamos el apartado Sonido de Fondo5. Hacemos clic en Ubicacin y escribimos el nombre de la meloda o sino clic sobre el botn Examinar 6. En Bucle, podemos elegir el nmero de veces que se repetir la meloda.

NOTA: Recuerda que para insertar msica sta debe de estar en uno de estos formatos: wav, midi, au, real audio o aiff ya que algunos de estos formatos reproducen msica con fidelidad y otros ocupan poco espacio.

En este recuadro podemos buscar el archivo correcto.

12. AADIR UN VIDEO A LA PAGINA: Insertar un video es muy sencillo, tan slo hemos de aplicar los siguientes pasos:1. Hacer clic en el lugar de la Web dnde queramos poner el video.2. Hacer clic en el Men INSERTAR.3. Despus en la opcin Imagen y finalmente en Video.

NOTA: Recuerda que para insertar video stas deben encontrase en los siguientes formatos: avi, asf, ram o ra, ya que es un estndar de Windows, y no requiere de ningn componente extra para ser producido.

Por defecto, al insertar un video Front Page nos mostrar la primera imagen del video.

Espero que este mdulo te haya servido para realizar una bonita pgina WebGRACIAS!