Dreamweaver CS5Diego Mariano Espinosa Casso

Dreamweaver CS5 es un software fácil de usar que permite crear páginas web profesionales. Se puede crear tablas, editar marcos, trabajar con capas, insertar comportamientos JavaScript, etc.., de una forma muy sencilla y visual.

¿Qué es?

Compatibilidad con CMS integrada. Es una interfaz o programa que nos permite gestionar el contenido de un sitio web.

Novedades

Integración Adobe Browserlab, es un servicio en línea de Adobe, que nos permite comparar cómo se ve una misma página web en las distintas versiones de Internet Explorer, Firefox y Safari, bajo los sistemas operativos de Windows o Mac OS.

Editar páginas web Crear páginas web mediante el código HTML es más costoso que hacerlo utilizando un editor gráfico. Hoy en día existe una amplia gama de editores de páginas web, como pueden ser Microsoft Expresion Web, Amaya, Bluefish, NVU, KompoZer o Quanta Plus.

Para poder poner una página web en Internet, es necesario contratar a alguna empresa con servidores que pueda alojarla y hacerla accesible desde Internet las 24 horas del día.

No se recomienda utilizar hospedaje gratuito para la página de una empresa, aunque sí es aceptable para una página personal, sobre todo al comienzo.

Funciones

Pantalla inicialAl arrancar Dreamweaver aparece una pantalla inicial como ésta, la pantalla que se muestra a continuación puede no coincidir exactamente con la que ves en tu ordenador, ya que cada usuario puede decidir qué elementos quiere que se vean en cada momento y dónde.

Entorno gráfico

Barras

Barra de la aplicaciónSi tenemos la ventana maximizada veremos todos los elementos de la barra ocupando una sola línea, si no, ocuparán dos líneas, como en la imagen superior. Esta barra contiene los siguientes elementos: los menús (en la imagen, en la parte inferior), varios botones propios de la aplicación, el conmutador de espacio de trabajo y una caja de búsquedas para obtener ayuda on line.

MenúsBotones ConmutadorCaja de búsquedas

Pestañas de documentoCada archivo que tengamos abierto, mostrará una pestaña con su nombre, lo que nos permitirá cambiar de uno a otro fácilmente. Si junto al nombre aparece un *, indica que ese archivo tiene cambios sin guardar.

Barra de estadoEsta barra la encontramos debajo de la ventana de documento, y nos da información sobre el mismo. A la izquierda, encontramos el selector de etiquetas. Nos sirve para seleccionar etiquetas completas. Siguiendo hacia la derecha encontramos las herramientas de Selección, Mano (para desplazarse) y Zoom. Y otros datos como el tamaño de la ventana, el tamaño de la página o su codificación.

Barra de herramientas estándarLa barra de herramientas estándar contiene iconos para realizar las acciones más habituales del menú Archivo y Edición. De izquierda a derecha: Nuevo archivo, Abrir, explorar con Adobe Bridge, Guardar, Guardar todo, Imprimir el código fuente, Cortar, Copiar, Pegar, Deshacer y Rehacer.

Barra de herramientas de documentoContiene iconos que nos permiten cambiar entre las distintas vistas de edición y la vista en vivo, acceder cómodamente al título de la página, o realizar las distintas opciones de validación que nos ofrece el programa.

Barra de representación de estilosEsta barra, menos utilizada, nos permite ver la apariencia de nuestra web en distintos dispositivos, si estamos utilizando hojas distintas que dependan de eso. En esta nueva versión se han añadido más opciones, como las de ver los estilos que dependen de pseudo clases activas, como cuando el cursor está sobre un elemento.

Barra de navegación con navegadorEsta barra nos permite usar Dreamweaver como un navegador web y navegar por las páginas de nuestro sitio, aunque sólo tiene sentido con la Vista en vivo.

Vista de diseñoLa vista Diseño permite trabajar con el editor visual. Nos ofrece un aspecto muy similar al resultado final, pero totalmente editable.

Vistas de un documento

Vista CódigoLa vista Código se utiliza para poder trabajar en un entorno totalmente de programación, de código fuente. No permite tener directamente una referencia visual de cómo va quedando el documento según se va modificando el código.

Vista DividirLa vista Dividir permite dividir la ventana en dos zonas: Código y Diseño. La zona izquierda muestra el código fuente, y la derecha el editor visual. Cuando se realiza un cambio en alguna de las zonas, este cambio se aplica directamente sobre la otra.