La interfaz de trabajo de Dreamweaver

 

El espacio de trabajo de Adobe Dreamweaver CS6 contiene barras de herramientas, inspectores y paneles que nos permiten crear páginas Web. Si lo deseamos, podemos personalizar el aspecto general y el comportamiento del espacio de trabajo.

 

La Barra de Menú contiene opciones para ejecutar las distintas tareas del programa. La Barra de aplicación se incorporó en la versión anterior de Dreamweaver contiene las vistas de trabajo, un manejador de extensiones y un administrador de sitios. La Barra de Herramienta de documento contiene iconos que nos permiten cambiar entre las distintas vistas de edición, vistas previa en multipantalla, acceso al título de la página, o realizar las distintas opciones de validación que nos ofrece el programa.

Los paneles se agrupan al costado derecho de la ventana de documento, estos paneles contienen algunos comandos que son usados para el trabajo diario.

Los paneles pueden ampliarse y contraerse y desde el menú Ventana puede abrir cualquier panel que no esté visible. Para cerrar todos los paneles puede pulsar la tecla de función <F4>.También puede desacoplar un grupo de paneles sobre los puntos de sujeción y cuando el puntero se transforme en una cruz de flechas, arrastre el panel al lugar deseado. Para volver a acoplar haga la operación inversa.

El selector de etiquetas permite identificar y seleccionar diferentes objetos y sus etiquetas. Si el documento es una página vacía solo se verá la etiqueta <body>, pero a medida que la pagina tenga más contenido el selector ampliará la lista de etiquetas según dónde se sitúe el cursor.

El panel Inspector de propiedades muestra todas las propiedades y atributos del elemento seleccionado. Este es uno de los paneles más usados en el trabajo diario con Dreamweaver.

La ventana de documento ofrece el contenido actual del documento con que estamos trabajando.

Finalmente, la barra de estado que se encuentra debajo de la ventana de documento nos da información sobre el documento mismo.

 

Las vistas en Dreamweaver

El primer botón que aparece en la barra de Herramienta de Documento es la de Vista de Código. La vista de código permite trabajar con código de programación HTML, que es el verdadero esqueleto de la página.

A continuación se encuentra el botón Dividir, que divide la ventana en dos partes mostrando el código de programación y la vista de diseño. Luego se encuentra el botón Diseño, la vista de diseño permite trabajar con la representación gráfica de la página Web que se esté editando en ese momento.

La Vista en vivo, que es similar a la vista Diseño, muestra una representación más realista de la apariencia que tendrá el documento en un navegador y le permite interactuar con el documento de la misma forma que lo haría en un navegador. La Vista en vivo no es editable. No obstante, se puede realizar modificaciones en la vista Código y actualizar la Vista en vivo para ver los cambios.

La vista Código en Vivo Sólo está disponible al visualizar un documento en la Vista en vivo. La vista Código en vivo muestra el código que un navegador utiliza para ejecutar la página y cambia dinámicamente conforme se interactúa con la página en la Vista en vivo. La vista Código en vivo no es editable.

Vistas en Dreamweaver

Si se trabaja con XML, JavaScript, CSS u otros tipos de archivos basados en código, no se podrá ver los archivos en la vista Diseño y los botones Diseño y Dividir aparecerán atenuados.