JAVIER VELAZCO PEREZ Concepto de Dreamweaver:

6E

Adobe Dreamweaver CS5.5 es la aplicacin que lidera el sector de la edicin y creacin de contenidos web. Proporciona funciones visuales y de nivel de cdigo para crear diseos y sitios web basados en estndares para equipos de sorbremesa, SmarPhone, tabletas y otros dispositivos.

Requisitos del sistema para Dreamweaver CS5 Windows

Procesador Intel Pentium 4 o AMD Athlon 64 Microsoft Windows XP con Service Pack 2 (se recomienda Service Pack 3); Windows Vista Home Premium, Business, Ultimate o Enterprise con Service Pack 1, o bien, Windows 7. 512 MB de RAM 1 GB de espacio disponible en disco duro para la instalacin; se requiere espacio libre adicional durante la instalacin (no se puede instalar en dispositivos de almacenamiento extrables basados en flash) Resolucin de pantalla de 1.280 x 800 con tarjeta de vdeo de 16 bits Unidad de DVD-ROM Se requiere una conexin a Internet de banda ancha para los servicios en lnea*

Elementos que conforman la interfaz de dreamweaver: Interfaz de Dreamweaver CS5

Pantalla de Bienvenida

Desde la pantalla de bienvenida, podemos, desde abrir un elemento reciente, en el que estemos trabajando, abrir un documento que queremos aadir, o manipular, crear documentos nuevos en diferentes formatos (html, php, xml, javascript,etc) y elementos destacados. Los elementos destacados, pueden ser muy tiles, ya que

JAVIER VELAZCO PEREZ

6E

son videos de mtodos de trabajo o la utilizacin de algunas herramientas especficas. Si quisiramos no ver la pantalla de bienvenida al iniciar Dreamweaver CS5, iramos a Edicin->Preferencias->General->Opciones de documento, y deseleccionamos la casilla de Mostrar pantalla de bienvenida, clicamos en aceptar y ya no la veremos al iniciar, si queremos volverla a ver, solo tendremos que hacer la misma operacin a la inversa. Barra insertar Podemos encontrar la barra insertar, que se muestra en la imagen de abajo. Una barra muy til, ya que la mayora de herramientas que utilizaremos, estn en ella o las podemos aadir, esto nos facilita el no tener que ir buscando las herramientas en las diferentes ventanas.

Como en la mayora de barras, pueden ser personalizadas, aunque con limitaciones. Como vemos en la imagen de abajo, vemos que podemos verla como men o como fichas que es, como se encuentra en la imagen de arriba.

Como men, vemos que el aspecto ha cambiado, ya no tenemos las pestaas que nos indicaban las herramientas de otras secciones, como formularios, datos, spry, etc.

Pero si clicamos en el tringulo invertido que se encuentra al lado de comn, veremos que encontramos en forma de men, las pestaas que contena en el modo de fichas.

JAVIER VELAZCO PEREZ Barra de herramientas del documento

6E

En la barra de herramientas del documento, se pueden ver aspectos esenciales, que profundizaremos en tutoriales posteriores. Describiremos a groso modo la barra y las herramientas ms significativas. Como vemos, encontramos el botn Diseo seleccionado, est es la vista que normalmente utilizaremos, para personas que controlen el cdigo html, algn lenguaje de programacin o simplemente se quiere ver el cdigo. Existen dos maneras de verlo, una como vemos en la imagen superior, encontramos el botn Dividir, pulsando ese botn, veremos la pantalla dividida, viendo en una parte el diseo y en otra el cdigo. Y la otra, pulsando el botn Cdigo, en el que veremos solamente el cdigo de la pgina y perderemos de vista el diseo. Ms adelante encontramos una bola del mundo donde podemos agregar los diferentes navegadores en los que queremos ver la pgina, aunque normalmente ya nos reconoce los que tenemos instalados. Pulsando sobre el o pulsando la tecla F12, veremos en el navegador el resultado del trabajo que estamos realizando. Tambin vemos una caja de texto donde pone Documento sin ttulo all escribiremos el ttulo que pondremos a la pgina y que al pulsar F12 veremos nos aparece en la pestaa del navegador o en la parte de arriba de la ventana del mismo. Inspector de Propiedades

En el inspector de propiedades como vemos en la imagen de arriba, podemos visualizar y cambiar las propiedades de los estilos CSS, que en posteriores artculos explicaremos.

Tambin podemos apreciar que nos aparecen propiedades de la parte del documento, donde podemos aplicar etiquetas HTML que personalicen nuestro trabajo. El inspector de propiedades es una de las partes que se convertir en imprescindible en el proceso de un diseo web.

JAVIER VELAZCO PEREZ

6E

Paneles y grupos de paneles

A la derecha de la pantalla, podemos apreciar que nos aparece un grupo de smbolos, eso son los paneles en los que podemos encontrar los documentos que vamos creando, los comportamientos que podemos, o hemos aplicado, los CSS creados.

Para visualizarlo mejor, podemos desplegarlo como vemos en la imagen de arriba, pulsando en las dos flechas situadas en la parte superior derecha del grupo de paneles. As podremos trabajar viendo todo lo que contienen los paneles, si nos molestase para trabajar, mejor dejarlo plegado y pulsar en el icono del panel que necesitemos en cada momento.

JAVIER VELAZCO PEREZ

6E

Mltiples documentos

Conforme vayamos trabajando, iremos creando diferentes documentos, y en ocasiones, podemos querer tener varios de ellos abiertos, como apreciamos en la imagen de arriba, nos aparecen fichas con los diferentes documento abiertos o creados. Con tan solo pulsar en las diferentes pestaas, podemos navegar por ellos sin ningn problema.