MANUAL DE DREAMWEAVER · MANUAL DE DREAMWEAVER Página -I- Índice
Trabajo Sobre Dreamweaver
-
Upload
pedro-luis-aguilera-godoy -
Category
Documents
-
view
218 -
download
0
Transcript of 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 )+,-
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 2/12
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
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 3/12
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
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 4/12
&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
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 5/12
-. 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!'.
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 6/12
/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.
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 7/12
&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;
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 8/12
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.
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 9/12
);< $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
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 10/12
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.
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 11/12
*. 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.
8/16/2019 Trabajo Sobre Dreamweaver
http://slidepdf.com/reader/full/trabajo-sobre-dreamweaver 12/12
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.