sábado, 18 de enero de 2014

Adobe Dreamweaver



Qué es Adobe Dreamweaver

Dreamweaver es un software permite crear páginas web profesionales sin la necesidad de  programar manualmente el código HTML con el que se construyen dichas páginas.

¿PARA QUE SIRVE ADOBE Dreamweaver?
Adobe Dreamweaver es una aplicación en forma de estudio (basada en la forma de estudio de Adobe Flash) que está destinada a la construcción y edición de sitios y aplicaciones Web basados en estándares. Creado inicialmente por Macromedia (actualmente producido por Adobe Systems) es el programa de este tipo más utilizado en el sector del diseño y la programación web, por sus funcionalidades, su integración con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium. Su principal competidor es Microsoft Expression Web y tiene soporte tanto para edición de imágenes como para animación a través de su integración con otras.

HISTORIA de Adobe  DreamWeaver 


Es un producto de la empresa desarrolladora de software Macromedia, que nació en 1992 tras la fusión de Authorware Inc. (creadora de Authorware) y Macro – Mind Paracomp (responsable de director). El primer producto de esta nueva compañía fue Shockware, un plugin para los navegadores que permitía ver animaciones hechas en Director. A causa del éxito que tuvo, la empresa decidió que debía expandirse más en el sector web y multimedia,
Con esta expansión como objetivo primario, en 1996, Macromedia realizo dos grandes adquisiciones. La primera fue la empresa FutureWave software, creadora del FutureSplash, al que Macromedia rebautizo como flash. La segunda fue iBand software, creadora de Backstage, un programa de edición de HTML, al que Macromedia rebautizo, con algunos cambios, como DREAMWEAVER, del que lanzo su primera versión en 1997. A partir de 1998, Macromedia comenzó a desarrollar una versión del programa por año. En cada una de ellas, agrego componentes clave para un mejor desarrollo de archivo de HTML y de otras expresiones (ASP, PHP, JPS, etcétera). En el año 2006, la empresa fue comprada por Adobe, quien absorbió completamente el nombre Macromedia. Por ello es que la versión CS3 ya no es más Macromedia, sino Adobe. 

Cómo funciona  el Interfaz de Adobe DreamWeaver

A lo largo de las páginas de este documento iremos desarrollando los diferentes aspectos del diseño de páginas web, combinando tanto las herramientas propias de dreamweaver (DW de ahora en adelante), y recurriendo al código puro y duro en aquellos casos donde sea necesario.


Barra de herramientas

La barra de herramientas nos permite insertar diferentes elementos en nuestro documento. En muchos casos nos ofrece un acceso rápido y cómodo a ciertas funciones del DW.
En el caso de que alguna vez tengamos que activarla (podemos cerrarla accidentalmente), debemos hacerlo desde el Menú Ver > Barras de herramientas > Insertar



La barra de herramientas nos ofrece varias opciones. Según la visualización que escojamos nos aparecerán diferentes herramientas, específicas para cada caso.
En el apartado "Común", que aparece por defecto al abrir el programa por primera vez tenemos las opciones más generales: crear tablas, puntos de ancla, insertar imágenes o crear imágenes de sustitución son las que mejor funcionan.

Herramientas de DW

Tengamos en cuenta que no todas las opciones de la barra de herramientas son recomendables. Destacamos insertar formularios  porque DW lo hace de manera aceptable, evitando que escribamos código. Pero en otros casos, DW genera código inadecuado. Aprender a controlar nuestro código es tan fundamental como saber para qué sirven las herramientas del programa.
Si pulsamos "Común" para desplegar las opciones de la barra, tendremos acceso al resto de herramientas propias de cada apartado. Uno de los más útiles para evitarnos escribir código es el de Formulario


Desde aquí podemos definir qué tipo de elementos deseamos para nuestro formulario, insertar campos para pedir información al usuario y botones que validen la información, de tal manera que llegue a nuestro correo. Para más información, consulta el apartado  sobre formularios.

¿Código o diseño?

Como ya te habrás dado cuenta, estamos haciendo mención a un buen uso del código XHTML. Esto es importante para no generar un resultado a partir de una etiqueta inadecuada. Puedes consultar más acerca de este tema.
Por tanto, desde aquí aconsejamos utilizar el doble espacio de trabajo que nos ofrece DW. ¿Qué es esto?
Básicamente, se trata de una opción que nos permite trabajar en el documento bien a nivel de código, bien sólo en modo diseño (la apariencia de la web).
Nosotros sugerimos la tercera opción: el modo dividir


De esta manera visualizamos diseño y código al mismo tiempo. Esta opción se encuentra en la barra de herramientas "Documento", a la que accedemos desde el menú Ver > Barras de herramientas > Documento.

Vista de código

Cuando navegamos por internet podemos solicitar al navegador que nos muestre el código fuente de una página para saber cómo está hecha. Cuando trabajamos en nuestro documento en modo dividir también tenemos ese código a mano.
Por defecto, DW suele mostrar el código ocupando tanto ancho como sea necesario. Esto puede generar líneas de código interminables e incómodas de leer.
Para solucionar esto debemos activar una opción que permite visualizar el código según el ancho del área de trabajo, de tal manera que no habremos de recurrir a las barras de desplazamiento horizontales.
A esta opción llegamos desde el menú Ver > Opciones de vista de código > Ajustar texto.

Paletas de trabajo

A medida que vayamos experimentando con DW y dominemos mejor el código necesitaremos nuevas herramientas que nos aporten nuevas posibilidades.
Una de las primeras aspiraciones es, por supuesto, la de colgar nuestra web para que esté accesible en la red y pueda ser visitada. Podemos también usar la paleta de los estilos CSS para gestionarlos desde nuestro documento, o crear comportamientos.
También surgirá la idea de crear un pop-up o abrir una nueva ventana mostrando en detalle alguna foto o cualquier otra cosa. Y a medida que queramos dar consistencia a nuestra página nos vendrá bien aplicar los estilos CSS de manera más rápida que tecleando en código.
Muchas de estas operaciones se realizan desde las paletas que nos ofrece DW. Todas ellas pueden activarse desde el menú Ventana.

vídeo de los primeros pasos de DreamWeaver 



Bibliografía

No hay comentarios:

Publicar un comentario