Ejercicio paso a paso Unidad 3. Creación del sitio web.

a.- Crear el sitio web.

Vamos a crear un sitio web personal ficticio.

Este sitio es el que utilizaremos para, de ahora en adelante, crear un sitio web personal en los ejercicios paso a paso; en los ejercicios propuestos iremos desarrollando otro sitio web, el web profesional.

La estructura de directorios y archivos del sitio web personal será la siguiente:

Tendrá una página principal con una presentación y los siguientes apartados:

• Acerca de mí: Hablará del autor de la web.

• Aficiones: Hablará de las aficiones del autor.

• Sitios favoritos: Contendrá enlaces a diversas webs.

• Galería de fotografías: Contendrá varias imágenes relacionadas con el autor y sus aficiones.

• Comentarios: Será una página donde los visitantes podrán dejar sus comentarios.

Para crear un sitio personal podemos crearlo de dos formas diferentes: de forma manual, o con el asistente para sitio web personal.

Empezaremos por crearlo de forma manual.

1. Hacer clic en Archivo - Nuevo.

2. En el panel de tareas a la derecha, en la sección Nuevo sitio web, haz clic en Sitio Web de una página....

3. En el diálogo Plantillas de sitio Web, en el apartado Opciones pulsa Examinar.... y busca la carpeta Mis documentos/mis ejercicios/personal (si todavía no la tienes creada créala), haz clic en Abrir.

4. Haz clic en la plantilla Sitio Web de una página.

5. Haz clic en Aceptar.

Hemos creado el sitio Web.

6. Comprueba en la zona inferior que estás en vista Carpetas , para poder ver el sitio web.

7. Comprueba que dentro del sitio existen 2 carpetas, images y _private , que están vacías. Comprueba además que tenemos un archivo llamado index.htm, los ha creado Frontpage automáticamente, index.htm tiene delante una casita, nos indica que esta página será la página principal del sitio.

8. Haz doble clic sobre el archivo index.htm y se abrirá. Comprueba que está en blanco y ciérralo.

9. Vuelve a la vista Carpetas, haz clic sobre la pestaña Sitio web. A la izquierda tenemos la estructura en forma de árbol de directorios, y a la derecha los directorios y los archivos. Es similar a como lo veríamos en el explorador de Windows.

Vamos a crear el resto de directorios.

10. Pulsa con el botón derecho del ratón sobre cualquier parte vacía de la parte derecha y haz clic en Nueva - Carpeta . Ponle de nombre varios y pulsa la tecla Intro la podríamos utilizar para guardar archivos que no sean ni páginas ni imágenes, como por ejemplo archivos de texto o vídeos.

11. Repite la operación, pero ahora teniendo el ratón sobre la carpeta varios que acabamos de crear; creamos la carpeta otra. La nueva carpeta se habrá creado dentro de varios, ahora sabemos crear una carpeta dentro de otra, si conoces el Explorador de Windows verás que funciona igual. Recuerda de no usar acentos ni espacios en blanco ni la letra ñ.

12. Cambia el nombre de la carpeta images por el nombre imagenes. Para hacer esto haz clic sobre la carpeta images y pulsa F2 a continuación puedes escribir el nombre de la carpeta. Si no te gusta utilizar teclas de función haz clic con el botón derecho del ratón sobre images y selecciona la opción Cambiar nombre del menú contextual.

A veces, tras realizar operaciones (como copiar archivos), es necesario pulsar F5 (o la opción Actualizar del menú Ver) para actualizar la vista de Carpetas.

Ahora vamos a eliminar el archivo index.htm que hemos generado al crear el sitio web, y sustituirlo por el archivo index.htm que hemos creado en el ejercicio del primer tema. No nos confundamos o tendremos que repetir el ejercicio del tema 1.

13. Asegúrate que estás en la Vista Carpetas.

14. Haz clic en index.htm y después en la tecla Supr. Aparece la siguiente ventana:

Esta acción nos advierte de que borrar index.htm es peligroso, ya que esta suele ser la página principal de cualquier sitio web. Sin embargo, como la vamos a sustituir por la nuestra, no hay ningún problema.

15. Haz clic en el botón Sí.

Ahora que ha sido borrada, vamos a copiar el archivo index.htm que creamos en el ejercicio del primer tema.

16. Desde la Vista de Carpetas, haz clic en la raíz del sitio web (la carpeta donde guardaremos todo nuestro sitio Mis documentos/mis ejercicios/personal).

17. Haz clic en Archivo - Importar (recuerda que si no aparece una opción de menú tienes que desplegar el menú completo con las flechas de Expandir). Aparecerá el diálogo Importar.

Con el que podemos copiar archivos e incluso carpetas enteras a nuestro sitio web.

18. Haz clic en Agregar archivo... y busca nuestro index.htm en la carpeta mis documentos/mis ejercicios.

19. Haz clic en él, y haz clic en el botón Aceptar en ambas ventanas. Se copiará.

20. Vuelve a la vista Carpetas y comprueba que sí se ha copiado.

Ahora, nuestra página índice es la página principal del sitio.