Manual frontpage 2000

Cómo hacer una página web con M. FrontPage 2000.
En este manual se va a explicar cómo hacer una página web con
FrontPage 2000.
Concretamente veremos los siguientes capítulos:
1. Introducción a los conceptos relacionados con el diseño de una página web.
2. Daremos un pequeño repaso al entorno de FrontPage
- El espacio de trabajo.
- La zona de los menú y opciones.
- La zona de carpetas y archivos.
- La zona de vistas
3. Cómo crear y definir un sitio web.
4. Cómo crear una página web dentro de nuestro sitio web.
5. Cómo insertar texto y darle formato.
6. Cómo insertar tablas y darles formato.
7. Cómo insertar imágenes.
8. Cómo crear Enlaces hipervínculos (internos y externos, email)
9. Cómo insertar otros elementos de un sitio web.
Prólogo.
A continuación les presento un manual realizado expresamente para los visitantes de mi
sitio web www.desenredate.com que a base de peticiones han logrado que arrancase
FrontPage y empezara a redactar estas líneas. Con este manual sólo pretendo dar unos
pasos guiados con FrontPage para conseguir que personas inexpertas en el ámbito del
desarrollo web logren hacerse su propia página web.
El manual consiste en un viaje por FrontPage a través del cual se descubrirán los aspectos
más básicos e imprescindible para hacer una página web sencilla y funcional. Durante el
manual me he basado en un ejemplo que he ido utilizando en todos y cada uno de los
capítulos de forma que, al finalizar el manual, se obtenga una página web completa.
Este manual que está redactado y elaborado por Sebastián García-V.S no tiene copyright ni
ningún tipo de derechos de autor. Su distribución es libre siempre y cuando no se altere su
contenido sin el permiso del autor.
Esta obra está disponible en el sitio web www.desenredate.com
Agradecimientos a:
A todos los visitantes de www.desenredate.com
A todo aquel, que después de leer este manual, me mande una opinión, una
crítica o sugerencia sobre el manual.
Sebas G-V.S
Email: [editor@desenredate.com ]
Sitio web: [http://www.desenredate.com]
Desde alguna IP de Internet, hoy lunes 18 de Agosto de 2004.
Manual de FrontPage 2000. Versión 1.3 Agosto’2004.
www.desenredate.com 1 de 28

1. Introducción a los conceptos básicos relacionados con el diseño
de una página web.
A continuación se van a comentar unos pequeños conceptos fundamentales para el
desarrollo de un sitio web.
Página web:
Documento de un sitio Web escrito en el lenguaje HTML
Sitio web:
Página principal y sus otras páginas, gráficos, documentos, multimedia y otros
archivos asociados que se almacenan en un servidor Web o en el disco duro de
un equipo.
HTML:
(Lenguaje de marcado de hipertexto) Lenguaje estándar de marcas empleado
para documentos del World Wide Web.
Editor web:
Programa utilizado para crear páginas web sin la necesidad de tener que
aprender el lenguaje. Ejemplos: M. FrontPage 2000 y Macromedia Dreamweaver.
Servidor:
Máquina conectada a Internet que –entre otros servicios- ofrece albergue para
páginas web haciendo que estén accesibles desde cualquier punto de Internet.
Dirección URL:
(Universal Resource Location / Localizador de recursos universal) Cadena que
proporciona la dirección de Internet de un sitio Web o un recurso del World Wide
Web, junto con el protocolo mediante el cual se tiene acceso al sitio o al recurso.
El tipo más común de dirección URL es http://, que proporciona la dirección de
Internet de una página Web. Otros tipos de dirección URL son gopher://, que
proporciona la dirección de Internet de un directorio Gopher, y ftp://, que
proporciona la ubicación de red de un recurso FTP. Ejemplos:
http://www.desenredate.com , http://www.google.com
Imagen:
Archivo gráfico que se puede insertar en una página Web y mostrar en un explorador
de Web. Existen diferentes formatos: GIF, JPEG, BMP, TIFF, WMF y PNG, entre otros.
servidor Web utilizado para alojar el sitio Web.
Propiedades:
Características de un elemento del Web actual, como el título y la dirección URL de
un Web o el nombre y el valor inicial de un campo de formulario. También puede
especificar propiedades para elementos de página como tablas, gráficos y elementos
activos.
Proveedor de servicios Internet (ISP)
En el ámbito del desarrollo de sitios web, se puede decir que un ISP es un proveedor
de servicios para web. Los diferentes servicios que pueden ofrecer son: conexión a
Internet, registro de dominio, hospedaje de sitios web, servicios de contadores de
servicios, libros de visitas gratuitos, estadísticas para web, entre otros.

2. Daremos un pequeño repaso al entorno de FrontPage
Primero ejecutaremos el programa Microsoft FrontPage y nos aparecerá el siguiente
entorno de trabajo.
Dentro del entorno de trabajo podemos distinguir 4 zonas:
- El espacio de trabajo
- La zona de los menú y opciones.
- La zona de carpetas y archivos (de momento no está visible)
- La zona de vistas (vista normal, vista html y vista previa) en forma de pestañas
El espacio de trabajo será donde trabajemos desarrollando nuestra página web.
Insertaremos texto, tablas, imágenes y otros elementos dándole formato. Este espacio de
trabajo tiene ciertas similitudes con cualquier procesador de textos como Word y Abiword.

En zona de los menú y opciones tenemos a nuestra disposición de una serie de
comandos para poder realizar el sitio web. Al igual que otros programas, esta zona está
compuesta por menús, sub-menús e iconos con los comandos de uso más frecuente.
En Microsoft FrontPage hay 10 Menus.
Opciones del menú de Microsoft FrontPage 2000:
Archivo: Contiene opciones básicas como Abrir, Guardar, Guardar como, Configurar, Salir...
Edición: Comandos más usados: Deshacer y Rehacer, copiar, cortar, pegar...
Ver: Para abrir las diferentes vistas que tiene FrontPage.
Insertar: Para insertar elementos como: imágenes, formularios, botones y otros
componentes.
Formato: Comandos para darle formato a nuestra web así como a los elementos que la
componen.
Herramientas: Contiene corrector ortográfico y otras opciones más avanzadas.
Tabla: Comandos relacionados con las tablas: creación, modificación...
Marcos: Comandos para cuando deseemos crear páginas web con marcos.
Ventana: Para cambiar de ventana de trabajo. (ya que se pueden tener varios documentos
abiertos)
Ayuda: Al igual que otros programas, en este menú está la ayuda, un glosario e información
de Microsoft FrontPage.

La zona de carpetas y archivos
En esta zona (que inicialmente no está visible porque todavía no hemos creado un sitio
web) podremos observar en todo momento un listado de todas las carpetas y archivos que
forman nuestro sitio web. Es importante que cualquier elemento, como por ejemplo las
imágenes, que insertemos en nuestra web estén en esta carpeta y no en otras de nuestro
computador. Por ejemplo, es interesante guardar todas las imágenes que usemos en una
carpeta llamada “imágenes” o “images” (ésta última es creada automáticamente por
FrontPage)
La zona de vistas (vista normal, vista html y vista previa)

La vista Normal es para desarrollar páginas web sin la necesidad de aprender el lenguaje
HTML. Conforme vayamos trabajando en esta vista Normal, en la vista HTML se irá
generando el código HTML de forma automática.
En la Vista HTML también podremos crear o modificar páginas web, pero para ello
deberemos conocer el lenguaje HTML. ( no es imprescindible usar esta pestaña)
La vista previa es como una “presentación preliminar” de nuestro trabajo. Conforme
vayamos trabajando en la vista Normal, podemos hacer con cierta frecuencia visitas a la
vista Previa para ver el resultado de nuestro trabajo.
3. Cómo crear y definir un sitio web.
Una vez nos hayamos familiarizado con el entorno de Microsoft FrontPage procedemos a
definir un sitio web sobre el cual crearemos nuestras páginas.
Microsoft FrontPage nos proporciona varios mecanismos para crear un sitio web. Ofrece
entre otras opciones:
- crear una web a través de plantillas
- crear una web a través de un asistente
- crear una web desde cero (Web vacío)
En este tutorial, por decisión del autor, se considera que la mejor opción para entrar en el
campo del desarrollo web es empezar con la opción “Web en Blanco”, y por ello en este
tutorial se ha elegido dicha opción.
Abrimos el programa FrontPage.
Nos dirigimos al menú ARCHIVO, seleccionamos NUEVO y hacemos clic en WEB.
Y en la ventana que nos aparece seleccionamos: Web Vacío
Si nos fijamos a la derecha de la ventana veremos la ruta de nuestra web que genera por
defecto FrontPage: C:miWeb y será en este lugar donde se vaya a guardar nuestra
web.
y hacemos clic en Aceptar.

A partir de este momento nuestro sitio web queda definido. Hemos creado un sitio web en
blanco y estará ubicado en C:miWeb
Al haber creado el sitio web ha aparecido la “Vista Carpetas” en la que podemos observar
que se han creado ciertas carpetas donde podremos guardar todos los elementos que
compongan nuestro sitio web: páginas web, imágenes, música etc.
(Si la “Vista Carpetas” no se visualizara, tendríamos que activarla en el menú VER >>
Carpetas)
Si nos fijamos, tenemos una carpeta llamada miWeb y dentro de ésta tenemos dos:
_private e images.
En este tutorial vamos a trabajar de la siguiente forma: Las páginas web que formen
nuestro sitio web irán en la carpeta miWeb y las imágenes que utilicemos serán guardadas
en images. La carpeta _private de momento no la utilizaremos.
Por curiosidad, podemos entrar en MiPc >> C: >> y veremos la carpeta de nuestra web.
Para mejorar nuestra práctica con las tareas de Abrir un sitio web, Guardar y Salir
realizaremos los siguientes pasos:
(teniendo todavía abierto el sitio web que acabamos de crear)
1. Menú Archivo >> Guardar (Para guardar los cambios)
2. Menú Archivo >> Salir (Para salir del programa)
A continuación abriremos de nuevo nuestro sitio web para trabajar en él.
Arrancamos FrontPage.
3. Menú Archivo >> Abrir web y en la ventana de exploración buscaremos la carpeta
miWeb que está guardada en C:miWeb

Con los pasos anteriores abrimos el sitio web al completo, con todas sus carpetas y
archivos.
Ya tenemos definido y creado nuestro sitio web, pero... ¡Está vacio!
El siguiente trabajo es crear las páginas web que formarán nuestro sitio web.
Como se ha comentado en el prólogo, en este tutorial se van a seguir los pasos para crear
una página personal con las siguientes páginas:
- Una página principal con información general del autor
- Una página con los enlaces favoritos.
- Una página con las aficiones del autor.
- Una página para fotografías a modo de álbum.
- Una página para un currículum vitae profesional.
Como sistema de navegación (o exploración) de nuestro sitio web utilizaremos un menú que
crearemos en la página principal para permitir desplazarnos por las diferentes páginas.
El paso siguiente es crear nuestra primera página: la página principal.
4. Cómo crear una página web dentro de nuestro sitio web.
Abrimos FrontPage.
Abrimos nuestro sitio web: C:miWeb
Y por defecto se nos abre una página en blanco llamada pagina_nueva_1.htm
Primero y antes de todo, esta página en blanco la vamos a guardar como “index.html”
ya que este es el nombre de archivo con el que se tienen que llamar las páginas
principales de los sitios web.
Esto lo hacemos de la forma siguiente:
Menú Archivo >> Guardar como >> index.html

Una vez hemos guardado la página index.html (la principal) le pondremos un título que
será visible en la ventana del navegador cuando visitemos la web.
Menú Formato >> Fondo >> Pestaña General >> en la casilla Título (que por defecto pone
Pagina nueva 1) escribiremos el título de nuestra página, como por ejemplo:
“Página personal de Sebas García”
Hacemos clic en Aceptar y guardamos los cambios: Menú Archivo >> Guardar
Para ver los cambios, vamos a abrir nuestra web con un navegador que tengamos instalado
en nuestro PC (Internet Explorer, Mozilla, Netscape...).
Esta opción está en el menú Archivo >> Vista previa en el navegador
(De la lista de navegadores que aparezcan, haremos doble clic sobre el que queramos)

Al hacer doble clic sobre el navegador deseado, se abrirá el navegador mostrando la página
web. Aunque la página web está en blanco (porque todavía no hemos insertado nada)
podemos observar como sí que aparece en la parte superior de la ventana el título que
habíamos escrito en los pasos anteriores:
A continuación insertaremos en la página principal texto, imágenes, tablas e hipervínculos.
5. Cómo insertar texto y darle formato.
La forma de insertar texto es idéntica a la de cualquier procesador de texto.
Consiste en situar el cursor en el lugar donde queramos que aparezca el texto, escribir el
texto con el teclado y a continuación le daremos formato.
En nuestra página vamos a insertar un título superior (a modo de encabezado), un párrafo
intermedio de texto, y un texto final (a modo de pie de página).
Teniendo abierta la página index.html colocaremos el cursor en la parte superior de la
ventana y escribiremos una línea:
“Bienvenidos a mi página web personal”
A continuación le daremos formato: Seleccionamos la línea que hemos escrito y haremos
clic en la opción Fuente del menú Formato.

Y en la ventana de Fuente elegiremos:
Fuente: Verdana
Estilo de fuente: Negrita
Tamaño: 5
Color: Azul marino
Guardamos los cambios realizados: menú Archivo >> Guardar
Es importante que cada vez hayamos realizamos varios pasos, guardemos el trabajo.
Para dividir el encabezado del cuerpo central y del pie de página utilizamos las Líneas
horizontales que proporciona FrontPage, que consisten como su nombre indica, en líneas
horizontales útiles para dividir zonas de una web.
Para ello, justo debajo del título que hemos hecho colocaremos el cursor. A continuación en
el menú Insertar haremos clic en Línea Horizontal

A continuación dejaremos una línea en blanco para crear un menú de navegación, pero
como el menú lo realizaremos más hacia delante, de momento sólo dejaremos una línea en
blanco. Para dejar este espacio en blanco, haremos clic en la opción “Salto de línea” del
Menú Insertar.
Después de dejar una línea en blanco, insertaremos otra Línea horizontal: en el menú
Insertar haremos clic en Línea Horizontal
Ya hemos dejado un espacio separado por líneas horizontales para crear el menú que
haremos más adelante (En la sección Insertar hipervínculos de este manual)
Ahora insertaremos un párrafo de presentación para practicar con la inserción de texto y su
formateo.
Posicionaremos el cursor en la siguiente línea después de la última línea horizontal creada y
escribiremos una presentación:
“Hola, mi nombre es Sebastián García y os doy la bienvenida a mi web. Esta web es un
ejemplo práctico del manual que estoy realizando en estos momentos sobre cómo hacer
una página web con el editor FrontPage. Espero que os guste.”
Seleccionamos el texto escrito, y en el menú Formato >> Fuente seleccionamos lo
siguiente:
Fuente: Arial
Estilo de Fuente: cursiva
Tamaño: 3
Color: negro
El siguiente paso será crear el pié de página o despedida. Pero antes deberemos dejar
espacio para insertar posteriormente más contenido en nuestra web, como por ejemplo
alguna foto nuestra.
Para dejar el citado espacio libre, utilizaremos la opción “Salto de Línea” del menú Insertar.
Este paso lo realizaremos 3 veces para dejar suficiente. (Aunque si no dejáramos suficiente,
más tarde este espacio se podría ampliar)

Insertaremos 3 Saltos de Línea.
Una vez hemos dejado el espacio en blanco para fotos y más texto, insertaremos una
nueva línea Horizontal para dividir el pié de página del cuerpo central de la página: en el
menú Insertar haremos clic en Línea Horizontal
A continuación escribiremos el pié de página, como por ejemplo:
“Página personal de Sebas García. © Fecha de creación 04 de Agosto de 2004.”
Le daremos el siguiente formato:
Fuente: verdana
Estilo de Fuente: normal
Tamaña: 1
Color: negro
Después de realizar todos los pasos anteriores, el resultado debería de ser similar a la
imagen que se muestra a continuación: (sin las explicaciones en rojo)

6. Cómo insertar tablas y darles formato.
Las tablas son estructuras de una página web con las que se puede distribuir contenido
ordenadamente.
A continuación crearemos una tabla para insertar una foto y un comentario. Para ello
crearemos una tabla de 1 columna x 2 filas.
Colocaremos el cursor en la línea siguiente debajo del párrafo del Cuerpo de la página.
Y haremos clic (dejándolo presionado y sin soltar) en el Icono “Insertar Tabla”: cuando
aparezcan las cuadrículas, (sin dejar de presionar el icono) seleccionaremos la primera
casilla y a continuación (sin dejar de presionar el icono) bajaremos y seleccionaremos la
casilla de abajo como indica la imagen siguiente:
Icono “Insertar Tabla” cuadrículas

Cuando tengamos seleccionadas las dos casillas dejaremos de presionar el icono, y nos
aparecerá en el espacio de trabajo (donde habíamos dejado el cursor) una tabla de 1
columna x 2 filas (como la que habíamos seleccionado en el icono)
Ahora le daremos formato a la tabla.
Seleccionamos la tabla, y haciendo clic con el botón secundario del ratón (normalmente el
derecho) nos aparecerá un cuadro de opciones:

Hacemos clic en Propiedades de Tabla para que nos aparezca una ventana donde cambiar
las propiedades de la tabla:
En la ventana realizaremos los siguientes cambios:
Alineación: Centro
Especificar Ancho: 50 porcentaje
Margen de celdas: 1
Espaciado entre celdas: 2
Bordes – Tamaño: 0
Y aceptos clic en Aceptar.
Al aplicarle los cambios a la tabla: le hemos reducido el tamaño, la hemos centrado y al
ponerle los bordes igual cero hemos obtenido una tabla “invisible”. De esta forma estamos
usando una tabla como contenedor de información pero que no es visible.
Cuando le ponemos a una tabla los bordes igual a cero (para hacerla invisible) en nuestro
espacio de trabajo (en la página de FrontPage) la veremos con los bordes punteados para
facilitar nuestro trabajo, pero una vez visualicemos la web en un navegador web
comprobaremos que la tabla no es visible.
Otra forma de comprobar que nuestra tabla de “bordes punteados” no se verá en la web es
desplazarnos a la pestaña VISTA HTML ya que esta vista actúa como un navegador web:

Una vez hemos comprobado que nuestra tabla no se verá en el resultado final, podemos
volver al espacio de trabajo en la pestaña Vista NORMAL:
Una vez tenemos la tabla creada, insertaremos una imagen dentro de ella. Para ver cómo
insertar una imagen leeremos el siguiente apartado.
7. Cómo insertar imágenes.
Para insertar una imagen iremos al menú Insertar >> Imagen >> Desde Archivo
Nos aparecerá una ventana donde tendremos que localizar la imagen que deseemos
insertar. Si anteriormente la habíamos guardado en el directorio de nuestra web (en
“images”) haremos doble clic sobre dicha carpeta para ver qué imágenes dispone. Cuando
encontremos la que deseemos la seleccionamos y hacemos clic en Aceptar.

Si por el contrario, la imagen no la habíamos guardado en el directorio de nuestra web,
tendremos que explorar por nuestro computador hasta encontrar la imagen deseada. Ver la
imagen siguiente:
Cuando hayamos insertado una imagen, guardaremos los cambios: Archivo >> Guardar
Como se ha comentado en líneas anteriores, cualquier elemento que insertemos en nuestras
páginas web deberán estar guardados dentro de la carpeta de nuestro sitio web, en nuestro
caso, se llamaba: C:miWeb
Es muy recomendable, que todas las imágenes que utilicemos en nuestras páginas web
estén guardadas en una carpeta específica para ellas.
Cuando en el segundo apartado de este manual definimos nuestro sitio web, FrontPage nos
creó automáticamente una carpeta llamada “images” y será aquí donde deberemos guardar
todas las imágenes que vayamos a utilizar.
Observando desde el explorador de Windows Explorando desde la “vista carpetas” de
FrontPage

FrontPage se asegura de que las imágenes que utilicemos están guardadas en la carpeta de
nuestra web de dos formas dependiendo de dónde esté guardada nuestra imagen:
La imagen que vamos a insertar está guardada en el directorio de nuestra web
C:miWeb ó C:miWebimages
En este caso FrontPage actúa con total normalidad al darse cuenta de que la imagen
que se utiliza ya está dentro del directorio de la web, por lo tanto no hay ningún
problema.
La imagen que vamos a insertar NO está guardada en el directorio de nuestra web,
es decir, el archivo está guardado en otro directorio como por ejemplo: el escritorio,
Mis Documentos, un disquete.. etc.
En este caso, cuando insertemos una imagen que, por ejemplo, esté en el escritorio,
una unidad de disquete o en Mis Documentos FrontPage nos alertará de que esa
imagen no está en el directorio de nuestra web, y por lo tanto nos da unas opciones
para que le indiquemos en qué carpeta (de las que hay dentro de nuestro sitio web)
deseamos que la guarde. Quiero remarcar que esta pregunta no nos la hará en el
momento de insertar la imagen, sino que FrontPage la hace cuando guardemos (Menú
Archivo >> Guardar) la página donde insertemos las imágenes
Nos mostrará la siguiente ventana, en la que deberemos indicarle que la guardar en la
carpeta “images”:
8. Cómo crear hipervínculos (enlaces internos, externos y mailto)
Al hipervínculo se le suele llamar “enlace web” o en su versión anglosajona “link”.
Un hipervínculo es una conexión de una página a otro destino como, por ejemplo, otra
página o una ubicación diferente en la misma página.
El destino es con frecuencia otra página Web, pero también puede ser una imagen, una
dirección de correo electrónico, un archivo (como por ejemplo, un archivo multimedia o un
documento de Microsoft Office) o un programa. Un hipervínculo puede ser texto o una
imagen.

4 tipos de hipervínculos:
Enlaces internos: Este tipo de enlaces conducen a una página web dentro del mismo sitio
web donde está el propio enlace.
Enlaces externos: Este tipo de enlaces nos conducen a páginas web de sitios web ajenos al
nuestro.
Enlaces a archivos: Son enlaces que conducen a archivos que no son páginas web. Con
este tipo de enlaces podemos permitir que el visitante de nuestra web se descargue
archivos disponibles en nuestra web como por ejemplo archivos.zip , archivos.mp3 etc.
Enlaces mailto: Al hacer clic sobre este tipo de archivos, al visitante se le abrirá una
ventana con la cual desde su programa de correo podrá enviarnos un correo electrónico a la
cuenta de correo que nosotros le especifiquemos.
A continuación crearemos una página web especial para nuestros enlaces preferidos.
Para ello, iremos al menú Archivo >> Nuevo >> Página; y en la ventana que se nos abre,
en la pestaña General seleccionaremos “Página normal” y haremos clic en Aceptar.
Antes de hacer nada sobre esta nueva página, la vamos a guardar dándole un nombre:
Menú Archivo >> Guardar como : y en la casilla pondremos: enlaces.html
Una vez guardada la página en nuestro directorio, le pondremos un título y un titular de
página.
Para el título haremos lo siguiente:
Menú Formato >> Fondo >> Pestaña General >> en la casilla Título (que por defecto pone
Pagina nueva 2) escribiremos el título de nuestra página, como por ejemplo: “Mis enlaces
preferidos”
A continuación insertaremos un titular de página. Para ello utilizaremos la herramienta
texto:
Teniendo abierta la página enlaces.html abierta, colocaremos el cursor en la parte superior
de la ventana y escribiremos una línea:

“Estos son mis enlaces preferidos” y le daremos formato:
Fuente: verdana
Estilo de Fuente: normal
Tamaño: 5
A continuación insertaremos una línea horizontal: en el menú Insertar haremos clic en
Línea Horizontal.
Además insertaremos un “Salto de línea” para separar los contenidos: Menú Insertar >>
Salto de línea >> Salto de línea normal.
A continuación insertaremos una tabla para insertar los enlaces:
Crearemos una tabla de 6 columnas x 3 filas. (Para 18 enlaces)
A continuación le daremos formato:
Seleccionamos la tabla que hemos creado y hacemos clic con el
botón secundario del ratón (normalmente el derecho), en la
ventana que nos aparece hacemos clic en el comando
“Propiedades de Tabla”:
En este caso elegimos:
Especificar ancho: 100 (porcentaje)
Margen de celdas: 0
Espacio entre celdas: 0
Bordes Tamaño: 3
Colores=> Borde claro: gris oscuro, Borde Oscuro: gris claro
Hacemos clic en Aceptar y guardamos los cambios: menú Archivo >> Guardar.

o Ahora insertaremos enlaces externos en la tabla:
Ponemos el cursor dentro de la primera celda de la tabla y escribimos el texto que
contendrá el enlace, por ejemplo: “Google” a continuación seleccionamos el texto que
hemos escrito y hacemos clic en la opción Hipervínculo del menú Insertar. Nos aparecerá la
siguiente ventana:
En el cuadro de diálogo “Dirección URL” escribiremos la dirección de la web a la que
queremos enlazar, en este caso sería: http://www.google.es
En la opción “Marco de destino” seleccionaremos “Nueva ventana” y haremos clic en
Aceptar. Esto es para que cuando el navegante haga clic en el enlace de Google se le abra
una nueva ventana de navegador con la web de Google y no se salga de nuestra página
personal.
Repetiremos este paso hasta completar todos los enlaces que deseemos.
Guardamos los cambios: menú Archivo >> Guardar
o Ahora insertaremos un enlace interno:
A continuación insertaremos un enlace interno, es decir, a una página de nuestro propio
sitio web. En este caso, en la página enlaces.html insertaremos un enlace para poder
regresar a la página principal index.html
Para ello, pondremos el cursor debajo de la tabla, dejando una línea en blanco (Insertando
un salto de línea normal).
Escribiremos el siguiente texto “Volver a la página principal”
Con formato: Fuente: verdana Estilo: Negrita y Tamaño: 3
Seleccionamos el texto, y en el menú Insertar hacemos clic en Hipervínculo.

Ahora, en lugar de poner la dirección URL, como muestra la siguiente imagen: haremos clic
con el ratón en el icono que representa la página index.html Además, en la opción “Marco
de destino” seleccionaremos: Mismo Marco (Esto es para permitir al visitante de nuestra
web navegar por nuestro sitio web con una sola ventana de navegador web)
A continuación haremos clic en Aceptar y guardamos los cambios realizados (menú Archivo
>> Guardar)
Para comprobar nuestro trabajo, podemos visualizarlo en el navegador: Menú Archivo >>
Vista previa en el explorador ó bien haciendo clic en el icono:
Si se ha realizado los mismos pasos que en este tutorial, el resultado obtenido tendría que
ser similar a esta imagen:

Ahora insertaremos un enlace en la página index.html que apunte a la página enlaces.html.
Los pasos son los mismos que los vistos anteriores. El enlace lo insertaremos en el espacio
que dejamos anteriormente para el menú (recuerdo que era entre las dos líneas
horizontales debajo del titular), y el texto será “Mis enlaces preferidos” con hipervínculo al
documento web enlaces.html tal y como se muestra en la siguiente imagen.

o Hipervínculos a archivos que NO son páginas web.
Para insertar enlaces a archivos que no son páginas web (documentos html) como por
ejemplo ficheros.zip, archivos.mp3 ..., el proceso es idéntico al de crear un enlace interno,
pero en lugar de seleccionar un documento *.html seleccionaremos el fichero que queremos
enlazar. Antes de crear el vínculo deberemos asegurarnos de que el fichero que queremos
enlazar está dentro del directorio web C:miWeb
Ejemplo visual:
o A continuación insertaremos un hipervínculo “Mailto”
Como se comentó anteriormente, al hacer clic sobre un enlace de tipo “mailto” provoca que
se abra una ventana del cliente de correo configurado por el visitante para poder
mandarnos un correo a la dirección de correo-e que nosotros le indiquemos.
Pasos:
En el documento index.html justo debajo de la tabla donde insertamos una imagen, vamos
a escribir el siguiente texto:
“Mándame un email” con el siguiente formato:
Fuente: verdana
Tamaña: 2
Estilo: negrita
Color: Azul
Seleccionamos el texto, y hacemos clic en el comando Hipervínculo del menú Insertar.
Cuando nos aparezca la ventana “crear vínculo” haremos clic en el icono :
(Para localizar este icono ver la siguiente imagen)

Al hacer clic sobre el icono con forma de carta, nos aparecerá una ventana donde
deberemos escribir la dirección de email donde queremos recibir los mensajes que nos
envíen los visitantes de nuestra web.
Una vez la hayamos escrito, haremos clic en Aceptar en esta ventana, y en la otra de “Crear
vínculo”.
Guardamos los cambios: menú Archivo >> Guardar.
En este punto del tutorial, ya sabemos definir un sitio web y crear páginas web dentro de él
con texto, tablas, imágenes e hipervínculos.
El siguiente paso consistirá en crear otras páginas según nuestras necesidades. Al tratarse
de una página personal se podría –por ejemplo- crear una página para hablar de nuestras
aficiones, otra para poner nuestro currículo, otra para poner nuestras fotos personales...
En todas estas páginas se deberá cumplir lo siguiente:
- Todas tendrán un título
- Todas deberán tener un titular en la parte superior de la web
- Todas tendrán un enlace para poder regresar a la página principal
- Se recomienda utilizar Líneas Horizontales para separar secciones
Resultado:

9. Cómo insertar otros elementos de un sitio web.
A continuación veremos cómo insertar otro tipo de elementos a nuestra página web.
o Insertar música de fondo.
El formato recomendado para usar como fondo musical es una página web es el Formato
MIDI. Es decir, utilizaremos archivos musicales con la extensión *.midi
El primer paso es guardar el archivo midi en el directorio de nuestra web C:miWeb. A
continuación nos iremos al menú Formato >> Fondo y en la pestaña “General” nos
fijaremos en la sección que pone “Sonido de fondo”. Haremos clic en Examinar y
buscaremos el archivo deseado.
Si queremos que la música se reproduzca siempre (constantemente) dejaremos marcada la
casilla “Siembre”, de lo contrario le indicaremos el número de veces que queremos que se
reproduzca en la casilla “Bucle”.

o Insertar una fecha automática
Para insertar una fecha y que ésta se actualice constantemente, utilizaremos un script
programado en Javascript. Un script es un fragmento de código que tendremos que insertar
en nuestra página web. Haremos lo siguientes pasos:
IR al menú Insertar >> Avanzadas >> HMTL
Y en la ventana que nos aparezca deberemos copiar el código del javascript, que en este
caso es el siguiente:
<script languaje="JavaScript">
var mydate=new Date()
var year=mydate.getYear()
if (year < 1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
if (daym<10)
daym="0"+daym
var dayarray=new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado")
var montharray=new
Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Novi
embre","Diciembre")
document.write("<small><font color='000080' face='Arial'>"+dayarray[day]+" "+daym+" de
"+montharray[month]+" de "+year+"</font></small>")
</script>
A continuación haga clic en Aceptar.
Para ver la fecha funcionando, deberá abrir la web con un navegador web:
FIN del Manual.
Espero que le haya sido de utilidad.
Espero sus comentarios, críticas, sugerencias en: editor@desenredate.com
Sebas GV.S Lunes, 09 de agosto de 2004. http:www.desenredate.com

Manual frontpage 2000

Más contenido relacionado

La actualidad más candente

Destacado

Similar a Manual frontpage 2000

Último

Manual frontpage 2000