Trabajo Sobre Dreamweaver

8/16/2019 Trabajo Sobre Dreamweaver

http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 1/12

Republica Bolivariana de Venezuela

Ministerio del Poder Popular para la Educación Superior

Universidad Bicentenaria de Aragua

Ingeniería en Sistemas

ESA!"

Integrante#

Pedro $uis Aguilera %odo&

'urmero( )* de Abril de )+,-



Dreamweaver

,. /e0inición

Dreamweaver es un editor de páginas Web, que nos permite diseñar

páginas de un modo muy sencillo sin saber programar directamente en los

distintos códigos que utiliza. Además facilita el maneo general del programa para

maquetar páginas Web, aumentando la productividad de forma notable.

!tra forma de e"plicar lo que es Dreamweaver es esta, es una opción para

la creación de sitios y aplicaciones web. #roporciona una combinación potente de

$erramientas visuales de disposición, caracter%sticas de desarrollo de aplicaciones

y soporte para la edición de código.

). 1istoria

&s un producto de la empresa desarrolladora de software 'acromedia, que

nació en ())* tras la fusión de Aut$orware +nc. creadora de Aut$orware- y 'acro

'ind #aracomp responsable de director-. &l primer producto de esta nueva

compañ%a fue /$oc0ware, un plugin para los navegadores que permit%a ver

animaciones $ec$as en Director. A causa del 1"ito que tuvo, la empresa decidióque deb%a e"pandirse más en el sector web y multimedia,

2on esta e"pansión como obetivo primario, en ())3, 'acromedia realizo

dos grandes adquisiciones. 4a primera fue la empresa 5utureWave software,

creadora del 5uture/plas$, al que 'acromedia rebautizo como flas$. 4a segunda



fue i6and software, creadora de 6ac0stage, un programa de edición de 78'4, al

que 'acromedia rebautizo, con algunos cambios, como D9&A'W&A:&9, del que

lanzo su primera versión en ());. A partir de ())<, 'acromedia comenzó a

desarrollar una versión del programa por año. &n cada una de ellas, agrego

componentes clave para un meor desarrollo de arc$ivo de 78'4 y de otras

e"presiones A/#, #7#, =#/, etc1tera-. &n el año *>>3, la empresa fue comprada

por Adobe, quien absorbió completamente el nombre 'acromedia. #or ello es que

la versión 2/? ya no es más 'acromedia, sino Adobe.

2. 3aracterísticas #ermite crear páginas web avanzadas o profesionales.

/oporta gran cantidad de tecnolog%as fáciles de usar.

/e actualiza con componentes.

&l código generado es de buena calidad.

Al ser tan avanzado puede resultar dif%cil para algunos usuarios ine"pertos.

#roveniente de la familia 'acromedia@Adobe.

#ermite crear sitios totalmente gráficos.

#ermite agregar diseño y funcionalidad a la página.

#ermite trabaar con tablas, marcos, capas, comportamientos, =avascript.

4. Venta5as & /esventa5as

Venta5as



&s muy bueno para trabaos profesionales.

Destaca su soporte de los estándares del World Wide Web 2onsortium

tiliza la tecnolog%a web como 2// y =ava /cript.

/e puede diseñar y crear páginas web sin conocimiento de código 78'4.

#ermite pre visualizar las páginas web en casi todos los navegadores web.

#ermite el uso de e"tinciones como 78'4 y =ava /cript. 4o puede utilizar cualquier usuario para crear webs sin ser profesional.

#ermite el uso de e"tensiones, que son pequeños programas que cualquier

usuario puede escribir, descargar e instalar, ofreciendo funcionalidades

añadidas a la aplicación. 4os arc$ivos del programa son rutinas de =avascript y $ace que sea un

programa fluido. &stá disponible para 'A2, Windows y tambi1n se puede eecutar en otras

plataformas. Bos permite ver los cambios que efectuamos a la vez que los realizamos.

/esventa5as

/e paga por la licencia del programa.

8erminada la web a$i se tiene que publicar y para eso $ay que pagar

$osting y nombre de dominio. &l precio es muy elevado si se quiere comprar dentro de lo legal y no se

puede comprar por separado se tiene que comprar la suite completa.

Al ser un programa tan avanzado su maneo puede resultar complicado

para usuarios no e"perimentados.

6. 1istorial de versiones



-. Re7uisitos mínimos en el sistema #rocesador +ntelC #entiumC o A'D At$lonC de 3 bits.

'icrosoftC WindowsC E# con /ervice #ac0 ? o Windows ;

con /ervice #ac0 (. AdobeC 2reative /uiteC F.F. F(* '6 de 9A'.

( G6 de espacio disponible en el disco duro para la

instalaciónH se necesita espacio libre adicional durante la

instalación no se puede instalar en dispositivos de

almacenamiento flas$ e"tra%bles-. 9esolución de (*<> " <>> con adaptador de gráficos de (3

bits. =avaI 9untime &nvironment (.3 incluido-.

nidad de D:DJ9!'.



/oftware Kuic08ime ;.3.3 necesario para la reproducción de

contenido multimedia 78'4F. &ste software no funciona sin la activación. &s necesario

disponer de una cone"ión a +nternet de banda anc$a y

registrarse para poder activar el software, validar las

suscripciones y acceder a los servicios en l%nea.L Bo está

disponible la activación por tel1fono.

8. ombre & e9pli7ue las partes del entorno gra0ico de

/ream:eaver versión cs-

Al arrancar Dreamweaver aparece una pantalla inicial como 1sta, vamos a ver suscomponentes fundamentales. As% conoceremos los nombres de los diferentes

elementos y será más fácil entender el resto del curso. 4a pantalla que se muestra

a continuación y en general todas las de este curso- puede no coincidir

e"actamente con la que ves en tu ordenador, ya que cada usuario puede decidir

qu1 elementos quiere que se vean en cada momento y dónde, como veremos

más adelante.



&n el resto de esta unidad vamos a ir describiendo los puntos más importantes

señalados en esta imagen por los nMmeros en azul del ( al ).

,;< $as barras;

);< $as pesta=as de documentos;

2;< $a barra de estado;

4;< El panel de propiedades;

6;< >rea de paneles;

-;< Paneles & ventanas;

8;< $ínea in0erior de pesta=as;

*;< Vista dise=o del documento;

?;< Vista código del documento;



Identi0icadas

,;< $a barra de la aplicación;

4a barra la aplicación se incorporó en la versión anterior de Dreamweaver. /i

tenemos la ventana ma"imizada veremos todos los elementos de la barra

ocupando una sola l%nea, si no, ocuparán dos l%neas, como en la imagen superior.

&sta barra contiene los siguientes elementosN los menMs en la imagen, en la

parte inferior-, varios botones propios de la aplicación, el conmutador de espacio

de trabao y una caa de bMsquedas para obtener ayuda on line.

4os botones propios de la aplicación, que aparecen unto al icono, nos permiten

de derec$a a izquierda- cambiar entre la vista de diseño o código, acceder a las

e"tensiones que se pueden añadir, o al administrador de sitios, que ya veremos.

'ás $acia la derec$a observamos el conmutador del espacio de trabao, como un

desplegable. n espacio de trabao es la configuración del entorno paneles

visibles y su disposición- que podemos guardar y cargar. 4o veremos más

adelante.

4os menMs, están agrupados en categor%as.

Al $acer clic en +nsertar, por eemplo, veremos las operaciones relacionadas con

los diferentes elementos que se pueden insertar en Dreamweaver. 8odas las

opciones de Dreamweaver son accesibles a trav1s de los menMs, aunque en

ocasiones nos env%en a los paneles.



);< $as pesta=as de documento;

2ada arc$ivo que tengamos abierto, mostrará una pestaña con su nombre, lo quenos permitirá cambiar de uno a otro fácilmente. /i unto al nombre aparece un L,

indica que ese arc$ivo tiene cambios sin guardar. #odemos cerrar cada

documento clicando en el aspa de la derec$a, o acceder a otras acciones

$aciendo clic con el botón derec$o, como 2errar otros arc$ivos.

Debao de las pestañas encontramos los arc$ivos a que utiliza nuestra página,

como la $oa de estilos, arc$ivos =ava/cript, etc... #udiendo acceder a ellos con

un clic. &sto nos a$orrará bastante tiempo.

2;< $a barra de estado;

&sta barra la encontramos debao de la ventana de documento, y nos da

información sobre el mismo.

A la izquierda, encontramos el selector de etiquetas. Bos sirve para seleccionar

etiquetas completas. /iguiendo $acia la derec$a tenemos las $erramientas de

/elección, 'ano para desplazarse- y Ooom. 'ás a la derec$a encontramos tres

iconos para ver la página en tres tamaños de pantallaN móvil, tableta y #2

escritorio. P al final $ay otros datos como el tamaño de la ventana, el tamaño de la

página o su codificación.

7asta aqu% las barras que siempre veremos en la aplicación.

4;< El inspector de Propiedades

&l inspector de #ropiedades muestra las opciones propias del obeto o te"to

seleccionado, permiti1ndonos editarlas, por lo que se convierte en uno de los

elementos más utilizados en Dreamweaver. #or eemplo, cuando el elemento



seleccionado sea una imagen, como sucede en la imagen que puedes ver,

mostrará su ubicación, dimensiones, peso, clase, etc...

&n otros elementos, como párrafos y estilos, este panel puede mostrar dos tipos

de propiedades, 78'4 y 2//, que podemos aplicar a los diferentes elementos de

la página Web que estemos diseñando.

6;< >rea de paneles;

&n la parte derec$a de la pantalla tenemos el área o pila de paneles.

+nicialmente, el área de paneles contiene unos determinados elementos, pero

podemos quitar y poner los elementos que queramos. #ara quitar un elemento del

área de paneles basta $acer clic con el botón derec$o sobre su nombre para que

aparezca un menM con la opción 2errar. #ara añadir un elemento al área de

paneles $ay que ir al menM :entana y $acer clic en el elemento que queramos

añadir, si el elemento se abre en una ventana flotante, bastará arrastrarlo al área

de paneles.

-;< Paneles;

na vez tenemos el área de paneles con los elementos que más nos interesen,

podemos abrirlos o desplegarlos de tres formas.

(. Abrir el panel dentro del área de paneles. #ara ello primero $ay que

e"pandir el área de paneles pulsando el botón de la parte superior derec$a

botón e"pandir , a continuación, basta $acer clic en cada panel para que se

abra dentro del área de paneles. #ara cerrar el panel $acer doble clic.



*. Abrir el panel al lado del área de paneles. #ara ello $ay que partir del área

de paneles sin e"pandir, y al pulsar en un panel, este se abrirá pegado al

lado, como vemos en la siguiente figura.?. Abrir como panel flotante. #ara ello $ay que pinc$ar en el t%tulo del panel y

arrastar el panel fuera del área de paneles, el panel se puede colocar en

cualquier zona de la pantalla, incluso fuera de la pantalla de Dreamweaver.

8; $ínea in0erior de pesta=as;

&n al parte inferior de la pantalla tenemos una l%nea que contiene varias pestañas

6uscar, :alidación , ... -

#ara abrir una pestaña basta $acer clic sobre ella, para cerrarla $acer doble clic

en su t%tulo.

&stas pestañas se pueden configurar de forma similar a como acabamos de ver

con el área de paneles. &s decir, se pueden añadir y quitar, convertir en flotantes,

etc.

*;< $a vista /ise=o;

4a vista Diseño permite trabaar con el editor visual.



Bos ofrece un aspecto muy similar al resultado final, pero totalmente editable.

?;< $a vista 3ódigo;

4a vista 2ódigo se utiliza para poder trabaar en un entorno totalmente de

programación, de código fuente. Bo permite tener directamente una referencia

visual de cómo va quedando el documento segMn se va modificando el código.

Trabajo Sobre Dreamweaver

Documents

Transcript of Trabajo Sobre Dreamweaver