Macromedia Dreamweaver

Transcripción

1 Macromedia Dreamweaver Grupo 5: URJC I.T.I.Sistemas Herramientas Case y 4GL Mónica Moral Narváez Nuria Fuentevilla del Haya Miguel Ángel López Molero

2 INDICE: Macromedia Dreamweaver Qué es Macromedia?. Qué es Dreamweaver?. Por qué Dreamweaver es una Herramienta CASE?. Dreamweaver como Herramienta de Diseño. Caso Práctico. Conclusiones y Dudas.

3 Qué es Macromedia? Macromedia (1992) era una empresa de software de gráficos y desarrollo Web (San Francisco, California). Adquirío Andromedia (análisis de tráfico) en En 2001 integró Allaire (desarrollo Web). En 2003 adquirió Presedia (conferencia por Web) y ehelp (software de ayuda de autoría). En diciembre de 2005, Adobe Systems adquiere Macromedia por unos millones de dólares. Sus productos son: Flash, Dreamweaver, Breeze, ColdFusion, Director, Authorware, FreeHand, Flex Fireworks, Robohelp, Shockwave, JRun, HomeSite, Flashpaper, FlashCast, Captivate, Studio 8...

4 Qué es Dreamweaver? Es un editor de páginas Web de tipo WYSIWYG (What You See Is What You Get) Lo Que Ves Es Lo Que Obtienes (LQVELQO). Si se cambia algo en la pantalla, los resultados se mostrarán de inmediato sin necesidad de un explorador Web. Acelerará tremendamente el flujo de trabajo. Oculta el código HTML de cara al usuario. Hace posible que alguien que no entienda de HTML pueda crear páginas y sitios Web fácilmente.

5 Por qué Dreamweaver es una herramienta CASE? La tecnología CASE es la automatización del desarrollo del software (proporcionando un conjunto de herramientas bien integradas que ahorren trabajo enlazando y automatizando todas las fases del ciclo de vida del software). Categorías CASE: Herramientas de Gestión (Dreamweaver NO). Herramientas Técnicas (Dreamweaver SI). Herramientas de Soporte (Dreamweaver PUEDE).

6 Por qué Dreamweaver es una herramienta CASE? Clasificación CASE en base a las fases del desarrollo: Upper CASE: fases de planificación, análisis de requisitos y estrategia del desarrollo (NO). Middle CASE: automatización de tareas en el análisis y diseño de la aplicación (PUEDE). Lower CASE: semiautomatización en la generación de código, detección de errores, depuración de programas y pruebas, documentación aplicación (SI).

7 Por qué Dreamweaver es una herramienta CASE? EN CONTRA: No genera análisis, no genera diagramas, no genera informes, no verifica las especificaciones, no genera documentación. A FAVOR: Si está integrada con otras aplicaciones (Flash, Navegadores, Shockwave, Applets, ActiveX, Plugins, FTP), si tiene estandarización del código, si reutiliza el código, si permite el mantenimiento, si tiene entornos de pruebas, si tiene mapas visuales de los sitios Web, si tiene un servicio de desarrollo remoto (RDS), si proporciona un acceso a cualquier Base de Datos y si tiene SourceSafe (seguridad al acceso al código fuente).

8 Características Trabajo con capas (layers). Amplio soporte para la tecnología CSS (hojas de estilos). Integración con otras aplicaciones, como Fireworks y Flash. Página de inicio para un mejor acceso a documentos, archivos y recursos.

9 Características Conexión FTP integrada en la aplicación. Comportamientos predefinidos para añadir funcionalidad de Javascript. Barra de inserción con acceso inmediato a los elementos principales. Alto nivel de personalización del espacio de trabajo.

10 Entorno de trabajo Es un entorno de trabajo con un sencillo manejo. Está basado en paneles que, juntos con las ventanas convencionales, configuran el cien por cien del espacio total sobre el que se trabaja.

11 PANELES

12 Paneles Los paneles son móviles, esto es, pueden moverse de un grupo de paneles a otro con gran facilidad. El Panel insertar y el inspector de propiedades aparecen como los paneles más importantes porque son el centro de control del diseño.

13 Paneles

14 En Dreamweaver tenemos varias Vistas para Documento, la Vista Diseño, la Vista Código y La vista Código y Diseño.

15 Los sitios Web Es el directorio donde esta la carpeta raíz, de la que cuelgan todos los archivos y carpetas del site. Es necesario crear y planificar el sitio Web antes crear las páginas que se van a crear.

16 Sitio Web

17 El texto en Dreamweaver Tiene un inspector de propiedades del texto. En Dreamweaver existen dos tipos de estilo, los CSS y HTML.

18 El texto en Dreamweaver CSS Las hojas de estilo CSS o en casada definen un grupo de atributos de formato que controla la apariencia de un rango definido de texto.

19 El texto en Dreamweaver HTML Con respecto a los estilos HTML, existen múltiples combinaciones.

20 Hiperenlaces Es posible asignar un vínculo a un texto, a una imagen, o a parte de una imagen. Existen dos tipos de vínculos: Relativos Absolutos

21 Hiperenlaces Puntos de fijación. Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Destinos: _blank _parent _self _top

22 Marcos Los marcos o frames sirven para distribuir mejor los datos de las páginas, ya que permiten mantener fijas algunas partes. Con ellos, los diseñadores pueden desarrollar espacios físicos de pantalla de carácter estático, mientras destinan un marco a la construcción de elementos dinámicos.

23 Formularios Se usan para que el usuario interaccione con la página Web.

24 Multimedia Flash: Podemos ver animaciones Flash, introduciendo el archivo.swf. Sonido: Se pueden introducir sonidos. Videos: Se pueden introducir vídeos.

25 Plantillas Sirven para seguir un formato uniforme. Facilitan la creación de páginas consistentes y la actualización automática de varias páginas cuando se realizan cambios. Para poder usarse han de tener zonas editables.

26 Los comportamientos Son un conjunto de extensiones basadas en JavaScript que le permiten añadir más interactividad a sus páginas. Hay dos componentes en los Comportamientos: el Evento y la Acción.

27 Otros Elementos que pueden diseñarse con Dreamweaver Marquesinas. Código de otras páginas. Adaptar una Web a distintas resoluciones.

28 Caso Práctico - Pasemos a ver el Caso práctico.

29 Conclusiones Dreamweaver es una buena herramienta CASE ya que proporciona un conjunto de características bien integradas que ahorran trabajo enlazando y automatizando algunas las fases del ciclo de vida del software, sobre todo en la fase Lower CASE. Las características que hacen de Dreamweaver una buena herramienta CASE son: CONEXIONES como FTP, RED LOCAL o RDS -> lo que permite trabajar en local durante el desarrollo de la aplicación sin que se produzcan errores en producción.

30 Conclusiones PLANTILLAS -> permite la fácil reutilización del código, sobre todo en la fase de mantenimiento del software. WYSIWYG -> permite visualizar inmediatamente el trabajo realizado sin necesidad de compilación, ahorrando tiempo de previsualización. AHORRO DE CÓDIGO y DE APRENDIZAJE DEL LENGUAJE -> con los Comportamientos de Dreamweaver se puede poner programación interna a las páginas sin necesidad de saber un lenguaje de programación. VISUAL SOURCE SAFE -> dando seguridad al código fuente para evitar posibles errores o fallos accidentales. Previniendo así errores malintencionados o accidentales del software. CONEXIÓN CON BASE DE DATOS -> permitiendo tener los contenidos del las paginas Web actualizados constantemente. Esto es de mucha ayuda en el mantenimiento del software.

31 Dudas