Manual para construir sitios Web con Microsoft FrontPage

La ventana de FrontPage

Abrimos el programa FrontPage, y la ventana que tenemos nos muestra una pagina en blanco, que le da el nombre provisional de Pagina_Nueva_1 (los nombres de archivos que guardemos con espacios, el programa nos pondrá guiones bajos automaticamente, para poder ser publicados).

Tenemos:

En la zona en blanco es donde vamos a realizar nuestra pagina, donde pondremos texto, imágenes etc.

Tenemos otras partes que vemos por separado:

En la parte superior de la ventana tenemos la barra de menús y los botones de la barra de herramientas

Donde tenemos una serie de botones muy interesantes:

 Publicar Web. Tenemos que estar conectados a Internet, con este botón, el programa lleva los archivos de nuestra Web al servidor para que cualquiera que esté conectado a Internet pueda verlos poniendo nuestra dirección (dominio) en su navegador.

 Ver carpetas, si pulsamos en la parte de la izquierda vemos todos las carpetas y archivos que tenemos en nuestra Web, si lo volvemos a pulsar, ya no las vemos.

 Vista en el navegador. El como estemos viendo que nos queda nuestra pagina en el programa, no quiere decir que se vaya a ver exactamente así en Internet, si pulsamos aquí la veremos en el navegador, como si estuviera en Internet, nos pedirá que Guardemos la pagina (que le demos un nombre y la guardemos).

 Parte fundamental de las paginas van a ser los hipervinculos o enlaces, si queremos que la gente al pulsar en una palabra o frase, vean otra pagina, seleccionaremos con el raton la palabra o frase y pulsaremos este botón de insertar hipervinculo, tendremos que indicarle el nombre de la pagina a donde queremos que vaya.

 Podemos hacer que los textos (e imágenes) se alineen a izquierda, centro o derecha, pero no podemos (como en el Word por ejemplo, como estos textos que estás viendo) justificar a izquierda y derecha.

 Para cambiar el tipo de letra

 Para cambiar el tamaño de la letra.

 Donde podemos seleccionar el color del texto que queremos utilizar, pinchando en la flechita.

En la parte de la izquierda tenemos la barra de vistas, que la podemos quitar pulsando en el Menú Ver > Barra de vistas (si tiene la señal está y si no la tiene, no está). Es interesante no tenerla puesta.

Tenemos seleccionado Pagina, por lo tanto a la derecha estamos viendo la página, que es donde trabajamos, donde confeccionamos la web, el lugar habitual.

Si pulsamos carpetas, a la derecha veremos las distintas carpetas y archivos que tenemos en estos momentos en nuestra Web, igual que con el Explorador de Windows.

Con Informes el programa nos da una serie de información interesante sobre el web: paginas lentas, errores, etc.

Podemos hacer que automaticamente, según vayamos creando nuevas paginas, estas se relacionen con otras, en la vista exploracion pinchamos en una pagina y sin soltar el boton del raton la llevamos encima, abajo o al lado de otra pagina.

Con Hipervinculos vemos todos los que tenemos hechos en las paginas.

Podemos crear tareas, decirle al programa que paginas queremos hacer, cuales no hemos terminado etc.

En la parte baja de la ventana, tenemos los siguientes elementos:

Tres tipos de vista de la página: Normal: es en la que estamos habitualmente, donde realizamos la página.

HTML: realmente la pagina no se hace como en la vista normal: escribiendo, insertando imágenes, etc. Sino que va todo en codigo HTML, instrucciones que van indicando como es la página, colores y situacion de los textos, situación de las imágenes, etc. Por lo tanto si pinchamos aquí veremos codigos e instrucciones, o lo que es lo mismo, la página real, lo que el programa navegador que tenga la persona que nos visita en Internet, está viendo este programa y traduciendo.

Vista previa: para ver lo que estamos haciendo como queda visto en Internet (aproximadamente).

En la parte de abajo a la derecha, nos da el programa una información básica y muy interesante: cuanto tiempo (en segundos) tarda una persona que esté viendo nuestra página en Internet, con un modem a 28.800, o lo que es lo mismo, cuanto se tarda en “cargar” la página; la persona que esté en Internet que tiempo ha de esperar para poder contemplar todos los elementos de la página. En el ejemplo que vemos marca 0 segundos, esto es así porque todavia no hay nada en la página.

Hemos insertado una imagen y el tiempo se ha ido a 340 segundos. Esto es excesivo. No es recomendable que pase de 20 segundos.

Crear el sitio Web

Realmente lo que hacemos es crear un sitio Web, un lugar, una carpeta donde pondremos la página o paginas que en su conjunto formarán el sitio Web. Para su correcto funcionamiento vamos a crear una carpeta en Windows, (muy interesante el Manual en CD Windows, esto es publicidad de nuestro patrocinador), la creamos desde el Frontpage, de manera que el programa ya le va a indicar al sistema operativo que es una “carpeta Web”, con lo que tiene unas connotaciones especiales.

Por lo tanto vamos al Menú Archivo > Nuevo >Web  y tenemos la siguiente:

Tenemos que indicarle la ubicación del Web, va a ser del estilo de lo que estas viendo en la imagen superior: C:/   esto es para indicarle que se guarda en el disco duro del ordenador,  “Web” este es el nombre que le doy a la carpeta, pero puedes darle el nombre que quieras, siempre que luego te acuerdes. Por lo tanto vamos a crear una carpeta que va a alojar nuestro sitio web en nuestro disco duro y que le vamos a llamar Web.

A la izquierda de la ventana dejamos seleccionado Web de una pagina, esto que tenemos en la izquierda son asistentes y plantillas, que, creemos, no es aconsejable utilizar, es mejor ir nosotros solos, vais a ver que es muy facil.

Pulsamos aceptar y ya tenemos nuestra carpeta.

Para trabajar comodamente vamos a dejar la ventana como vemos en la imagen siguiente:

Esto se consigue con lo siguiente: Menú Ver > Barra de Vistas no tiene que tener la selección. Menú Ver > Lista de Carpetas, si tiene que estar seleccionada.

Vemos que Frontpage nos ha creado dos carpetas y un archivo sin nosotros decirle nada.

Carpeta _private: esta carpeta es para guardar archivos que no queramos que sean accesibles para otros desde internet, cuando publiquemos nuestro sitio.

Carpeta images: esta carpeta es por si queremos ser un poco aseados (muy conveniente), y todas las imágenes que vayamos insertando en nuestras paginas, las guardemos aquí. Esto es muy recomendable.

No ha abierto ya un archivo con el nombre index.htm  que  va a ser (si el servidor no dice lo contrario) nuestra pagina de inicio, la pagina que primero ven la gente que va a nuestra dirección de Internet.

Por lo tanto vamos a colocarnos en la pagina index.htm y a empezar a confeccionar nuestra pagina de inicio. Para ello pinchamos 2 veces sobre ella con el boton izquierdo del ratón.

Comprobamos que estamos en esta pagina, viendo

Nuestra página de inicio

No sé lo que piensan Vds., pero como necesitamos un ejemplo para seguir este manual, vamo a suponer que trabajamos para un Hotel y que estamos confeccionando su sitio Web, con el objetivo de poder atraer clientes. Clientes que encuentren información de nuestro hotel y que, si les gusta, puedan hacer las oportunas reservas.

Para ello, y estando situados en nuestra página de inicio (index.htm), vamos a insertar una tabla de 2*2, o sea 2 filas por 2 columnas:

Menú Tabla > Insertar > Tabla :

En el ancho de la tabla le seleccionamos Especificar ancho, y le ponemos que ocupe el 97% de la pagina, para que quede bonito.

Si el tamaño del borde es 0, esto quiere decir que no se verán las lineas de división de las celdas. Pulsamos Aceptar.

Y tenemos creada la tabla, si ya se que es pequeña, no se preocupen, irá engordando según le vayamos poniendo los textos y las imágenes.

Ahora que me acuerdo, hemos puesto el valor de Espaciado entre celdas = 0, esto puede provocar que las letras de una y otra celda se peguen y quede muy feo. No pasa nada, estando situados en pulsamos el botón derecho del ratón y seleccionamos Propiedades de tabla...

Siempre que queramos modificar algo de una tabla, nos situaremos sobre ella, pulsaremos el botón derecho del ratón y seleccionaremos Propiedades de Tabla.... Además de lo visto podemos ponerle color de fondo   Y ponerle bordes que se vean, pulsando en    y después en bordes.

Cuando se trate de modificar alguna característica de una celda, pulsaremos botón derecho del ratón (estando situdados en la celda que queramos modificar), y seleccionamos Propiedades de celda...

Nos situamos en la primera celda donde vamos a poner el nombre del Hotel y alguna explicación.

(Esto de CELDA 1 etc no tienen que ponerlo, es para entendernos)

He puesto en la celda 1, lo que podría ser el membrete del Hotel, ya hemos visto como poner los textos centrados, el tipo de letra y el color del texto lo seleccionamos en el botón

Vamos a la celda 2 (pinchamos en ella) y colocaremos una imagen, para ello Menú Insertar > Imagen > desde Archivo...

Como en nuestra carpeta de images no tenemos por el momento ninguna guardada, pulsamos en para buscar en nuestro disco duro y seleccionar la imagen que queramos colocar.

Vamos a guardar la página para que no se nos pierda el trabajo, pulsamos

Y nos saldrá la siguiente ventana:

Esto es porque las imágenes no se quedan realmente en la página si no en archivos aparte vinculadas a esta.

Pulsamos en el botón  puesto que queremos guardar la imagen en la carpeta images. En la ventana que nos sale pinchamos 2 veces en images y luego Aceptar.

En la celda 3 insertamos otra imagen y en la celda 4 escribimos lo siguiente:

Esta imagen la he copiado de una pagina de internet: http://www.rtmhotels.com/HOTELES1D2.HTM veo la imagen, me gusta, me pongo sobre ella, pulso el botón derecho del ratón y selecciono Copiar. Luego voy al Frontpage, pincho en la celda 3, pulso el botón derecho del ratón y selecciono Pegar. Pinchamos  para guardar la pagina y nos cercionamos de que la nueva imagen se guarda en la carpeta de images. (Ya nos sale por defecto la carpeta seleccionada de images).

Hipervinculos, enlaces, links.

Creamos una nueva página, para ello pulsamos en el botón , y tenemos la ventana de Frontpage con una pagina en blanco donde vamos a poner las vistas y las caracteristicas de nuestro Hotel.

Lo primero es que le vamos a poner un fondo, una imagen que será el fondo de la pagina.

Pulsamos en Menú Formato > Fondo, y tenemos la siguiente ventana:

Seleccionamos Imagen de fondo y pulsamos en Examinar.. para ir a buscar una imagen que queramos, he seleccionado una imagen (que tienen Vds en el CD, como toda la Web de ejemplo), y me queda la pagina como se ve a continuación:

En esta página es donde voy a relatar las caracteristicas del Hotel, por lo tanto escribiremos lo que ven en la pantalla siguiente:

Los redondelitos rojos o iconos los hemos puesto seleccionando Menú Insertar > Imagen > Desde Archivo..., y hemos buscado el icono que mas nos gusta, solo hemos insertado el primero, los siguientes los copiamos y pegamos. Guardamos la página pulsando  y le doy el nombre de caracteristicas. (Guardamos tambien las dos nuevas imágenes: fondo e icono).

Teniendo la vista de carpetas a la izquierda de la ventana, (si no vemos a la izquierda las carpetas y los archivos, pulsamos en el botón  ). Pulsamos dos veces en index para abrir nuestra página de incio:

Seleccionamos con el ratón la frase “Vistas y caracteristicas del hotel”  vamos a ponerle un hipervinculo o enlace, de manera que cuando alguien pinche sobre esta frase vaya a la pagina de caracteristicas que acabamos de crear. Por lo tanto, teniendo seleccionado esta frase pulsamos en el botoón de hipervinculo  y tenemos la siguiente ventana:

Pinchamos una vez en la pagina con la que queremos enlazar: caracteristicas y se nos pone en Dirección URL  pulsamos en Marco de destino para indicarle que tipo de ventana queremos que se le abra al visitante para ver la nueva pagina:

Si seleccionamos Toda la página, se le abrirá esta nueva pagina en la misma ventana del navegador.

Si seleccionamos Nueva ventana, esto quiere decir lo contrario, mantendrá abierta nuestra página de inicio y se le abrirá una nueva ventana con la pagina de las caracteristicas del Hotel. Seleccionamos esta. Pulsamos Aceptar.

Pulsamos ahora en  Despues en Formato, y despues en Fuente..., le tenemos que indicar de que color queremos el texto, ya que cuando pongamos un hipervinculo siempre nos lo pondrá en azul, seleccionamos el color rojo oscuro. Y Aceptamos.

Si vamos a Vista previa, y pinchamos en nuestro hipervinculo veremos que va a la pagina de caracteristicas.

OTROS HIPERVINCULOS :

Estando en la ventana de Hipervinculo:

 si escribimos correctamente la url o dirección de una pagina web, estamos haciendo lo que se conoce como un link, un enlace externo a otra página.

 Si pulsamos en el icono correo se nos abre una ventana para poner una direccion de correo correcta (por ejemplo hotel@hotel.com), de manera que al pulsar en el enlace, al visitante se le abre automaticamente su programa de correo y nos puede enviar uno.

Todos los enlaces primero seleccionamos la palabra, frase o imagen que queremos que cuando la gente pinche en ella vaya al hipervinculo que queremos realizar.

Si pinchamos primero una vez en una imagen y luego pulsamos el botón hipervinculo, podremos indicar a que pagina de nuestra web o a que enlace externo o a que dirección de correo queremos que vaya.

Si pinchamos en una imagen, en la parte de debajo de la ventana se nos abre la barra de dibujo, si pinchamos en una de las autoformas:  y luego vamos a la imagen y dibujamos, por ejemplo, un pequeño rectangulo, al soltar el ratón se nos abre la ventana de hipervinculo automaticamente. Con esto lo que conseguimos es que en una imagen podamos poner varios hipervinculos distintos, seleccionando partes de ella mediante el dibujo de cuadrados, u otras formas.

Publicar la Web

Como ya hemos realizado un par de páginas, es muy conveniente que publiquemos ya la Web en un servidor gratuito, pues es parte esencial de la creación del sitio Web ir realizando pruebas reales para poder corregir errores.

Para ello abriremos nuestro navegador (el programa con el que vamos por Internet) y vamos a ir a Tripod que es un sitio, que funciona bastante bien, que regala espacio web. Quiere decir que nos da un nombre para nuestra pagina o dirección url, que escribiendola en el navegador cualquiera podrá verla y que nos acoge o aloja nuestros archivos y carpetas de nuestro sitio Web.

Escribimos en la dirección: http://www.tripod.es/membership, y vamos a la pagina que tenemos encima. Pinchamos en ¡Deseo suscribirme!  Y tenemos la pagina que sigue:

Donde nos muestra las condiciones de suscripción, pulsamos en Aceptar

Lo siguiente es el formulario. HAY QUE RELLENARLO CON MUCHO CUIDADO. El Nombre de Usuario y Contraseña tenemos que anotarlo en algún sitio que no perdamos, lo vamos a emplear muchas veces. El nombre de usuario va a ser parte de nuestra url o dirección, de manera que si ponemos “yoeltonto”, nuestra url será: http://usuarios.tripod.es/yoeltonto

No ponemos signos ni espacios. Dediquen unos minutos a rellenarlo correctamente, no emplen nombres de usuario sencillos puesto que ya estarán cogidos y les obligará a rellenar todo el formulario otra vez.

Rellenen todos los datos, sean verdaderos o falsos, y pulsen enviar

La ultima ventana nos enseña nuestra dirección url, la que hay que poner en el navegador para visitar nuestra web

Volvemos a Frontpage y vamos a publicar la web, es decir. Vamos a llevar los archivos a Tripod para que ya podamos visitarlos nosotros o cualquiera en Internet.

Menú Archivo > Publicar Web...

Escribimos ftp://ftp.es.tripod.de esto quiere decir que publicamos (en tripod y servidores gratuitos normalmente) por el sistema ftp de transferencia de ficheros, pulsamos Publicar 

Nos sale una ventana en la que nos pide nombre de usuario y contraseña:

Ponemos el nombre de usuario y contraseña que les dije antes que anotaran en algun sitio que no perdieran. Pulsamos aceptar

Al terminar pulsamos Listo y vamos a ver nuestra pagina en Internet.

Abrimos nuestro navegador y ponemos nuestra direccion: http://usuarios.tripod.es/nombreusuario  (no me pongan nombreusuario, pongan su nombre de usuario)

Como es un servidor gratuito, nos saca publicidad, pero podemos cerrarla pinchando en

Tenemos nuestra web ya publicada y con una dirección url  que consiste en ir directamente a nuestra pagina index.

Formularios

Parte fundamental en los sitios Web los formularios no nos van a funcionar en los sitios gratuitos, solo en los servidores de pago, ya que necesitamos que el servidor tenga extensiones frontpage, o sea instalado el programa y haciendolo funcionar.

Vamos a crear una pagina nueva donde los posibles clientes puedan realizar sus reservas en nuestro hotel.

Pulsamos  en introducimos el titulo, de manera que quede:

Seleccionamos en el Menú Insertar > Formulario > Formulario:

El rectangulo que nos ha formado significa que los elementos que pongamos dentro se comportarán como un formulario conjunto, por lo que todo lo que vamos a insertar a partir de ahora, que van a ser elementos de formulario, siempre dentro de   para hacer sito pulsamos un par de veces la tecla Intro:

Nos situamos el la parte de arriba del formulario, pinchando, y vamos a escribir el texto: “Nombre y Apellidos” y a continuación seleccionamos Menú Insertar > Formulario > Cuadro de texto de una linea:

Ese cuadro sirve para que el cliente introduzca su nombre y apellidos, en general para que el visitante de nuestra Web escriba un dato que luego veremos como nos viene a nosotros. En el cuadro de texto de una linea nos ponemos sobre el con el ratón y pulsamos el botón derecho, seleccionando Propiedades de campo de formulario:

En Nombre escribimos Nombre (esto es importante, no puede tener espacios), en Valor Inicial nada, puesto que tiene que estar en blanco, y en Ancho de caracteres, los que consideremos necesarios para que alguien incluya su nombre y apellidos, quizás con 40 bastan. Pulsamos Aceptar. Pinchamos a la derecha para salir del cuadro y pulsamos Intro.

Escribimos : Opciones y pulsamos Intro

Vamos a poner dos casillas para que el cliente seleccione o ninguna o una o las dos. Menú Insertar > Formulario > Casilla de verificación. Escribimos: Niños. Pulsamos Intro. Menú Insertar >Formulario > Casilla de verificación. Escribimos: Perros.

Con las casillas de verificación conseguimos que el visitante pueda seleccionar una, varias, todas o ninguna, en este caso nos comunicará si lleva o no niños y si lleva o no perros. Pulsamos con el botón derecho en la primera casilla y seleccionamos Propiedades de campo de formulario:

En Valor hemos escrito Niños puesto que esa es la palabra que veremos que nos enviará el formulario, es la información que queremos. Realizamos lo mismo con la siguiente casilla, escribiendo Perros en Nombre y Perros en Valor.

Pinchamos a lado de la s de perros y damos Intro.

Menú Insertar >Formulario >Botón de opción, y Escribimos: Habitación Dobel, pulsamos Intro

Menú Insertar > Formulario > Botón de opción y Escribimos: Habitación Individual.

Con los botones de opción conseguimos que el visitante elija una opción u otra, no puede elegir las dos y podemos hacer que siempre esté una elegida como es este caso, si no lo modifica la habitación que nos solicitará será la doble.

Pulsamos con el botón derecho del ratón sobre el primer botón de opción

 El Nombre del Grupo significa que todos los botones que lleven este nombre se comportarán conjuntamente, si son nombres distintos, entonces los botones no tendrán relación entre sí.

Pulsamos con el botón derecho en el siguiente boótn de opción y seleccionando propiedades de campo de formulario dejamos lo siguiente:

Estado inicial: No seleccionado. Por lo tanto en el anterior estaba Seleccionado y entonces si el cliente no lo modifica es que solicita habitación doble.

Pinchamos al lado de la l de Habitación Individual y pulsamos Intro. Escribimos : Comentarios y pulsamos Intro. Vamos a Menú Insertar > Formulario > Cuadro de texto con desplazamiento, y nos queda:

Este cuadro sirve para que el visitante escriba libremente y sin limite, comentarios, dudas, manifestaciones etc que necesitemos. Pinchamos con el botón derecho sobre él y seleccionamos Propiedades campo de formulario:

 Y le damos nombre al campo.

Por el momento hemos finalizado nuestro formulario, pulsamos en  y damos el nombre de reservas al archivo.

Vamos a hacer una pagina de confirmación, esto es una página que el cliente verá despues de haber rellenado el formulario y pulsado enviar, esta página va a ser obligatoria muy pronto (desde el punto de vista legal), cuando realizamos alguna actividad de comercio electronico, puesto que lo que hace la pagina de confirmacion es precisamente lo que su nombre indica, confirmar la petición del cliente y constituir un contrato de servicios.

Pulsamos en   ponemos un fondo de color Menú Formato > Fondo.. Colores: Fondo y elegimos un color azul marino.

Escribimos lo siguiente: CONFIRMACIÓN DE RESERVA, pulsamos Intro un par de veces y escribimos: A Nombre de: vamos a Menú Insertar > Componente> Campo de confirmación:

 Como queremos que salga el nombre y apellidos del cliente, escribimos  que es exactamente lo que escribimos en el formulario, en el campo correspondiente, pulsamos Aceptar:

Pinchamos en y pulsamos Intro para seguir introduciendo campos de confirmacion, que van a recoger la información que se introduzca en el formulario.

Escribimos : Opciones:  y vamos otra vez a Menú Insertar > Componente > Campo de confirmación y escribimos : Niños   Pulsamos barra espaciadora una vez y volvemos a insertar otro campo de confirmación escribiendo: Perros.

De manera que queda:

Para que en el caso de que haya elegido alguna o las dos opciones el cliente, salgan en estos campos. Pulsamos Intro y escribimos: Tipo de Habitación:     insertamos campo de confirmacion y le introducimos el texto de Habitacion (los textos que introducimos en los campos de confirmacion deben ser exactamente iguales a los que figuran en el formulario).

Escribimos lo que vemos en pantalla y vamos a guardar la pagina con el nombre de confirmacion.

Volvemos a nuestra pagina de formulario, por lo tanto pinchamos en el archivo en la parte izquierda de la ventana (reservas.htm), y tenemos:

Pinchamos una vez con el raton dentro del formulario (que no sea dentro de un campo de formulario), por ejemplo aquí  pulsamos boton derecho y seleccionamos Propiedades de formulario:

En Enviar a: es un archivo donde va almacenando todos los formularios que nos rellenan los clientes. Por lo que si vamos con el navegador a este archivo podremos verlo perfectamente.

En Direccion de correo electronico pondremos la direccion de correo donde queremos recibir por mail y en el acto los formularios que vayan realizando los clientes.

Pinchamos en Opciones, y tenemos:

En esta ventana, pinchamos en la pestaña de Resultados por correo electronico  y tenemos:

En Direccion de correo electronico para enviar resultados, tiene que salirnos la direccion de correo que introdujimos antes.

En Formato de correo electronico es aconsejable que dejemos “Texto con formato” es la presentacion, la forma en que nos llegarán los datos por correo.

En Linea de Asunto escribimos que queremos que nos ponga en el membrete o asunto del correo, puede ser como en el ejemplo : Reserva

Pinchamos en Pestaña Pagina de confirmación:

Y pulsando el botón de Examinar... vamos a indicarle cual es la pagina de confirmacion (la que acabamos de hacer).

Pulsamos Aceptar, Aceptar y nos sale el siguiente mensaje:

Esto es porque en el ordenador no tenemos configuradas las extensiones de Frontpage, pero, se supone, que en nuestro servidor de Internet si que las tendremos configuradas, por lo tanto pulsamos NO .

Mucho ojo: pulsamos:  siempre que nos aparezca esta ventana.

Pulsamos en  para volver a guardar la pagina, ya que hemos realizado cambios.

Volvemos a publicar la web

Es conveniente ir publicando la web para ir comprobando fallos y en su caso repararlos.

Como es la segunda vez que publicamos pulsamos en el boton de publicar  y , si nos lo pide, le suministramos los datos de publicacion que tenemos mas arriba.

Pueden ocasionarse errores en la publicacion: normalmente van a ser porque no hemos puesto correctamente el nombre del servidor, o la contraseña o el nombre del usuario, hay que tener en cuenta que si tenemos que poner un punto es facil equivocarse y poner una coma.

Si corregimos estos errores y el servidor (gratuito, con los de pago no pasa), sigue dando errores es que no nos acepta los archivos con mas de 7 letras. Por lo tanto tenemos que ir a cambiarlos.

En nuestra ventana vamos pulsando encima de los archivos con mas de 7 letras y les cambiamos los nombres pulsando sobre ellos con el botón derecho del ratón y seleccionando Cambiar nombre. Mucho ojo, si cambiamos la extensión del archivo lo inutilizamos. Si un arcivo es caracteristicas.htm, el .htm significa el tipo de archivo, esto hay que dejarlo exactamente igual, o sea que este archivo podría pasar a llamarse carac.htm.

Siempre los cambiamos en la ventana de Frontpage, ni se os ocurra cambiar el nombre en el Explorador de Windows, entonces no sirve. Cambiando el nombre de los archivos en Frontpage, el programa actualiza la información, o sea que si hay un hipervinculo de una pagina a este archivo, ya se ocupa el programa de cambiar el nuevo nombre de destino del hipervinculo.

Pinchamos en para cambiar el nombre. Pulsando boton derecho, seleccionamos cambiar nombre, con cuidado de dejar el .htm.

Poner un contador de visitas

Es muy interesante saber cuantas visitas tiene nuestra web. En los servidores de pago esto no es necesario puesto que nos dan un servicio de estadisticas.

Pinchamos dos veces sobre index.htm para ir a nuestra pagina de incio. Vamos a Menú > Insertar > Componente > Contador de visitas a la página

Y tenemos la ventana de al lado en la que seleccionamos el tipo de contador que queremos.

Si no deseamos que el número empiece por 0 y quedar muy mal con los amigos, pinchamos en y le indicamos a partir de que numero queremos que comience el contador. Este no va a funcionar hasta que no publiquemos en un servidor con extensiones Frontpage.

Pulsamos Guardar para conservar los últimos cambios.

Páginas de Marcos

Vamos a crear una pagina de marcos y entenderemos (al final ) que significa esto.

Menú Archivo > Nuevo > Pagina... y seleccionamos pestaña de Pagina de marcos:

Dejamos seleccionada la que está de Contenido y pulsamos Aceptar.

En la ventana que nos sale pulsamos en el marco de la izquierda Nueva pagina

Y al ponerse en blanco, escribimos:

Hotel Playamar (pulsamos Intro). Vamos a Menú Insertar > Componente > bón activable (esto no es especifico de los marcos, pero vamos a combinar el ejemplo, esto que vamos a hacer es lenguaje Java). Tenemos:

En texto del botón escribimos lo que queremos que se vea en la pagina.

En Vincular a , pulsamos en Examinar y seleccionamos el archivo que queremos que se vea cuando alguien pulse en este botón, que será el de caracteristicas.htm. Cuando estamos seleccionando el hipervinculo, pulsamos en el botón  aquí y nos sale la ventana que sigue:

Vamos a indicarle que cuando alguien pinche en el botón, no vaya a otra pagina, si no que se vea en la parte de la derecha, pinchamos en pulsamos Aceptar.

Los botones tienen posibilidades de diversos efectos, efectos que funcionan cuando alguien pasa el ratón por encima de ellos, pinchando en el desplegable podemos seleccionar uno u otro.

Hacemos lo mismo para Reservas, de manera que nos queda la pagina como sigue:

Ya tenemos 2 paginas para la parte de la derecha   podemos hacer una nueva, como hemos hecho con la parte de la izquierda, o bien Establecer pagina inicial... que es lo que haremos, decirle cual es la pagina que saldrá en principio cuando alguien vaya a esta pagina de marcos. Pulsamos en y seleccionamos index.htm, de manera que nos queda:

Ahora vamos a guardar la pagina de marcos, y asi terminaremos de entender que es esto:

Pinchamos en Guardar , y tenemos:

Primero nos pide que demos un nombre a la pagina de la izquierda, por eso la pone mas oscura, la llamamos por ejemplo indice, y pulsamos Guardar.

Ahora nos pide que demos nombre a la pagina de marcos, al conjunto, puesto que asi realizaremos enlaces a esta pagina o podremos ponerla como pagina de inicio, por eso pone mas oscuro el conjunto la llamamos por ejemplo entrada. Pulsamos guardar.

Como la otra pagina que hemos puesto (index) ya tenia nombre, no nos ha pedido el nombre para esta página. Si hubieramos creado la pagina de marcos con 2 paginas nuevas, nos hubiera pedido, al guardar, 3 nombres: 1 para la pagina de la izquierda, el segundo para la pagina de la derecha y el tercero para el conjunto.

Vamos a cambiar el nombre a la pagina index, y la llamamos por ejemplo hotel. Pinchamos sobre ella y con el botón derecho del ratón seleccionamos Cambiar nombre (pulsamos Si cuando nos pregunta si queremos que actualice hipervinculos) Ahora al conjunto de marcos le vamos a llamar index. Por lo tanto pinchamos con el boton derecho sobre entrada.htm y lo cambiamos a index.htm. Nos queda:

Ahora nuestra pagina de inicio es la que vemos, y cuando los visitantes pulsen en la izquierda el botón caracteristicas, verán a la derecha la pagina que hicimos de caracteristicas. Cuando pulsen en el boton de Reservas, tendrán a la derecha el formulario de reservas.

Pinchamos en la pagina de la izquierda y seleccionamos Menú > Marcos > Pagina de Marcos:

Podemos indicarle si queremos o no que salga la barra de desplazamiento en el marco, y si pinchamos en Página de marcos... tendremos la ventana siguiente

Donde, entre otras, podemos indicar que no queremos que se note el marco, que no se vea ninguna linea, para ello pondremos el valor 0 en

Vender la Web

Probablemente deben de haber mas de 1.000.000.000 de paginas web por Internet, por lo tanto ¿cómo van a encontrar la nuestra?. Tenemos que ponerla en los buscadores por el concepto que queremos que nos encuentren. Si se trata de un hotel, lo que queremos es que alguien que vaya buscando turismo, vacaciones, hoteles, playas etc., le salga el enlace a nuestro sitio.

Primero vamos a ponerle los Keywords o palabras clave a nuestras paginas.

Tenemos dos tipos de buscadores: Los Indices (como www.terra.es ) que no son exactamente buscadores, sino que las paginas se dan de alta con todos los datos y según lo que ponemos, eso sale. Y los buscadores en los que las páginas se dan de alta solo con su dirección url y el ya nos cataloga.

La clasificación la hacen los buscadores según las palabras claves o keywords que tengan las paginas, por lo tanto, vamos a menú Archivo> Propiedades> Personalizado, y en la ventana inferior comprobamos si tiene lo siguiente: description,  keywords. Si lo tiene pulsamos en cada uno de ellos y pinchamos Modificar. En description en la casilla de Valor debe contener una breve y explicita descripción de la pagina, no mas de 250 caracteres, En keywords, debe contener, separados por comas, palabras sueltas que definan la pagina, no mas de 20 palabras. Si no tiene description o keywords, o alguno de los dos falta, pulsamos Agregar y en Nombre ponemos lo que falte (por ejemplo keywords), y en Valor lo ya comentado.

Segundo paso: vamos a los indices y buscadores; por ejemplo www.terra.es (abrimos el navegador y ponemos esta dirección)

Siempre tenemos que indicar primero la sección o apartado donde queremos que nos clasifiquen nuestro sitio web, en terra está en Categorías  , por lo tanto pinchamos este desplegable y seleccionamos Turismo:

Aquí pinchamos en Darse de alta   y tenemos:

En esta primera ventana tenemos que introducir CORRECTAMENTE la direccion de nuestra pagina web, si la tenemos en tripod será: http://usuarios.tripod.es/nombreusuario . Ojo que si confundimos un punto por una coma, ya no sirve. Pulsamos enviar y tenemos:

Todo un formulario para llenar y que tenemos que hacer correctamente:

Importante:

Titulo: el de nuestra web, conciso, claro y corto: Hotel Playamar

Explicacion: esto es el contenido, unos 250 caracteres, es lo que va a ver la gente despues del titulo: Situado en la playa de Denia, Hotel de 4 estrellas abierto todo el año, en primera linea, con piscina propia.

Palabras clave: es por lo que va a buscar terra: Hoteles, Hotel de Playa, Vacaciones, Turismo, Denia, Costa Blanca, Primera linea playa, Piscina, Viajes, Espana, Mediterraneo, Sol.

Tenemos sitios donde nos dan de alta de forma cuasi automatica, el mejor es http://www.lpis.com/huella

Dar de alta en un buscador:

En Altavista España: http://es-es.altavista.com

En la parte de abajo tenemos: Añadir a Altavista su sitio Web pinchamos y tenemos:

Tambien en la parte final, donde rellenamos, correctamente nuestra direccion de url     y pulsamos Enviar.

Y ya esta dada de alta, dado que los datos los tomara de lo que pusimos en keywords y content.

Cursos

Curso de Paginas Web

Curso de Dreamweaver

Curso de Presto

Curso de 3D Studio Max

Curso de Adobe Premiere

Curso de Flash

Curso de Freehand

Enlaces interesantes

 Curso de Frontpage 1997, 2000, 2002, XP. Curso de creación y diseño de páginas web con Frontpage

Curso de creación y diseño de páginas web con Dreamweaver

Cursos Online

Cursos a distancia