entorno de dreamweaver 8 - claudia durán vargas 3 e

entorno de dreamweaver 8 - claudia durán vargas 3 e

TECNOLOGÍA DE LA INFORMACIÓN Y COMUNICACIÓN
ÁREA SISTEMAS INFORMÁTICOS
Entorno dreAMWEAVER
DESARROLLO DE APLICACIONES WEB I
Lic. RUBICELL PINEDA TELLEZ
ALUMNA: DURÁN VARGAS CLAUDIA
MATRICULA: 10292047
3”e”
15/JUNIO/2011
EEN
NTTO
ORRN
NO
OD
DEE D
DRREEAAM
MW
WEEAAVVEERR 88
1. Barra de
título
2. Barra de
menús
9. Paneles e
inspectores
3. Barra
Insertar
7. Barra de
herramientas
estándar
4. Barra de
herramienta de
documento
5. Barra de
herramientas
representación de
estilos
6. ventana de
documento
8. Barra de
estado
1.
Barra de título: contiene el nombre del programa (Marcromedia Dreamweaver 8) y seguidamente el nombre del documento que aparecerá en el
explorador y entre paréntesis, su ubicación y el nombre del archivo. En el extremo de la derecha están los botones para minimizar, maximizar/restaurar y
cerrar.
2.
Barra de menús: contiene las operaciones de Dreamweaver, agrupadas en menús desplegables.
3.
Barra Insertar: La barra Insertar contiene botones para la creación e inserción de diversos tipos de objetos, como tablas, capas e imágenes. Al pasar el
puntero sobre un botón, aparece una descripción de la herramienta con el nombre del botón.
Los botones están organizados en categorías, a las que puede cambiar en la parte izquierda de la barra Insertar. Si el documento actual contiene código
de servidor, como los documentos ASP o CFML, aparecen también otras categorías. Cuando se inicia Dreamweaver, se abre la última categoría con la
que ha trabajado.
La barra Insertar está organizada en las categorías siguientes:
NOMBRE
Hipervínculo
Vinculo de correo
electrónico
Anclaje con nombre
Tabla
Insertar etiqueta
DIV
GRAFICO
DESCRIPCIÓN
El comando Hipervínculo permite crear un vínculo de texto hasta una imagen, un
objeto u otro documento o archivo.
Cuando el usuario hace clic en un vínculo de correo electrónico se abre una nueva
ventana de mensaje en blanco. En la ventana de mensaje de correo electrónico, el
cuadro de texto Para se rellena automáticamente con la dirección especificada en el
vínculo del mensaje de correo electrónico.
Permite establecer marcadores en un documento, que a menudo se colocan en un
tema específico o en la parte superior del documento. Posteriormente podrá crear
vínculos con esos anclajes con nombre que llevarán rápidamente al visitante a la
posición especificada.
Este inspector de propiedades permite establecer las propiedades de las tablas.
Esta etiqueta se puede utilizar para crear bloques de diseño CSS e insertarlas en el
documento.
Imágenes
Media
Fecha
Server-Side Include
Comentario
Plantillas
Selector de
etiquetas
4.
Este inspector de propiedades permite establecer las propiedades de una imagen. Si
no ve todas las propiedades de imagen como se muestran a continuación, haga clic
en la flecha de ampliación situada en la esquina inferior derecha.
Puede insertar archivos SWF u objetos de Flash, películas QuickTime o Shockwave,
applets de Java, controles ActiveX y otros objetos de audio o vídeo en un documento
de Dreamweaver.
Dreamweaver proporciona un objeto Fecha que permite insertar la fecha actual con
el formato que prefiera y ofrece la posibilidad de actualizarla cada vez que guarde el
archivo.
Un server-side include es un archivo que el servidor incorpora en el documento
cuando un navegador solicita el documento del servidor.
Un comentario es un texto descriptivo que se inserta en el código HTML para explicar
el código o facilitar otra información. El texto del comentario aparece sólo en la vista
Código y no se muestra en los navegadores.
Puede crear plantillas mediante Dreamweaver para ayudar a los usuarios de
Macromedia Contribuye a crear nuevas páginas, lograr un aspecto coherente para el
sitio y permitir una actualización del diseño de muchas páginas a la vez.
El Selector de etiquetas se utiliza para ajustar una etiqueta div alrededor de una de
las imágenes de la página.
Barra de herramienta de documento: La barra de herramientas de Documento contiene botones que permiten alternar entre diferentes vistas del
documento rápidamente: vista Código, vista Diseño y una vista dividida que muestra las vistas Código y Diseño.
La barra de herramientas contiene también algunos comandos y opciones relativos a la visualización del documento y a su transferencia entre los sitios local y
remoto.
En la barra de herramientas de Documento, aparecen las siguientes opciones:
Mostrar vista de código sólo muestra la vista Código en la ventana de documento.
Mostrar vistas de código y diseño muestra la vista Código en una parte de la ventana de documento y la vista Diseño en la otra parte. Cuando seleccione esta
vista combinada, se encontrará disponible la opción Vista de diseño encima del menú Ver. Utilice esta opción para especificar qué vista debe aparecer en la parte
superior de la ventana de documento.
Mostrar vista de diseño sólo muestra la vista Diseño en la ventana de documento.
Depuración del servidor muestra un informe que le ayudará a depurar la página de ColdFusion actual. El informe contiene los errores de la página, si los hay.
Título del documento permite introducir un título para el documento, que aparecerá en la barra de título del navegador. Si el documento ya tiene título, éste
aparecerá en dicho campo.
No hay errores de comprobación de navegador permite comprobar la compatibilidad con distintos navegadores.
Validar formato permite validar el documento actual o una etiqueta seleccionada.
Administración de archivos muestra el menú emergente Administración de archivos.
Vista previa/Depurar en explorador permite ver una vista previa del documento o depurarlo en un navegador. Seleccione un navegador en el menú emergente.
Actualizar vista de diseño actualiza la vista Diseño tras realizar cambios en la vista Código. Los cambios realizados en la vista Código no aparecerán de forma
automática en la vista Diseño hasta que se efectúen determinadas acciones, como guardar el archivo o hacer clic en este botón.
Ver opciones permite definir las opciones de las vistas Código y Diseño, y establecer qué vista va a aparecer en la parte superior de la ventana. Las opciones del
menú corresponden a la vista actual: la vista Diseño, la vista Código o ambas.
Ayudas visuales permite utilizar distintas ayudas visuales para el diseño de las páginas.
5.
Barra de herramientas representación de estilos: La barra de herramientas Representación de estilos (oculta de manera predeterminada) contiene
botones que le permiten ver cómo aparecería el diseño en distintos tipos de medios si utilizase hojas de estilos dependientes de los medios. También
contiene un botón con el que es posible activar o desactivar los estilos CSS. Para mostrar la barra de herramientas, seleccione Ver > Barras de
herramientas > Representación de estilos.
Esta barra de herramientas sólo funciona si los documentos utilizan hojas de estilos dependientes de los medios. Por ejemplo, su hoja de estilos puede especificar
una regla para imprimir y otra regla distinta para los dispositivos de mano.
6. Ventana de documento: La ventana de documento muestra el documento actual. Puede elegir entre una de las vistas siguientes:
Vista Diseño Un entorno para el diseño visual de la página, la edición visual y el desarrollo rápido de aplicaciones. En esta vista, Dreamweaver
muestra una representación visual del documento completamente editable, similar a la que aparecería en un navegador.
Vista Código Un entorno de codificación manual para escribir y editar código HTML, JavaScript, código de lenguaje de servidor, como por ejemplo
PHP o ColdFusion Markup Language (CFML), y otros tipos de código.
Vista de código dividida Versión dividida de la vista Código que le permite desplazarse por el trabajo realizado en diferentes secciones del
documento a la vez.
Vistas Código y Diseño Le permite ver las dos vistas, Código y Diseño, para el mismo documento en una sola ventana.
Vista en vivo 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, puede realizar modificaciones en la vista Código y actualizar la Vista en vivo para ver los cambios.
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.
7.
Barra de herramientas estándar: Contiene botones para las operaciones más habituales de los menús Archivo y Edición: Nuevo, Abrir, Examinar en
Brigde, Guardar, Guardar todo, Imprimir código, Cortar, Copiar, Pegar, Deshacer y Rehacer. Estos botones se utilizan del mismo modo que los
comandos de menú equivalentes.
8. Barra de estado: La barra de estado, situada en la parte inferior de la ventana de documento, proporciona información adicional sobre el
documento que está creando.
9.
Dreamweaver utiliza ventanas flotantes similares a las barras de herramientas, que se conocen como paneles o
inspectores. La diferencia entre panel e inspector es que, en general, la apariencia y opciones de un inspector cambian dependiendo del
objeto seleccionado.
Paneles e inspectores:
A través de la opción Ventana, de la barra de menús, es posible mostrar u ocultar cada uno de los paneles o inspectores.
REFERENCIAS: AYUDA DE DREAMWEAVER
http://help.adobe.com/es_ES/Dreamweaver/