Manual frontpage 2000

  • 806 views
Uploaded on

 

More in: Education
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
806
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
12
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. 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 conFrontPage 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 vistas3. 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 misitio web www.desenredate.com que a base de peticiones han logrado que arrancaseFrontPage y empezara a redactar estas líneas. Con este manual sólo pretendo dar unospasos guiados con FrontPage para conseguir que personas inexpertas en el ámbito deldesarrollo 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 aspectosmás básicos e imprescindible para hacer una página web sencilla y funcional. Durante elmanual me he basado en un ejemplo que he ido utilizando en todos y cada uno de loscapí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 niningún tipo de derechos de autor. Su distribución es libre siempre y cuando no se altere sucontenido sin el permiso del autor.Esta obra está disponible en el sitio web www.desenredate.comAgradecimientos a:A todos los visitantes de www.desenredate.comA todo aquel, que después de leer este manual, me mande una opinión, unacrítica o sugerencia sobre el manual.Sebas G-V.SEmail: [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
  • 2. Cómo hacer una página web con M. FrontPage 2000.1. Introducción a los conceptos básicos relacionados con el diseñode una página web.A continuación se van a comentar unos pequeños conceptos fundamentales para eldesarrollo de un sitio web.Página web:Documento de un sitio Web escrito en el lenguaje HTMLSitio web:Página principal y sus otras páginas, gráficos, documentos, multimedia y otrosarchivos asociados que se almacenan en un servidor Web o en el disco duro deun equipo.HTML:(Lenguaje de marcado de hipertexto) Lenguaje estándar de marcas empleadopara documentos del World Wide Web.Editor web:Programa utilizado para crear páginas web sin la necesidad de tener queaprender el lenguaje. Ejemplos: M. FrontPage 2000 y Macromedia Dreamweaver.Servidor:Máquina conectada a Internet que –entre otros servicios- ofrece albergue parapáginas web haciendo que estén accesibles desde cualquier punto de Internet.Dirección URL:(Universal Resource Location / Localizador de recursos universal) Cadena queproporciona la dirección de Internet de un sitio Web o un recurso del World WideWeb, 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 deInternet de una página Web. Otros tipos de dirección URL son gopher://, queproporciona la dirección de Internet de un directorio Gopher, y ftp://, queproporciona la ubicación de red de un recurso FTP. Ejemplos:http://www.desenredate.com , http://www.google.comImagen:Archivo gráfico que se puede insertar en una página Web y mostrar en un exploradorde 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 deun Web o el nombre y el valor inicial de un campo de formulario. También puedeespecificar propiedades para elementos de página como tablas, gráficos y elementosactivos.Proveedor de servicios Internet (ISP)En el ámbito del desarrollo de sitios web, se puede decir que un ISP es un proveedorde servicios para web. Los diferentes servicios que pueden ofrecer son: conexión aInternet, registro de dominio, hospedaje de sitios web, servicios de contadores deservicios, libros de visitas gratuitos, estadísticas para web, entre otros.www.desenredate.com 2 de 28
  • 3. Cómo hacer una página web con M. FrontPage 2000.2. Daremos un pequeño repaso al entorno de FrontPagePrimero ejecutaremos el programa Microsoft FrontPage y nos aparecerá el siguienteentorno 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ñasEl espacio de trabajo será donde trabajemos desarrollando nuestra página web.Insertaremos texto, tablas, imágenes y otros elementos dándole formato. Este espacio detrabajo tiene ciertas similitudes con cualquier procesador de textos como Word y Abiword.www.desenredate.com 3 de 28
  • 4. Cómo hacer una página web con M. FrontPage 2000.En zona de los menú y opciones tenemos a nuestra disposición de una serie decomandos 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 otroscomponentes.Formato: Comandos para darle formato a nuestra web así como a los elementos que lacomponen.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 documentosabiertos)Ayuda: Al igual que otros programas, en este menú está la ayuda, un glosario e informaciónde Microsoft FrontPage.www.desenredate.com 4 de 28
  • 5. Cómo hacer una página web con M. FrontPage 2000.La zona de carpetas y archivosEn esta zona (que inicialmente no está visible porque todavía no hemos creado un sitioweb) podremos observar en todo momento un listado de todas las carpetas y archivos queforman nuestro sitio web. Es importante que cualquier elemento, como por ejemplo lasimágenes, que insertemos en nuestra web estén en esta carpeta y no en otras de nuestrocomputador. Por ejemplo, es interesante guardar todas las imágenes que usemos en unacarpeta llamada “imágenes” o “images” (ésta última es creada automáticamente porFrontPage)La zona de vistas (vista normal, vista html y vista previa)www.desenredate.com 5 de 28
  • 6. Cómo hacer una página web con M. FrontPage 2000.La vista Normal es para desarrollar páginas web sin la necesidad de aprender el lenguajeHTML. 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 ellodeberemos conocer el lenguaje HTML. ( no es imprescindible usar esta pestaña)La vista previa es como una “presentación preliminar” de nuestro trabajo. Conformevayamos trabajando en la vista Normal, podemos hacer con cierta frecuencia visitas a lavista 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 adefinir un sitio web sobre el cual crearemos nuestras páginas.Microsoft FrontPage nos proporciona varios mecanismos para crear un sitio web. Ofreceentre 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 elcampo del desarrollo web es empezar con la opción “Web en Blanco”, y por ello en estetutorial 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íoSi nos fijamos a la derecha de la ventana veremos la ruta de nuestra web que genera pordefecto FrontPage: C:miWeb y será en este lugar donde se vaya a guardar nuestraweb.y hacemos clic en Aceptar.www.desenredate.com 6 de 28
  • 7. Cómo hacer una página web con M. FrontPage 2000.A partir de este momento nuestro sitio web queda definido. Hemos creado un sitio web enblanco y estará ubicado en C:miWebAl haber creado el sitio web ha aparecido la “Vista Carpetas” en la que podemos observarque se han creado ciertas carpetas donde podremos guardar todos los elementos quecompongan 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 formennuestro sitio web irán en la carpeta miWeb y las imágenes que utilicemos serán guardadasen 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 Salirrealizaremos 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 carpetamiWeb que está guardada en C:miWebwww.desenredate.com 7 de 28
  • 8. Cómo hacer una página web con M. FrontPage 2000.Con los pasos anteriores abrimos el sitio web al completo, con todas sus carpetas yarchivos.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 crearuna 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ú quecrearemos 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:miWebY por defecto se nos abre una página en blanco llamada pagina_nueva_1.htmPrimero 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áginasprincipales de los sitios web.Esto lo hacemos de la forma siguiente:Menú Archivo >> Guardar como >> index.htmlwww.desenredate.com 8 de 28
  • 9. Cómo hacer una página web con M. FrontPage 2000.Una vez hemos guardado la página index.html (la principal) le pondremos un título queserá visible en la ventana del navegador cuando visitemos la web.Menú Formato >> Fondo >> Pestaña General >> en la casilla Título (que por defecto ponePagina 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 >> GuardarPara ver los cambios, vamos a abrir nuestra web con un navegador que tengamos instaladoen 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)www.desenredate.com 9 de 28
  • 10. Cómo hacer una página web con M. FrontPage 2000.Al hacer doble clic sobre el navegador deseado, se abrirá el navegador mostrando la páginaweb. 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 quehabí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 eltexto 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árrafointermedio 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 laventana 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 haremosclic en la opción Fuente del menú Formato.www.desenredate.com 10 de 28
  • 11. Cómo hacer una página web con M. FrontPage 2000.Y en la ventana de Fuente elegiremos:Fuente: VerdanaEstilo de fuente: NegritaTamaño: 5Color: Azul marinoGuardamos los cambios realizados: menú Archivo >> GuardarEs 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íneashorizontales que proporciona FrontPage, que consisten como su nombre indica, en líneashorizontales útiles para dividir zonas de una web.Para ello, justo debajo del título que hemos hecho colocaremos el cursor. A continuación enel menú Insertar haremos clic en Línea Horizontalwww.desenredate.com 11 de 28
  • 12. Cómo hacer una página web con M. FrontPage 2000.A continuación dejaremos una línea en blanco para crear un menú de navegación, perocomo el menú lo realizaremos más hacia delante, de momento sólo dejaremos una línea enblanco. Para dejar este espacio en blanco, haremos clic en la opción “Salto de línea” delMenú Insertar.Después de dejar una línea en blanco, insertaremos otra Línea horizontal: en el menúInsertar haremos clic en Línea HorizontalGuardamos los cambios realizados: menú Archivo >> GuardarYa hemos dejado un espacio separado por líneas horizontales para crear el menú queharemos 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 suformateo.Posicionaremos el cursor en la siguiente línea después de la última línea horizontal creada yescribiremos una presentación:“Hola, mi nombre es Sebastián García y os doy la bienvenida a mi web. Esta web es unejemplo práctico del manual que estoy realizando en estos momentos sobre cómo haceruna página web con el editor FrontPage. Espero que os guste.”Seleccionamos el texto escrito, y en el menú Formato >> Fuente seleccionamos losiguiente:Fuente: ArialEstilo de Fuente: cursivaTamaño: 3Color: negroGuardamos los cambios realizados: menú Archivo >> GuardarEl siguiente paso será crear el pié de página o despedida. Pero antes deberemos dejarespacio para insertar posteriormente más contenido en nuestra web, como por ejemploalguna 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)www.desenredate.com 12 de 28
  • 13. Cómo hacer una página web con M. FrontPage 2000.Insertaremos 3 Saltos de Línea.Guardamos los cambios realizados: menú Archivo >> GuardarUna vez hemos dejado el espacio en blanco para fotos y más texto, insertaremos unanueva línea Horizontal para dividir el pié de página del cuerpo central de la página: en elmenú Insertar haremos clic en Línea HorizontalA 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: verdanaEstilo de Fuente: normalTamaña: 1Color: negroGuardamos los cambios realizados: menú Archivo >> GuardarDespués de realizar todos los pasos anteriores, el resultado debería de ser similar a laimagen que se muestra a continuación: (sin las explicaciones en rojo)www.desenredate.com 13 de 28
  • 14. Cómo hacer una página web con M. FrontPage 2000.6. Cómo insertar tablas y darles formato.Las tablas son estructuras de una página web con las que se puede distribuir contenidoordenadamente.A continuación crearemos una tabla para insertar una foto y un comentario. Para ellocrearemos 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”: cuandoaparezcan las cuadrículas, (sin dejar de presionar el icono) seleccionaremos la primeracasilla y a continuación (sin dejar de presionar el icono) bajaremos y seleccionaremos lacasilla de abajo como indica la imagen siguiente:Icono “Insertar Tabla” cuadrículaswww.desenredate.com 14 de 28
  • 15. Cómo hacer una página web con M. FrontPage 2000.Cuando tengamos seleccionadas las dos casillas dejaremos de presionar el icono, y nosaparecerá en el espacio de trabajo (donde habíamos dejado el cursor) una tabla de 1columna 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 elderecho) nos aparecerá un cuadro de opciones:www.desenredate.com 15 de 28
  • 16. Cómo hacer una página web con M. FrontPage 2000.Hacemos clic en Propiedades de Tabla para que nos aparezca una ventana donde cambiarlas propiedades de la tabla:En la ventana realizaremos los siguientes cambios:Alineación: CentroEspecificar Ancho: 50 porcentajeMargen de celdas: 1Espaciado entre celdas: 2Bordes – Tamaño: 0Y aceptos clic en Aceptar.Guardamos los cambios realizados: menú Archivo >> GuardarAl aplicarle los cambios a la tabla: le hemos reducido el tamaño, la hemos centrado y alponerle los bordes igual cero hemos obtenido una tabla “invisible”. De esta forma estamosusando 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 nuestroespacio de trabajo (en la página de FrontPage) la veremos con los bordes punteados parafacilitar nuestro trabajo, pero una vez visualicemos la web en un navegador webcomprobaremos que la tabla no es visible.Otra forma de comprobar que nuestra tabla de “bordes punteados” no se verá en la web esdesplazarnos a la pestaña VISTA HTML ya que esta vista actúa como un navegador web:www.desenredate.com 16 de 28
  • 17. Cómo hacer una página web con M. FrontPage 2000.Una vez hemos comprobado que nuestra tabla no se verá en el resultado final, podemosvolver 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ómoinsertar una imagen leeremos el siguiente apartado.7. Cómo insertar imágenes.Para insertar una imagen iremos al menú Insertar >> Imagen >> Desde ArchivoNos aparecerá una ventana donde tendremos que localizar la imagen que deseemosinsertar. 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. Cuandoencontremos la que deseemos la seleccionamos y hacemos clic en Aceptar.www.desenredate.com 17 de 28
  • 18. Cómo hacer una página web con M. FrontPage 2000.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 laimagen siguiente:Cuando hayamos insertado una imagen, guardaremos los cambios: Archivo >> GuardarComo se ha comentado en líneas anteriores, cualquier elemento que insertemos en nuestraspáginas web deberán estar guardados dentro de la carpeta de nuestro sitio web, en nuestrocaso, se llamaba: C:miWebEs muy recomendable, que todas las imágenes que utilicemos en nuestras páginas webestén guardadas en una carpeta específica para ellas.Cuando en el segundo apartado de este manual definimos nuestro sitio web, FrontPage noscreó automáticamente una carpeta llamada “images” y será aquí donde deberemos guardartodas las imágenes que vayamos a utilizar.Observando desde el explorador de Windows Explorando desde la “vista carpetas” deFrontPagewww.desenredate.com 18 de 28
  • 19. Cómo hacer una página web con M. FrontPage 2000.FrontPage se asegura de que las imágenes que utilicemos están guardadas en la carpeta denuestra 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 webC:miWeb ó C:miWebimagesEn este caso FrontPage actúa con total normalidad al darse cuenta de que la imagenque se utiliza ya está dentro del directorio de la web, por lo tanto no hay ningúnproblema.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 esaimagen no está en el directorio de nuestra web, y por lo tanto nos da unas opcionespara 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 elmomento de insertar la imagen, sino que FrontPage la hace cuando guardemos (MenúArchivo >> Guardar) la página donde insertemos las imágenesNos mostrará la siguiente ventana, en la que deberemos indicarle que la guardar en lacarpeta “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, otrapá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, unadirección de correo electrónico, un archivo (como por ejemplo, un archivo multimedia o undocumento de Microsoft Office) o un programa. Un hipervínculo puede ser texto o unaimagen.www.desenredate.com 19 de 28
  • 20. Cómo hacer una página web con M. FrontPage 2000.4 tipos de hipervínculos:Enlaces internos: Este tipo de enlaces conducen a una página web dentro del mismo sitioweb donde está el propio enlace.Enlaces externos: Este tipo de enlaces nos conducen a páginas web de sitios web ajenos alnuestro.Enlaces a archivos: Son enlaces que conducen a archivos que no son páginas web. Coneste tipo de enlaces podemos permitir que el visitante de nuestra web se descarguearchivos 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á unaventana con la cual desde su programa de correo podrá enviarnos un correo electrónico a lacuenta 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.htmlUna vez guardada la página en nuestro directorio, le pondremos un título y un titular depágina.Para el título haremos lo siguiente:Menú Formato >> Fondo >> Pestaña General >> en la casilla Título (que por defecto ponePagina nueva 2) escribiremos el título de nuestra página, como por ejemplo: “Mis enlacespreferidos”A continuación insertaremos un titular de página. Para ello utilizaremos la herramientatexto:Teniendo abierta la página enlaces.html abierta, colocaremos el cursor en la parte superiorde la ventana y escribiremos una línea:www.desenredate.com 20 de 28
  • 21. Cómo hacer una página web con M. FrontPage 2000.“Estos son mis enlaces preferidos” y le daremos formato:Fuente: verdanaEstilo de Fuente: normalTamaño: 5A continuación insertaremos una línea horizontal: en el menú Insertar haremos clic enLí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 elbotón secundario del ratón (normalmente el derecho), en laventana que nos aparece hacemos clic en el comando“Propiedades de Tabla”:En este caso elegimos:Especificar ancho: 100 (porcentaje)Margen de celdas: 0Espacio entre celdas: 0Bordes Tamaño: 3Colores=> Borde claro: gris oscuro, Borde Oscuro: gris claroHacemos clic en Aceptar y guardamos los cambios: menú Archivo >> Guardar.www.desenredate.com 21 de 28
  • 22. Cómo hacer una página web con M. FrontPage 2000.o Ahora insertaremos enlaces externos en la tabla:Ponemos el cursor dentro de la primera celda de la tabla y escribimos el texto quecontendrá el enlace, por ejemplo: “Google” a continuación seleccionamos el texto quehemos escrito y hacemos clic en la opción Hipervínculo del menú Insertar. Nos aparecerá lasiguiente ventana:En el cuadro de diálogo “Dirección URL” escribiremos la dirección de la web a la quequeremos enlazar, en este caso sería: http://www.google.esEn la opción “Marco de destino” seleccionaremos “Nueva ventana” y haremos clic enAceptar. Esto es para que cuando el navegante haga clic en el enlace de Google se le abrauna nueva ventana de navegador con la web de Google y no se salga de nuestra páginapersonal.Repetiremos este paso hasta completar todos los enlaces que deseemos.Guardamos los cambios: menú Archivo >> Guardaro Ahora insertaremos un enlace interno:A continuación insertaremos un enlace interno, es decir, a una página de nuestro propiositio web. En este caso, en la página enlaces.html insertaremos un enlace para poderregresar a la página principal index.htmlPara ello, pondremos el cursor debajo de la tabla, dejando una línea en blanco (Insertandoun salto de línea normal).Escribiremos el siguiente texto “Volver a la página principal”Con formato: Fuente: verdana Estilo: Negrita y Tamaño: 3Seleccionamos el texto, y en el menú Insertar hacemos clic en Hipervínculo.www.desenredate.com 22 de 28
  • 23. Cómo hacer una página web con M. FrontPage 2000.Ahora, en lugar de poner la dirección URL, como muestra la siguiente imagen: haremos cliccon el ratón en el icono que representa la página index.html Además, en la opción “Marcode destino” seleccionaremos: Mismo Marco (Esto es para permitir al visitante de nuestraweb 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 queser similar a esta imagen:www.desenredate.com 23 de 28
  • 24. Cómo hacer una página web con M. FrontPage 2000.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 espacioque dejamos anteriormente para el menú (recuerdo que era entre las dos líneashorizontales debajo del titular), y el texto será “Mis enlaces preferidos” con hipervínculo aldocumento web enlaces.html tal y como se muestra en la siguiente imagen.www.desenredate.com 24 de 28
  • 25. Cómo hacer una página web con M. FrontPage 2000.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 porejemplo 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 queremosenlazar. Antes de crear el vínculo deberemos asegurarnos de que el fichero que queremosenlazar está dentro del directorio web C:miWebEjemplo visual:o A continuación insertaremos un hipervínculo “Mailto”Como se comentó anteriormente, al hacer clic sobre un enlace de tipo “mailto” provoca quese abra una ventana del cliente de correo configurado por el visitante para podermandarnos 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, vamosa escribir el siguiente texto:“Mándame un email” con el siguiente formato:Fuente: verdanaTamaña: 2Estilo: negritaColor: AzulSeleccionamos 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)www.desenredate.com 25 de 28
  • 26. Cómo hacer una página web con M. FrontPage 2000.Al hacer clic sobre el icono con forma de carta, nos aparecerá una ventana dondedeberemos escribir la dirección de email donde queremos recibir los mensajes que nosenvíen los visitantes de nuestra web.Una vez la hayamos escrito, haremos clic en Aceptar en esta ventana, y en la otra de “Crearví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 élcon texto, tablas, imágenes e hipervínculos.El siguiente paso consistirá en crear otras páginas según nuestras necesidades. Al tratarsede una página personal se podría –por ejemplo- crear una página para hablar de nuestrasaficiones, 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 seccionesResultado:www.desenredate.com 26 de 28
  • 27. Cómo hacer una página web con M. FrontPage 2000.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 FormatoMIDI. Es decir, utilizaremos archivos musicales con la extensión *.midiEl primer paso es guardar el archivo midi en el directorio de nuestra web C:miWeb. Acontinuación nos iremos al menú Formato >> Fondo y en la pestaña “General” nosfijaremos en la sección que pone “Sonido de fondo”. Haremos clic en Examinar ybuscaremos el archivo deseado.Si queremos que la música se reproduzca siempre (constantemente) dejaremos marcada lacasilla “Siembre”, de lo contrario le indicaremos el número de veces que queremos que sereproduzca en la casilla “Bucle”.www.desenredate.com 27 de 28
  • 28. Cómo hacer una página web con M. FrontPage 2000.o Insertar una fecha automáticaPara insertar una fecha y que ésta se actualice constantemente, utilizaremos un scriptprogramado en Javascript. Un script es un fragmento de código que tendremos que insertaren nuestra página web. Haremos lo siguientes pasos:IR al menú Insertar >> Avanzadas >> HMTLY en la ventana que nos aparezca deberemos copiar el código del javascript, que en estecaso es el siguiente:<script languaje="JavaScript">var mydate=new Date()var year=mydate.getYear()if (year < 1000)year+=1900var day=mydate.getDay()var month=mydate.getMonth()var daym=mydate.getDate()if (daym<10)daym="0"+daymvar dayarray=new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado")var montharray=newArray("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","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.comSebas GV.S Lunes, 09 de agosto de 2004. http:www.desenredate.comwww.desenredate.com 28 de 28