UNIVERSIDAD AUTNOMA DE BAJA CALIFORNIA

Departamento de Informacin Acadmica

DREAMWEAVER CS3
Gua Rpida

Delia Esquer Melndez

desquer@uabc.mx

Ensenada, Baja California Enero 2009

INTRODUCCIN
1. Qu es un editor de pginas web?
Los editores web son aplicaciones de software que sirven para desarrollar pginas web. Hay tres tipos de editores web: - Editores web de texto: estos ayudan al desarrollador en la escritura del cdigo HTML (y otros cdigos de lenguajes web), proveyendo distintos colores al texto de forma automtica, acceso a cdigos ya definidos, ayuda de asistentes, etc. Editores web de objetos: estos alternan entre la edicin de texto y el uso de objetos para el desarrollo de una pgina web. Editores web grficos o WYSIWYG: estos proveen una interfaz grfica, donde es posible modificar y ver la pgina web tal cual se ver en un navegador. Son los editores ms fciles de utilizar.

WYSIWYG

- Permiten escribir un documento viendo directamente el resultado final.

What You See Is What You Get

2. Qu es Dreamweaver?
Dreamweaver es un software fcil de usar que permite disear, crear y desarrollar pginas web profesionales. Las funciones de edicin visual de Dreamweaver permiten agregar rpidamente diseo y funcionalidad a las pginas, sin la necesidad de programar manualmente el cdigo HTML. Se puede crear tablas, editar marcos, trabajar con capas, insertar comportamientos JavaScript, etc., de una forma muy sencilla y visual. Adems incluye un software de cliente FTP completo, permitiendo entre otras cosas trabajar con mapas visuales de los sitios web, actualizando el sitio web en el servidor sin salir del programa. Esta aplicacin permite crear sitios de forma totalmente grfica, y dispone de funciones para acceder al cdigo HTML generado. Permite la conexin a un servidor, a base de datos, soporte para programacin en ASP, PHP, Javascript, cliente FTP integrado, etc. Este producto pertenece al grupo Adobe el cual en la actualidad es el grupo ms fuerte en lo que a desarrollo web se refiere.

Dreamweaver CS3

UABC

Delia Esquer Melndez

desquer@uabc.,mx

Iniciar sesin de Dreamweaver

- Inicio (Start) - Todos los Programas (All Programs) - Adobe Web Premiun CS3 - Adobe Dreamweaver CS3 Crear un archivo nuevo

Abrir un archivo existente

ENTORNO DE TRABAJO
Los mens y las ventanas de DW
Barra de ttulo Men Principal

Barra de edicin de archivo

rea de Trabajo

Inspector de Propiedades

Dreamweaver CS3

UABC

Delia Esquer Melndez

desquer@uabc.,mx

Barra de edicin de archivo

La barra de edicin de archivo se encuentra inmediatamente despus de la pestaa que contiene el nombre del archivo en edicin y se administra de manera individual, conteniendo los siguientes elementos:

Barra de estado
La barra de estado se encuentra al final de la ventana de edicin de cada archivo, conteniendo lo siguientes elementos:

PROPIEDADES DE LA PGINA
Tipo de letra

Tamao de letra Color de texto Color de fondo de pgina

Imagen de fondo Repetir imagen de fondo

Dreamweaver CS3

UABC

Delia Esquer Melndez

desquer@uabc.,mx

LOS ELEMENTOS BSICOS EN UNA PGINA WEB

Qu puede contener una pgina web?
Insertar: Directamente desde teclado Modificar Propiedades: Seleccionar el texto / Ventana de propiedades

TEXTO

Insertar: Insertar (Insert) > Imagen (Image) Modificar Propiedades: Ventana de propiedades

IMAGEN

Insertar: a) Seleccionar texto/imagen, b) Insertar liga o enlace en ventana de propiedades en el recuadro de Vnculo (Link)

LIGAS O ENLACES

Insertar: a) Insert (Insertar) > Table (Tabla) b) Especificar nmero de filas y columnas Modificar: Men Contextual (botn derecho), Seleccionar: Table (Tabla) Agregar filas/columnas: a) Men Contextual (botn derecho) b) Seleccionar: Tabla (Table)

TABLAS

Dreamweaver CS3

UABC

Delia Esquer Melndez

desquer@uabc.,mx

c) Insertar Fila/Columna (Insert Row/Column) Propiedades

Qu ms puede tener una pgina Web? Elementos interactivos - Imgenes de sustitucin (rollover) - Mapas sensibles - Botones de Flash - Texto de Flash - Mens emergentes Multimedia Msica Sonido Video Flash Capas (layers) Formularios

VISUALIZACIN DE UNA PGINA WEB

Cmo veo una pgina web en el navegador?
a)File (Archivo) > Preview in Browser (Vista preliminar) b) Tambin se puede pre-visualizar por medio del cono: c) Utilizando la tecla F12

MANEJO DE ARCHIVOS
Salvar archivo Abrir archivo
File (Archivo) > Save (Salvar)

File (Archivo) > Open (Abrir)

Salir de Dreamweaver

File (Archivo) > Exit (Salir)

UABC Delia Esquer Melndez desquer@uabc.,mx

Dreamweaver CS3