Etapa 1. Introducción a Dreamweaver y páginas web.

...

Para crear un sitio web sin conexión a internet se consta de dos partes: la primera es el conjunto de archivos situados en el equipo local y la ubicación del servidor web remoto. El método más utilizado para crear un sitio un web es crear y editar las páginas en el disco local.

El panel de archivo es uno de los paneles más importantes de Dreamweaver. Nos sirve para ver a la vez el sitio local y el sitio remoto y asi se sincroniza los archivos y poder compararlos.

Dreamweaver guarda el cache del sitio y se organiza en los archivos y se relacionan. Por eso si cambiamos el nombre de un archivo automáticamente actualizara todas las referencias a ese archivo. Si realizamos los cambios desde Dreamweaver las paginas no se mostraran como debería.

Las propiedades del documento este permite que se defina el formato de cada una de las paginas a través del cuadro de dialogo del mismo nombre.

Muchas de las propiedades de HTML y CSS son similares, la diferencia es que el CSS aplica a la configuración utilizando reglas de estilo mientras que las HTML lo hacen atributo estos ya en desuso porque se limita al contenido y no al diseño.

Colores:

Para asignar colores se necesita desplegar una paleta de colores, al hacer la selección se muestra el valor del color en la parte superior. La paleta de colores utiliza 216 seguros para la web esto es que se muestra igual en el navegador.

Los colores pueden ser personalizados desde el botón de comando de la parte superior de la paleta.

Los colores se asignan por medio de un botón los cuales aparecen en la ventana de inspector de propiedades de muchos de los objetos este botón nos permite un color.

Pero también lo podemos hacer desde la caja de texto que está al lado en el cual especificamos el valor del color que queramos aplicar.

Síntesis

Etapa 2. Uso de texto, imágenes y enlaces

En la etapa 2 empezamos a interactuar con Dreamweaver, el programa para diseñar páginas web más avanzada, haciendo nuestras páginas de algún tema en específico o tema libre utilizando de poco a poco cada una de las herramientas de Dreamweaver y al ir avanzando al hacer otra página nueva, las herramientas serían acumulativas y así nuestras páginas contarían con más cosas y mejores diseños. Para el uso de texto en nuestras páginas sus características pueden ser definidas mediante el inspector de propiedades, empezando con el formato que se le da a los encabezados, párrafos o pre formateados, donde los encabezados se utilizan para títulos dentro de la página que estamos creando. Continuamos con la fuente que es el tipo de letra que seleccionamos para nuestra página, ya sea que seleccionemos un tipo de fuente para toda la página o diferente para cada párrafo o como gusten. Para una mejor página, el texto se puede cambiar a diversos tamaños, de los cuales se pueden definir en pixeles, centímetros u otras medidas. En cuanto al color del texto, por defecto será negro, ya será decisión de nosotros quererlo cambiar o dejarlo así. El estilo establece si el texto se mostrará en negrita o en cursiva o de otras opciones como subrayar, tachado. Es posible acomodar el texto dentro de la página por medio de alinear, o bien, establecer un margen a ambos lados del texto con la sangría. Para una mejor página web utilizamos imágenes, Dreamweaver solo acepta imágenes de formatos jpg, gif, bmp, png, tiff, entre otros; pero no todos los formatos son la mejor opción para las páginas web pues algunas ocupan mucha memoria o no son compatibles con los navegadores y por esto, no se visualizan las imágenes. Los formatos que más se utilizan son gif, png y jpg. El formato gif es recomendable para dibujos que utilizan un mismo color o de tonos no continuos, más no están recomendados para fotografías ya que se pierden colores. El formato jpg puede contener millones de colores en un archivo comprimido de tamaño razonable. El formato png contiene varias versiones, el png 8 que es un formato de 256 colores muy similar al gif. El png 24 y png 36 hace un archivo de tamaño algo mayor. Para elaborar nuestra página es más recomendable es utilizar el formato gif o formato png para pequeños gráficos y jpg para fotografías. En Dreamweaver, las imágenes que utilizamos pueden ser modificadas y el cambio se aplica directamente sobre el archivo de la imagen, una de ellas es el seleccionar la imagen, arrastrar con el puntero de los recuadros negros que aparecen alrededor de la imagen. O también, por medio del inspector de propiedades, cambiando los campos de ancho y alto. También se le pueden aplicar vínculos y comportamientos sobre algunas partes de una imagen, uno de estos es el mapa de imagen que se crean directamente desde el inspector de propiedades. La apariencia del puntero del mouse cambia al posicionarlo sobre esta parte de la imagen, esta herramienta te permite asignar un vínculo y colocar de manera opcional un texto alternativo. Otra herramienta que utilizamos en las imágenes para nuestras páginas, es el rollover o imagen de sustitución que es cuando una imagen cambia por otra al colocar el puntero del mouse sobre ella. Esta opción se inserta por medio del menú Insertar, opción Objetos de imagen y la opción Imagen de sustitución, y ahí elijes la imagen original que será la imagen que se mostrará en la página al no estar el puntero del mouse sobre ella; y la imagen de sustitución que será la imagen por la que cambiará al pasar el puntero del mouse sobre la imagen original. En nuestra página, también creamos enlaces que nos permiten abrir una nueva página al hacer clic sobre ellos o trasladarnos a otra parte de la página donde nos encontramos. Para crear un enlace es posible desde el inspector de propiedades, pero es necesario seleccionar el texto que servirá como enlace y siguiendo dar un clic en Vínculo que forma parte del inspector de propiedades. Otra forma de crear un enlace es por medio de los hipervínculos, haciéndolo desde el menú Insertar y la opción Hipervínculo. Al utilizar enlaces dentro de nuestra página, podemos elegir el destino del enlace, es decir, en que ventana será abierto la página vinculada. De los tipos de destinos está el blank, abre el documento vinculado en una nueva ventana o pestaña del navegador. El parent que abre el documento vinculado en la ventana del marco que contiene el vínculo, el self que abre el documento vinculado en el mismo marco o ventana que el vínculo, y el top que abre el documento vinculado en la ventana completa del navegador. También es posible especificar vínculos a direcciones

...