INTRODUCCIÓN   

FrontPage es un editor visual de páginas Web de fácil manejo y que nos permitirá crear y modificar nuestras páginas sin necesidad de saber programación y de una forma intuitiva. Es muy similar a un procesador de texto (Word, por ejemplo), y si echamos un vistazo a su pantalla principal, veremos que tiene muchas de las opciones y botones de cualquier procesador de textos.

   Este curso va a abordar básicamente las herramientas para crear y modificar páginas web, pasando muy por encima de operaciones básicas como cambiar el tipo de letra, convertir un texto en negrita, grabar un documento, etc, que se supone que ya conocemos de otros programas. Veremos mapas de imagen, formularios, hojas de estilo, tablas, etc.

   Al iniciar FrontPage, observamos a la izquierda de la pantalla la ventana de Vistas. Estos iconos corresponden a formas distintas de ver y gestionar nuestros proyectos. Si esta ventana no está activada, puedes hacerlo desde el menú Ver - Barra de vistas.

- Accede a la barra de vistas si es que no está en pantalla.

   En principio, el icono Página es el que está activado. Con esto, vemos en la parte derecha de la pantalla el documento sobre el que estamos trabajando.

- Pulsa repetidamente sobre los iconos  Carpetas, Informes, Exploración, Hipervínculos y Tareas. A continuación te explicamos la función de cada uno de ellos:

   Carpetas: Podemos observar las carpetas, subcarpetas y nombre de los archivos con los que estamos trabajando, o que forman parte del proyecto.

   Informes: Esta vista sirve para analizar el web. Por ejemplo, podemos ver una lista de imágenes, enlaces, archivos que no tienen vínculo con otras páginas, páginas lentas, etc.

   Exploración: Similar al icono de Carpetas, nos servirá para observar la estructura del proyecto web. Podemos crear una jerarquía de carpetas para organizar las páginas.

   Hipervínculos: Aquí observamos cuantos hipervínculos hay y dónde están, además de comprobar si son correctos.

   Tareas: Podemos apuntar desde el menú Edición - Tareas diferentes apuntes personales sobre nuestro trabajo.

- Accede al menú Ver - Página

EDICIÓN DE PÁGINAS CON FRONT PAGE

La ventana de trabajo de Front Page permite crear páginas de forma similar a algunos procesadores de texto (como Word), escribiendo directamente el texto, seleccionándolo, convirtiéndolo en negrita, subrayado, cursiva, cambiar el tipo de letra, etc. Si observas la parte inferior, verás que hay tres pestañas:

- Normal: permite trabajar en la ventana de edición

- HTML: accede a la ventana de comandos HMTL que nos permitirá modificar, añadir o borrar etiquetas HTML

- Vista previa: vista previa de cómo quedará el documento una vez publicado en Internet.

A medida que avancemos en el curso, iremos explicando las funciones de los principales comandos, botones y opciones de los menús.

CREAR UNA NUEVA PÁGINA 

Veamos una forma de crear una nueva página web:

- Accede a Archivo - Nuevo - Página

Aparece un cuadro de diálogo desde el cual podemos elegir entre varios modelos, páginas con frames, etc.

- Elige la plantilla Texto a dos columnas

Observa que ha aparecido una tabla con un encabezado y dos columnas. Si prestas atención, verás la distribución del texto, separaciones entre columnas, etc. FrontPage no es un procesador de texto ni un programa de autoedición para crear cualquier tipo de documento, por lo que no podemos crear columnas de texto solas. Muchas de las páginas que ves en internet son realmente tablas a las que se les han quitado los bordes y se ha distribuido su contenido para parecer un diseño profesional.

- Pulsa el botón derecho del mouse en medio de la tabla y accede a la opción Propiedades de la tabla.

- Coloca la opción Bordes / Tamaño en 1 y acepta. Observa los cambios.

- Vuelve a colocar el borde en 0 y acepta.

- Coloca el cursor en la primera celda (Texto del encabezado)

- Pulsa el botón derecho y accede a la opción Propiedades de la celda.

- Accede a la opción Fondo / Color y elige un color claro. Acepta.

- Selecciona la segunda fila completamente. Para ello, coloca el cursor a la izquierda de la fila (fuera de ella) de forma que veas una pequeña flecha negra y pulsa un solo click. Debería seleccionarse por completo.

- Accede al menú Tabla - Combinar celdas. Pulsa un click en cualquier parte de la tabla para ver el resultado.

- Coloca el cursor en medio de la segunda fila (la que acabamos de unir)

- Accede al menú Insertar - Línea horizontal.

- Pulsa una vez la tecla Supr para borrar el retorno manual.

- Pulsa doble click sobre la misma línea horizontal y coloca el Alto en 1. Elige también otro color de la lista inferior. Acepta los cambios.

- Accede a Vista previa para observar el resultado.

Si todo ha transcurrido con normalidad, el resultado puede parecerse a la imagen derecha.

GUARDAR UNA PÁGINA 

La acción de guardar una página es como la de cualquier programa de Windows; sólo hay que acceder a Archivo - Guardar y elegir la carpeta donde deseamos guardarla. El archivo tendrá la extensión HTM o bien HTML.  Hay que tener especial cuidado dónde guardamos las imágenes, así como el enlace a dichas imágenes. Por lo general, en el servidor donde vamos a publicar las imágenes, se suele tener una carpeta especial para ello. Es pues, conveniente, seguir la misma estructura de carpetas de nuestro disco duro para las páginas HTML y las imágenes, que en el servidor. Para ver de qué carpeta está FrotnPage tomando la imagen, puedes pinchar con el botón derecho sobre cualquier imagen y la opción Propiedades de la imagen. 

ASPECTOS BÁSICOS DE EDICIÓN DE PÁGINAS 

Vamos a ver una serie de consejos que nos permitirán mejorar el aspecto general de la página:

Organización del texto.

Como hemos dicho, la forma de trabajar de FrontPage es similar a la de un procesador de texto. Si, por ejemplo, queremos centrar un texto cualquiera, podemos escribirlo primero y después centrarlo, o primero pulsar el botón de centrar y a continuación escribir el texto. En la parte superior, barra de herramientas, disponemos de los tres botones para alinear a la izquierda, centrar, y alinear a la derecha. 

Listas

Se utilizan para organizar texto en forma vertical. Para ello, disponemos de los botones . El primero se utiliza para listas numeradas, y el segundo simplemente listas de puntos. Como siempre, puedes comenzar escribiendo primero el texto y después convertirlo en listas, o bien primero pulsar el botón y después ir escribiendo el texto.

Tipos de letra y colores

A través de los botones podemos adornar o resaltar el texto en negrita, cursiva y subrayado respectivamente. También podemos combinar varias a la vez.

Con podemos cambiar el aspecto y el tamaño respectivamente.

Con  el color de fondo y de la letra respectivamente.

Color de fondo de la página

Pulsa el botón derecho del ratón en medio de la página y desde el menú contextual elige Propiedades de la página. Verás que, en la parte superior, aparecen unas pestañas: accede a la segunda (Fondo). Desde aquí podemos elegir colores para el texto, el fondo, los enlaces a otras páginas, etc.

Añadiendo interactividad

Los conocidos Hiperenlaces o enlaces a otras páginas pueden hacerse de varias formas. Vamos a ver la forma más sencilla:

- Escribimos un texto. Por ejemplo: visita la página de tochtli

- Seleccionamos con el ratón la palabra tochtli (con un doble click podemos hacerlo)

- Pulsamos el botón Hipervínculo

- En la casilla de la URL, escribimos dónde tiene que dirigirse el hiperenlace:  

- En la casilla Marco de destino: elgimos si la nueva dirección debe abrirse en la misma ventana donde estamos, o bien en una nueva.

- Aceptamos y ya tenemos hecho el enlace.

También podemos crear un enlace a otra página de nuestra misma Web que se encuentre ubicada en el servidor. Para ello, simplemente escribiremos el nombre del fichero. Por ejemplo: curso3.htm

 ORGANIZANDO LA INFORMACIÓN 

Evidentemente, en nuestro servidor es necesario organizar la información de los archivos. Imaginemos una Web sencilla que contiene una página de inicio (página Home), tres páginas más, varias fotos y varios ficheros de sonido. Una forma lógica de organizar la información sería:

Desde el mismo FrontPage podemos ver la estructura de archivos, carpetas e hiperenlaces a otras páginas desde el menú Ver - Hipervínculos.

COMPROBANDO EL RESULTADO PREVIO

Desde la pestaña inferior Vista previa podemos acceder a una visualización previa de cómo quedará el documento. No obstante, es conveniente ver una vista previa desde el mismo explorador, ya que a veces podemos encontrarnos con alguna sorpresa de última hora. Utilizaremos para ello el botón