El documento describe las funciones y herramientas del software Dreamweaver CS3, incluyendo su facilidad de uso para crear páginas web profesionales sin programar código HTML manualmente. Se explican elementos como tablas, marcos, capas, hiperenlaces, imágenes, formularios y plantillas, así como cómo configurar sitios locales y remotos. También cubre temas avanzados como comportamientos, CSS y la creación de páginas dinámicas y blogs.

1. Dreamweaver CS3
ALUMNO: Mena garcia felix
PROFESOR: EMILIO FELIX ALBERTO

2. CONCEPTO:
• Es un software fácil de usar que permite
crear páginas web profesionales.

3. FUNCIONES:
• permiten agregar rápidamente diseño y
funcionalidad a las páginas, sin la necesidad
de programar manualmente el código HTML.
• Se puede crear tablas, editar marcos, trabajar
con capas, insertar comportamientos
JavaScript, etc., de una forma muy sencilla y
visual.

4. ELEMENTOS BASICOS DE
Dreamweaver CS3:
• la pantalla, las barras, los paneles, etc, para
saber diferenciar entre cada uno de ellos.
Aprenderemos cómo se llaman, dónde están y
para qué sirven. También veremos cómo
obtener ayuda, por si en algún momento no
sabemos cómo seguir trabajando. Cuando
conozcamos todo esto estaremos en
disposición de empezar a crear páginas web.

5. Configuración de un sitio local:
• En este tema vamos a ver qué es un sitio web,
cómo crearlos y gestionarlos, y cómo
modificar las propiedades de los documentos,
como puede ser el color de fondo.

6. El texto :
• Características del texto-. Las características
del texto seleccionado pueden ser definidas a
través del menú Texto, y a través del inspector
de propiedades.

7. Hiperenlaces:
• es más que un enlace, que al ser pulsado lleva
de una página o archivo a otra página o
archivo.
• Es posible asignar un vínculo a un texto, a una
imagen, o a parte de una imagen.

8. Tipos de enlaces:
• Referencia absoluta: Conduce al sitio en el que se encuentra
el documento utilizando la ruta completa del archivo.
• Referencia relativa al documento: Conduce a un documento
situado dentro del mismo sitio que el documento actual, pero
partiendo del directorio en el que se encuentra el documento
actual.
• Referencia relativa al sitio: Conduce a un documento situado
dentro del mismo sitio que el documento actual.
• Puntos de fijación: Conduce a un punto dentro de un
documento, ya sea dentro del actual o de otro diferente.
Para ello el vínculo debe ser
nombre_de_documento.extension#nombre_de_punto.

9. Imágenes:
• Para insertar una imagen hay que dirigirse al
menú Insertar, a la opción Imagen. Después
de esto, ya es posible seleccionar una imagen
a través de la nueva ventana.

10. Tablas:
• Todos los objetos se alinean por defecto a la izquierda de las páginas web,
pero gracias a las tablas es posible distribuir el texto en columnas, colocar
imágenes al lado de un bloque de texto, y otra serie de cosas que sin las
tablas serían imposibles de realizar.
• Las tablas están formadas por un conjunto de celdas, distribuidas en filas y
columnas. A continuación tienes un ejemplo de tabla.

11. Insertar una tabla:
• Para insertar una tabla hay que dirigirse al
menú Insertar, a la opción Tabla.

12. Marcos:
• Los marcos o frames sirven para distribuir mejor los datos de
las páginas, ya que permiten mantener fijas algunas partes,
como pueden ser el logotipo y la barra de navegación,
mientraMarcos que otras sí pueden cambiar.

13. • Los formularios se utilizan
para recoger datos de los
usuarios, nos pueden servir
para realizar un pedido en
una tienda virtual, crear una
encuesta, conocer las
opiniones de los usuarios,
recibir preguntas, etc.

14. Multimedia :
• Vamos a ver cómo insertar elementos multimedia. En
concreto, veremos cómo insertar una animación Flash, un
sonido y un vídeo.
• Las películas Flash son animaciones, que al igual que los
botones y el texto Flash, tienen la extensión SWF.
• También pueden insertarse pulsando sobre la opción Flash
que aparece en la pestaña Común del panel Insertar, botón
Media.

15. Las plantillas :
• Las plantillas son una especie de copia de la página en la que
van a estar basadas el resto de páginas del sitio web, pero que
incluyen la posibilidad de establecer unas zonas editables y
otras zonas que serán fijas, que no podrán ser modificadas.
• No es posible modificar las propiedades de una página
que está basada en una plantilla, a excepción del título.
Cuando se desea que existan páginas con, por ejemplo,
diferente color de fondo, es necesario crear plantillas
diferentes con los distintos colores, y basar las páginas en
una u otra plantilla, según el color de fondo que se desee
para cada una.

16. Crear plantillas :
Las plantillas pueden crearse desde cero, o a partir de una página ya existente.
Una forma de crear una plantilla desde cero es a través del panel Archivos, pestaña
Activos.
La pestaña Activos se puede abrir a través del menú Ventana, opción Activos. También
pulsando F11.

17. HTML desde Dreamweaver :
• En este tema vamos a ver algunas de las
facilidades que proporciona Dreamweaver
para trabajar sobre el propio código HTML, y
no únicamente sobre el editor gráfico de la
vista diseño.
• En este tema no se pretende enseñaros el
lenguaje HTML sino cómo poder realizar
algunos reajustes directamente en el código
estando dentro de Dreamweaver.

18. Capas:
Las capas no son más que unos recuadros, que
pueden situarse en cualquier parte de la página
(es decir, que tienen una posición absoluta en la
página), en los que podemos insertar contenido
HTML. Dichas capas pueden ocultarse y
solaparse entre sí, lo que proporciona grandes
posibilidades de diseño.
Las capas pueden moverse de una posición a
otra de la ventana pulsando sobre el recuadro
blanco, y sin soltar el ratón, arrastrándola hacia
la nueva posición.
También pueden ser redimensionadas pulsando
sobre los recuadros negros, y arrastrándolos
hasta conseguir el tamaño deseado.

19. Insertar una capa:
• Una capa puede
seleccionarse de varias
maneras. Una de ellas es
pulsando sobre el icono
correspondiente, pero
esto no resulta útil cuando
existen muchas capas en
un mismo documento, ya
que todas las capas tienen
asociada una imagen igual
a esta, y no es fácil
seleccionar la deseada a la
primera.

20. Comportamientos:
• Los comportamientos son acciones que suceden cuando los
usuarios realizan algún evento sobre un objeto, como puede ser
mover el ratón sobre una imagen, pulsar sobre un texto, hacer
doble clic sobre un mapa de imagen, etc.
• La imagen que aparece a continuación tiene asociado un
comportamiento. Sitúa el puntero sobre ella para ver qué es lo que
ocurre.

21. Abrir comportamientos:
• El panel
Comportamientos se
puede abrir a través
del menú Ventana,
opción
Comportamientos.
También pulsando
Mayús+F4.

22. Comportamientos Avanzados :
• En este tema veremos otros comportamientos y veremos cómo
utilizarlos y aprovecharnos de esta característica de Dreamweaver
para crear diversas funcionalidades automáticamente.
• Para crear un mensaje emergente deberás seleccionar el
elemento al cual irá asociado el mensaje, en el ejemplo es un
texto.
• Una vez seleccionado ves al panel Comportamientos (Mayus+F4)
pulsa el botón y selecciona la opción Mensaje emergente.
• Se abrirá el siguiente cuadro de diálogo:

23. Estilos CSS Avanzado :
• En este tema aprenderemos más sobre
CSS, pero orientándonos más a qué es
CSS y cómo crear estilos CSS para crear
páginas que sigan los fundamentos y
reglas marcadas por el W3C (Word
Wide Web Consortium).

24. Sitios Remotos :
• Definir un sitio remoto significa establecer una
configuración de modo que Dreamweaver sea capaz de
comunicarse directamente con un servidor en Internet
(por eso se llama remoto) y así poder trabajar a la vez
con tus archivos en el sitio local, es decir, la copia que
tienes en tu ordenador, y en el sitio remoto, colgados
en el servidor, en Internet.
• El modo en el que veremos que el programa se
comunica con tu servidor será FTP, ya que es
prácticamente el más utilizado y muy pocos utilizan
otras alternativas.

25. Configurar un Sitio Remoto
• Así que haz clic en Sitio y selecciona Administrar sitios.
• Selecciona el sitio con el que quieras establecer comunicación
remota (o crea uno nuevo para el caso) y pulsa Editar.
• Verás que se abre el cuadro de diálogo de Definición del Sitio.
• Ahora en el desplegable Acceso selecciona el método de acceso
que deberá utilizar Dreamweaver para conectarse con el
servidor. Como ya hemos dicho nosotros explicaremos la opción
FTP.
• Se mostrarán las siguientes opciones:

26. Servidor de Pruebas :
• PHP es un lenguaje de programación. Pero no te preocupes, Dreamweaver
contiene las suficientes herramientas como para manejarte sencillamente
sin que tengas que saber ni una línea de código.
• Hasta ahora nosotros creábamos páginas con extensión HTML, este tipo
de archivos, cuando son requeridos por un navegador se descargan
automáticamente del servidor y se visualizan tal y como son en el cliente
(el ordenador del usuario que está viendo la página).

27. Páginas Dinámicas :
• En esta unidad vamos a ver cómo utilizar Dreamweaver para
crear páginas PHP y acceder a datos almacenados en una base
de datos.
• Ahora que ya tenemos un servidor de pruebas donde pueda
ejecutarse el código que introduzcamos en nuestras páginas y
permita la creación de bases de datos para almacenar
información pasaremos a crear nuestras propias páginas
dinámicas de acceso a datos.
• Para ello nos apoyaremos siempre en la sección Datos de la
barra de herramientas Insertar:

28. Cómo crear un Blog:
• Un blog es una página web donde se introduce
contenido periódicamente sobre un tema en
particular.
• Su contenido suele organizarse en entradas que
se van añadiendo con una asiduidad relativa.
• Normalmente, estas entradas pueden
comentarse. Es decir, cualquier usuario (o a veces
solamente los registrados) pueden dejar su
opinión sobre la entrada o sobre el blog en
general.