guia construccion sitio web dreamweber

Guía Construcción de Sitios Web Con Dreamweaver

Dreamweaver en pocas palabras es un editor de código Web que usa una interfaz de diseño, es decir genera códigos Web automáticamente a medida que diseñamos un sitio

La siguiente guía nos dará los pasos básicos para realizar un sitio


Material previo
-imágenes y texto relativos a un tema (al menos 7 imágenes y por lo menos dos textos deuna extensión de 500 letras)
-una imagen pequeña que servirá de logo (150x 150 píxeles)
-una imagen pequeña (200x 200) píxeles mas una copia manipulada en fireworks la cual deberá tener ya sea una luminosidad menor o un efecto que las diferencie
-una imagen clara para usar de fondo

Definición de Sitio
Lo primero y fundamental que debemos realizar es definir la carpeta raíz de nuestrositio. Una vez que este sitio se encuentre en línea el servidor que aloja al sitio llevara a nuestros usuarios a esta carpeta y solo podrán ver los archivos que se encuentren en ella

Procedimiento
-Abra el Programa ud. vera la siguiente pantalla (esta es la de Dreamweaver 2004 puede que ud vea algunas diferencias)

-en Recuadros celestes vemos la opción de crear un sitio nuevo. Seleccionamos yveremos un menú que tiene dos pestañas básica y avanzada






-seleccionamos avanzada ud debería tener la siguiente imagen ahora


-Póngale nombre a su sitio donde dice nombre del sitio
-Crear Carpeta Raíz Local: Seleccione el icono en el costado derecho del texto carpeta raíz local y elija la ubicación de su carpeta raíz (escritorio por ejemplo) cree una carpeta y nómbrela. A partirde ahora todos los archivos de su sitio serán contenidos en esta carpeta

En este momento debemos hacer una distinción muy importante
Ningún archivo HTML debe ser guardado usando mayúsculas, acentos o espacios ni la letra Ñ u otro carácter que sea relativo a un dialecto ajeno al Ingles
El texto que esta contenido en el archivo HTML puede usar todos los elementos previamente prohibidos pero nopueden ser usados en el momento de nombrar un archivo


-Carpeta de imágenes y recursos no codificados en HTML. Esta carpeta es la que contendrá todos los elementos que no son de originalmente de código Web. Comúnmente esta carpeta es conocida como la carpeta de imágenes y usualmente se le nombra ima pero si desea puede guardarla con otro nombre.
-Presione el icono de carpeta que esta debajodel que usamos para seleccionar nuestra carpeta de raíz local y ubique dentro de la carpeta de raíz local su carpeta de imágenes y la selecciona

-por el momento esto es todo lo que necesitamos asi que presionaremos aceptar


Creación de Archivos HTML
-Pida un nuevo archivo HTML
-Lo que en este momento vemos es un archivo en blanco
-Vaya a la herramienta de archivo y guardara este archivoen blanco como index. Los sistemas de navegación Web identifican la pagina index como home, por lo tanto lo que estamos haciendo es crear nuestra pagina de inicio.

-Lo que haremos a continuación es encargarnos de la titulación de la pagina esto es poner el texto que se ve en el encabezado de los navegadores por lo general se usa un titulo que da una idea general del sitio (pruebe viendo unsitio Web)
Para titular la página lo hacemos en la ventana de texto señalada

Propiedades de la página
Ahora personalizaremos el sitio, diríjase a modificar y elija propiedades de la página
-cambie el color de fondo de su sitio. Tome un tiempo para ver las opciones que tiene esta ventana en las categorías de aspecto vinculo y encabezado


Guarde los cambios y duplique éste archivo cambiándoleel nombre a pagina_2 y pagina_3

Diseño y Navegación básica
Creación de Hipervínculos
-En cada una de las Páginas escriba el nombre de las otras paginas de su sitio
(Por ejemplo en la pagina_2 escriba inicio y pagina 3)
-Seleccione uno de los nombres que desea transformar en vínculos, diríjase al inspector de propiedades en la parte inferior de su pantalla

-Para vincular tenemos 3...