Curso de Macromedia Dreamweaver MX PDF

También podría gustarte

Está en la página 1de 81

MACROMEDIA DREAMWEAVER MX

DREAM WEAVER M X
1. - Introduc c in
2. - Cre ac in de l s itio
2. 1. - Sitio loc al
2. 2. - Sitio re m oto
3. - Cre ac in de una pg ina
4. - Pane l de prope rtie s
5. - Config urar pg ina (Propie rtie s , Bac kg round, Links ,te xt.)
6. - Cre ac in de hipe rvnc ulos
7. - Ins e rc in de im g e ne s
8. - Ins e rc in de Inte rac tivos
8. 1. - Im ag e
8. 2. - navig ation bar
8. 3. - Flas h botton
8. 4. - Flas h te xt
8. 5. - HTML de Fire works MX
9. - Config urac in de l nave g ador a trabajar
10. - Editar lis tas de nave g adore s
10. 1. - Com m on (Im ag e , Rollove r, Table , Navig ation bar, Horizontal
rule , Date , Flas h, Fire works , Ge ne rator, Bottons , Shoc kwave )
10. 2. - Layout
10. 3. Te xt, Table , Fram e s , Form s , Te m plate s , Charac te rs , Me dia,
He ads , Sc ript, Applic ations
11. Te m plate s
12. Fram e s
12. 1. Pane l fram e s
13. Com portam ie ntos , pane l be haviours
13. 1. s onido (MP3, Wav, Midi)
13.2. Video
14. Correo electronico
15. Base de datos (Application)
16. Crear base de datos en access
16.1. Concepto de base de datos
16.2. Tabla
16.3. Campos
16.4. Registros
17. Configurar sitio
17.1. Sitio local
17.2. Sitio remoto
17.3. Tipos de conexin de BD
18. Conexin a la base de datos (Recordset)
18.1. visualizar registros
18.2. Filtrar registro
18.3. Recordset navigation bar
18.4. Recordset insertion form
18.5. Delete recordset
18.6. Recordset update form
18.7. Busqueda de regitro (Query and vanced)
18.8. Master detail page set

Instituto de Computacin Activa de Mxico S. C. 1


MACROMEDIA DREAMWEAVER MX

19. - Recordset navigation status


20. Repeat region
21. Login confirm
22. Restring page
23. Redirection page.

Instituto de Computacin Activa de Mxico S. C. 2


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
Introduccin
Al final del captulo el alumno ser capaz de...
Cre ar un s itio loc al
Cre ar un s itio re m oto
Cre ar una pag ina nue va
Conoc e r las propie dade s de un obje to
Apre nde r a c onfig urar una pag ina
Cre ar Hipe rvnc ulos
Ins e rtar im g e ne s
Com prue ba tu avanc e y m arc a c on una P los obje tivos alc anzados

Instituto de Computacin Activa de Mxico S. C. 3


MACROMEDIA DREAMWEAVER MX

INTRODUCCIN
Mac rom e dia Dre am we ave r e s un e ditor de c dig o HTML profe s ional
para e l dis e o vis ual y la adm inis trac in de s itios y pg inas We b. Tan
s i pre fie re c ontrolar m anualm e nte e l c dig o HTML c om o s i pre fie re
trabajar e n un e ntorno de e dic in vis ual, Dre am we ave r le pe rm ite
pone rs e m anos a la obra rpidam e nte y le fac ilita he rram ie ntas tile s
para m e jorar s u e xpe rie nc ia e n dis e o We b.
Las func ione s de e dic in vis ual de Dre am we ave r tam bi n le pe rm ite n
aadir dis e o y func ionalidad rpidam e nte s in e s c ribir una s ola lne a
de c dig o. Pue de ve r todos los e le m e ntos o ac tivos de l s itio y
arras trarlos de s de un pane l fc il de us ar dire c tam e nte has ta un
doc um e nto. Ag ilic e s u flujo de trabajo de de s arrollo m e diante la
c re ac in y e dic in de im g e ne s e n Mac rom e dia Fire works y s u
im portac in dire c ta a Dre am we ave r, o bie n aadie ndo obje tos Flas h
que pue de c re ar dire c tam e nte e n Dre am we ave r.

Dre am we ave r s e pue de pe rs onalizar totalm e nte . Utilic e Dre am we ave r


para c re ar s us propios obje tos y c om andos , m odific ar m todos
abre viados de te c lado e inc lus o e s c ribir c dig o JavaSc ript para
am pliar las pos ibilidade s que ofre c e Dre am we ave r c on nue vos
c om portam ie ntos , ins pe c tore s de propie dade s e inform e s de s itios .
Adm inis trac in de l Sitio
Un s itio We b e s un c onjunto de doc um e ntos vinc ulados c on atributos
c om partidos , tale s c om o te m as re lac ionados , un dis e o s im ilar o un
obje tivo c om n.

Mac rom e dia Dre am we ave r e s una he rram ie nta de c re ac in y


adm inis trac in de s itios , por lo que pue de utilizarla para c re ar s itios
We b c om ple tos , ade m s de doc um e ntos individuale s . Para obte ne r
re s ultados ptim os , dis e e y planifique e l s itio We b ante s de c re ar las
pg inas que va a c onte ne r e l s itio.
2 Cre ac in de l s itio
Una ve z que c re e la e s truc tura de l s itio, de be r e s table c e r e l nue vo
s itio e n Dre am we ave r. Es table c e r e s te s itio loc al e n Dre am we ave r
s ig nific a que pue de utilizar Dre am we ave r c on FTP para c arg ar e l s itio
e n e l s e rvidor We b, para c ontrolar y m ante ne r autom tic am e nte los
vnc ulos y para c om partir arc hivos c on otras pe rs onas que c olabore n
c on us te d. Lo m s ade c uado e s c onfig urar e l s itio loc al e n
Dre am we ave r ante s de c om e nzar a c re ar las pg inas .

Instituto de Computacin Activa de Mxico S. C. 4


MACROMEDIA DREAMWEAVER MX

2. 1 Sitio loc al
El s itio loc al e s la e s truc tura de l s itio que us te d e s table c e e n e l e quipo
para que c onte ng a todas las c arpe tas , ac tivos y arc hivos de un s itio
c onc re to.
La c arpe ta raz loc al de l s itio de be r s e r e s pe c fic a de e s e s itio. Una
bue na ide a e s c re ar una c arpe ta llam ada Sitios y, pos te riorm e nte ,
c re ar c arpe tas raz loc ale s de ntro de e s a c arpe ta, una para c ada s itio
c on e l que trabaje .

2. 2 SITIO REM OTO

El pas o s ig uie nte a la hora de c onfig urar un s itio re m oto c ons is te e n


de te rm inar dnde s e va a s ituar e l s itio, e s de c ir, qu s e rvidor lo
albe rg ar. Su c lie nte , s u e m pre s a o s u prove e dor de s e rvic ios Inte rne t
(ISP) dis pone n probable m e nte de un s e rvidor c onfig urado para
albe rg ar pg inas We b (Inte rne t o intrane t). Pre g unte al adm inis trador
de l s is te m a o a s u c lie nte e l nom bre de dic ho s e rvidor y c m o s e
re alizan las trans fe re nc ias de arc hivos .

En partic ular, ave rig e s i s e utiliza FTP para c one c tar c on e l s e rvidor
o s i pue de m ontar e l s e rvidor c om o una unidad de dis c o c on ac c e s o de

Instituto de Computacin Activa de Mxico S. C. 5


MACROMEDIA DREAMWEAVER MX

re d de s de s u e s c ritorio. Si c one c ta utilizando FTP, ave rig e e l nom bre


de l s e rvidor FTP y de te rm ine e l dire c torio de l s e rvidor, as c om o la
inform ac in de c one xin y de c ontras e a.

De s pu s de c re ar un s itio loc al, us e e l c om ando De finir s itios para


aadir o c am biar la inform ac in de l s e rvidor re m oto as oc iado y las
pre fe re nc ias de de s prote c c in/ prote c c in.

Para as oc iar un s e rvidor re m oto a un s itio loc al e xis te nte :


1 Elija De finir s itios e n e l m e n e m e rg e nte de s itios ac tuale s de la
ve ntana Sitio, o bie n e lija Site > Edit s ite s
2 Apare c e r un c uadro de dilog o c on los s itios de finidos ac tualm e nte .
Se le c c ione un s itio e xis te nte y hag a c lic e n Editar.
Si no dis pone de s itios de finidos ac tualm e nte , c re e un s itio loc al ante s
de c ontinuar.
3 En la lis ta Cate g ora de la izquie rda, hag a c lic e n Datos re m otos .
4 Elija una de las s ig uie nte s opc ione s de Ac c e s o al s e rvidor:
Utilic e Ning uno s i no tie ne pre vis to c arg ar e l s itio e n un s e rvidor. A
c ontinuac in, hag a c lic e n Ac e ptar y om ita e l re s to de e s te
proc e dim ie nto.

Utilic e Loc al/ re d s i e l s e rvidor We b e s t m ontado c om o unidad de re d


(Windows ) o c om o s e rvidor Apple Talk o NFS (M ac intos h), o s i lo e s t
e je c utando e n e l e quipo loc al. Hag a c lic e n e l ic ono de c arpe ta para
loc alizar y s e le c c ionar la c arpe ta de l s e rvidor donde s e alm ac e nan los
arc hivos . Si de s e a que e l pane l Re m oto de la ve ntana Sitio s e ac tualic e
autom tic am e nte a m e dida que s e aadan y borre n arc hivos ,
s e le c c ione la opc in Ac tualizar lis ta arc hivos re m otos autom . Para
aum e ntar la ve loc idad de trans fe re nc ia de arc hivos al s itio re m oto,
de je e s ta opc in de s ac tivada. Para ac tualizar m anualm e nte la ve ntana
Sitio e n c ualquie r m om e nto, hag a c lic e n e l botn Ac tualizar de dic ha
ve ntana. Hag a c lic e n Ac e ptar y om ita e l re s to de e s te proc e dim ie nto.

Utilic e FTP s i s e c one c ta c on e l s e rvidor We b a trav s de FTP.

Instituto de Computacin Activa de Mxico S. C. 6


MACROMEDIA DREAMWEAVER MX

Para c one c tar c on un s e rvidor We b m e diante FTP:


1 Introduzc a e l nom bre de l s e rvidor FTP e n e l que c arg ar los
arc hivos de l s itio We b. El nom bre de l s e rvidor FTP e s e l nom bre
c om ple to e n Inte rne t de un s is te m a inform tic o, c om o
ftp. m inds pring . c om . Introduzc a e l nom bre c om ple to de l s e rvidor s in
te xto adic ional. Sobre todo, no aada un nom bre de protoc olo de lante
de l nom bre de l s e rvidor. Por e je m plo:
Corre c to: ftp.m inds pring . c om
Inc orre c to: ftp:/ / ftp. m inds pring .c om
Inc orre c to: m inds pring . c om

2 Introduzc a e l nom bre de l dire c torio de l s e rvidor de l s itio re m oto


donde s e alm ac e nan los doc um e ntos vis ible s para e l pblic o.

3 Introduzc a e l nom bre de c one xin y la c ontras e a que utiliza para


c one c tar c on e l s e rvidor FTP.
Dre am we ave r g uarda la c ontras e a de form a pre de te rm inada.
De s ac tive Guardar s i pre fie re que e l s is te m a le s olic ite la c ontras e a
c ada ve z que c one c te c on e l s e rvidor re m oto.

4 Se le c c ione las opc ione s de s e adas de c ortafue g os para e l s itio:


Ac tive la opc in Us ar c ortafue g os s i c one c ta c on e l s e rvidor re m oto
de s de e l otro lado de un c ortafue g os . Para obte ne r m s inform ac in
s obre las opc ione s de c ortafue g os .
Si s u c onfig urac in de c ortafue g os re quie re e l us o de FTP pas ivo (que
pe rm ite que e l s oftware loc al c onfig ure la c one xin FTP e n lug ar de
s olic itrs e lo al s e rvidor re m oto), s e le c c ione Utilizar FTP pas ivo. Si no
e s t s e g uro, c ons ulte al adm inis trador de l s is te m a.
5Hag a c lic e n done .

3 CREACIN DE UNA PGINA NUEVA

Mac rom e dia Dre am we ave r ofre c e dive rs as form as de c re ar un


doc um e nto. Pue de c re ar doc um e ntos HTML nue vos y vac os ; abrir un
doc um e nto HTML e xis te nte , aunque no haya s ido c re ado c on
Dre am we ave r; o bie n c re ar un nue vo doc um e nto bas ado e n una
plantilla.

Tam bi n pue de abrir arc hivos de te xto no HTML, c om o arc hivos


JavaSc ript, arc hivos de c orre o e le c trnic o de te xto norm al o arc hivos
de te xto g uardados c on proc e s adore s de te xto o e ditore s de te xto. No
podr utilizar todas las he rram ie ntas de e dic in de doc um e ntos de
Dre am we ave r e n un doc um e nto de te xto norm al, pe ro s podr utilizar
func ione s bs ic as de e dic in de te xto. Entre las pos ible s razone s para
abrir un doc um e nto de te xto fig uran e ditar y de purar c dig o
JavaSc ript, c ons ultar e l c onte nido de l arc hivo de c onfig urac in de
Dre am we ave r o abrir un c orre o e le c trnic o que c ontie ne un frag m e nto

Instituto de Computacin Activa de Mxico S. C. 7


MACROMEDIA DREAMWEAVER MX

de c dig o HTML para c opiar e l c dig o y pe g arlo e n otro doc um e nto.

Para c re ar un doc um e nto HTML vac o e n una nue va ve ntana de


doc um e nto, re alic e una de e s tas ope rac ione s :

En la barra de de m e ns e lija

File > ne w> c re ate , s e abre un c uadro de dialog o e n e l c ual le pe rm ite


e s c og e r uno de las tantas hojas de trabajo.

Si abre la vis ta de Cdig o (e n la ve ntana de doc um e nto) o e l ins pe c tor


de c dig o, podr ve r que e l nue vo doc um e nto no e s t totalm e nte
vac o, pue s c ontie ne e tique tas htm l, he ad y body para que pue da
c om e nzar a trabajar. Mie ntras e s c riba e n la vis ta de Dis e o de la
ve ntana de doc um e nto o ins e rte obje tos tale s c om o tablas e im g e ne s ,
podr de jar abie rto un e ditor de c dig o y obs e rvar c m o s e c re a e l
c dig o HTML. Para obte ne r m s inform ac in s obre los e ditore s de
c dig o.

Para abrir un arc hivo HTML e xis te nte , lle ve a c abo una de e s tas
ope rac ione s :
Se le c c ione File > Ope n.
Si e l arc hivo s e ha c re ado c on Mic ros oft Word, e lija File > Im port >
Word HTML
Si e lig e Im portar HTML de Word, Dre am we ave r abre e l arc hivo y le
pe rm ite e s pe c ific ar opc ione s para e lim inar c dig o aje no a HTML
g e ne rado por Word. (Mic ros oft Word 97 y las ve rs ione s pos te riore s
c ue ntan c on e l c om ando Guardar c om o HTML, que aade c dig o
HTML inne c e s ario al c onve rtir un doc um e nto a e s te form ato. ) Para
obte ne r m s inform ac in.
Nota: No s e pue de im portar dire c tam e nte un arc hivo de M ic ros oft
Word (. doc ) a Dre am we ave r. Si de s e a im portar e l c onte nido de un
arc hivo de Word, inic ie Word y g uarde e l arc hivo c om o HTML ante s de
im portar e l arc hivo HTML re s ultante a Dre am we ave r.

Instituto de Computacin Activa de Mxico S. C. 8


MACROMEDIA DREAMWEAVER MX

Para g uardar un doc um e nto:


1 Se le c c ione File > s ave as .

2 Proporc ione un nom bre para e l arc hivo y vay a has ta e l lug ar e n e l
que de s e a g uardar e l arc hivo.
Nota: Dre am we ave r aade autom tic am e nte .htm (Windows ) o . htm l
(Mac intos h) al nom bre de l arc hivo c uando apare c e e l c uadro de
dilog o. (Pue de c ontrolar la e xte ns in de arc hivo que de be aadirs e
utilizando una opc in de las pre fe re nc ias g e ne rale s . ) Para g uardar un
arc hivo c om o te xto norm al e n Windows , as g ne le la e xte ns in de
nom bre de arc hivo . txt. Para g uardar un arc hivo c om o te xto norm al e n
Mac intos h, s e nc illam e nte borre .htm l de l nom bre de l arc hivo
Mac intos h. (Para que Dre am we ave r ve a e l arc hivo c om o HTML de
nue vo, g urde lo otra ve z c on la e xte ns in . htm l o . htm . ) De s pu s de
g uardar un arc hivo c om o te xto, Dre am we ave r no inte rpre ta ning n
c dig o HTML de l arc hivo.
Cuando g uarde los doc um e ntos , e vite utilizar e s pac ios y c arac te re s
e s pe c iale s e n los nom bre s de arc hivos y c arpe tas s ie m pre que s e a
pos ible . En c onc re to, no utilic e c arac te re s e s pe c iale s (c om o , o )
ni s ig nos de puntuac in (c om o dos puntos , barras inc linadas o puntos )
e n los nom bre s de arc hivos que de s e e c oloc ar e n un s e rvidor re m oto;
m uc hos s e rvidore s c am bian e s tos c arac te re s durante la c arg a, lo que
provoc a que s e rom pan los vnc ulos e xis te nte s c on los arc hivos .
As im is m o, no c om ie nc e los nom bre s de los arc hivos c on nm e ros .

3 Hag a c lic e n e l botn Guardar para g uardar e l arc hivo.

4. PANEL DE PROPIEDADES (PROPERTIES)

El pane l de propie dade s o prope rtie s le pe rm ite c orre g ir las


c arac te rs tic as de un e le m e nto s e le c c ionado e n la pg ina, tal c om o
te xto o alg n obje to ins e rtado.
La m ayora de los c am bios que us te d re alic e a las c arac te rs tic as s e

Instituto de Computacin Activa de Mxico S. C. 9


MACROMEDIA DREAMWEAVER MX

aplic an inm e diatam e nte e n e l doc um e nto s in e m barg o los c am bios no


s e s olic itan as ta que us te d hag a c lic e n obje to ya s e a te xto o im ag e n.
El c onte nido de l pane l de prope rtie s vara e n los tipos de obje tos
s e le c c ionados .
Para m s inform ac in de alg una c arac te rs tic a e s pe c fic a s e le c c iona
e l obje to y e n la e s quina s upe rior de re c ha de l pane l de prope rtie s
hag a c lic e n e l ic ono de s ig no de inte rrog ac in.

para m os trar y oc ultar e l pane l de prope rtie s

vaya a la barra de m e n
s e le c c ione Windows >prope rtie s
Tam bi n pue de abrirla c on la c om binac in de te c las CTRL + F3

5. CONFIGURAR PGINA (PROPERTIES,


BACKGROUND, LINKS, TEXT)

Presione ctrl Dre am we ave r le pe rm ite trabajar e n s u doc um e nto de dife re nte s
+ F3 para form as : utilizando la vis ta Dis e o, utilizando la vis ta Cdig o o
abrir o cerrar e m ple ando una vis ta c om binada que m ue s tra e l dis e o y e l c dig o de l
la barra de
doc um e nto. Pue de c am biar la vis ta e n la que de s e a trabajar
propiedades s e le c c ionando una vis ta e n la barra de he rram ie ntas de
Dre am we ave r.

Instituto de Computacin Activa de Mxico S. C. 10


MACROMEDIA DREAMWEAVER MX

Conform e c re e y trabaje c on los doc um e ntos , Dre am we ave r g e ne rar


autom tic am e nte e l c dig o HTML s ubyac e nte . Para e xam inar o e ditar
e s te c dig o, utilic e uno de los e ditore s de c dig o de Dre am we ave r: la
vis ta de Cdig o de la ve ntana de doc um e nto o e l ins pe c tor de c dig o.
La vis ta de Dis e o de Dre am we ave r m ue s tra una re pre s e ntac in
vis ual de l doc um e nto, e n lug ar de l c dig o s ubyac e nte . Cuando trabaje
e n la vis ta de Dis e o, podr optar e ntre dos vis tas para re alizar e l
dis e o: vis ta de Dis pos ic in o vis ta Es tndar. Pue de s e le c c ionar e s tas
vis tas e n e l pane l Obje tos , bajo Ve r.
En la vis ta de Dis pos ic in, pue de dis e ar una dis pos ic in de pg ina e
ins e rtar g rfic os , te xto y otros e le m e ntos m ultim e dia.

esione ctrl. + Utilic e e l c uadro de dilog o Propie dade s de la pg ina para e s pe c ific ar
ara abrir las dive rs as opc ione s de la pg ina. Para abrir e l c uadro de dilog o
opiedades de Propie dade s de la pg ina, e lija M odify > pag e prope rtie s o pre s ione la
pagina s ig uie nte c om binac in CTRL + J.

Title e s pe c ific a e l ttulo de la pg ina que apare c e e n la barra de ttulo


de la ve ntana de doc um e nto y la ve ntana de la m ayora de los
nave g adore s .

Bac kg round im ag e y Bac kg round e s pe c ific an una im ag e n y un c olor


de fondo para la pg ina.

Te xt y Links de fine n los c olore s pre de te rm inados de te xto, vnc ulos ,


vnc ulos vis itados y vnc ulos ac tivos . Tam bi n pue de c ontrolar e s tos
c olore s utilizando hojas de e s tilos CSS.

Le ft m arg in y Top Marg in e s pe c ific an los tam aos de los m rg e ne s de


la pg ina e n la e tique ta body para Mic ros oft Inte rne t Explore r
s olam e nte . Ne ts c ape Navig ator pre s c inde e s tos valore s y utiliza los de
m arg in width y m arg in he ig ht. Para obte ne r un re s ultado ptim o e n
los dos nave g adore s , proporc ione valore s de m rg e ne s para am bos
nave g adore s e n lug ar de para uno s olo; c om ple te los c uatro valore s de
m rg e ne s e n lug ar de s lo dos . Para as e g urars e de que no apare c e n
m rg e ne s e n ning n nave g ador, c onfig ure los c uatro valore s c on e l
valor 0. Dre am we ave r no m ue s tra m rg e ne s de pg ina e n la ve ntana
de doc um e nto. Utilic e Vis ta pre via e n e l nave g ador para ve r los
m rg e ne s .

Doc um e nt Enc oding . Es pe c ific a la c odific ac in e m ple ada para los


c arac te re s de l doc um e nto. Para ing l s y otros idiom as de Europa
Oc c ide ntal, e lija Oc c ide ntal. Otras opc ione s pos ible s s on:
c e ntroe urope o, c irlic o, g rie g o, is land s , japon s , c hino tradic ional,

Instituto de Computacin Activa de Mxico S. C. 11


MACROMEDIA DREAMWEAVER MX

c hino s im plific ado y c ore ano. Si no apare c e ning una opc in para la
c odific ac in que de s e a utilizar, e lija Otro para c re ar un doc um e nto
c on la c odific ac in que us e s u s is te m a ope rativo. Todos los idiom as
as itic os utilizan c odific ac in de doble byte .

Para c am biar las fue nte s que e m ple a Dre am we ave r para m os trar
c ada c odific ac in, e lija Edit > Edit with e xte rnal e ditor y s e le c c ione
Fue nte s / c odific ac in. Las fue nte s que s e le c c ione e n e s te pane l de
pre fe re nc ias Fue nte s / c odific ac in no afe c tarn al m odo e n que los
vis itante s ve n las pg inas , y a que s tos e s pe c ific an s us propias
fue nte s (para una de te rm inada c odific ac in) e n los nave g adore s We b.
Para obte ne r m s inform ac in.

Trac ing iam g e e s pe c ific a una im ag e n que s e va a e m ple ar c om o g ua


para c opiar un dis e o. Es ta im ag e n s lo s irve c om o re fe re nc ia, ya que
no apare c e c uando e l doc um e nto s e m ue s tra e n un nave g ador.

Im ag e trans pare nc y de te rm ina la opac idad de la im ag e n de ras tre o,


de s de c om ple tam e nte trans pare nte has ta c om ple tam e nte opac a.

Doc um e nt folde rs . Mue s tra la c arpe ta e n la que s e g uarda e l


doc um e nto ac tual, s i ha s ido g uardado.

Site foldrs m ue s tra la ruta de la c arpe ta raz loc al de l s itio e n la que s e


ha g uardado e l doc um e nto ac tual, e n e l c as o de que s e haya g uardado.

6 CREACIN DE HIPERVINCULOS

Utilic e e l pane l de prope rtie s y e l ic ono de s e alizac in de arc hivo


para c re ar vnc ulos de s de una im ag e n, un obje to o te xto has ta otro
doc um e nto o arc hivo.

Para c re ar vnc ulos e ntre doc um e ntos utilizando e l ic ono de c arpe ta o


el c uadro de te xto Vnc ulo:
1 Se le c c ione te xto o una im ag e n e n la vis ta de Dis e o de la ve ntana de
doc um e nto.

Instituto de Computacin Activa de Mxico S. C. 12


MACROMEDIA DREAMWEAVER MX

2 Abra e l pane l de prope rtie s (Windows > prope rtie s ) y lle ve a c abo
una de e s tas ope rac ione s :

Hag a c lic e n e l ic ono de c arpe ta s ituado a la de re c ha de l c am po Link


para loc alizar y s e le c c ionar un arc hivo.

La ruta de l doc um e nto vinc ulado apare c e r e n e l c am po URL. Utilic e


e l m e n e m e rg e nte Re lativo a de l c uadro de dilog o Se le c c ionar
arc hivo HTML para indic ar s i la ruta e s re lativa al doc um e nto o a la
raz. A c ontinuac in, hag a c lic e n Se le c c ionar.

Nota: Al c am biar e l tipo de ruta e n e l c am po Re lativo a, Dre am we ave r


utilizar e s ta s e le c c in c om o e l tipo de ruta pre de te rm inado para
futuros vnc ulos has ta que la c am bie .

En e l c am po Vnc ulo, introduzc a la ruta y e l nom bre de arc hivo de l


doc um e nto. Para e s table c e r un vnc ulo c on un doc um e nto de l s itio,
introduzc a una ruta re lativa al doc um e nto o re lativa a la raz. Para
e s table c e r un vnc ulo c on un doc um e nto e xte rno al s itio, introduzc a
una ruta abs oluta que inc luya e l protoc olo (por e je m plo, http:/ / ).
Pue de utilizar e s te s is te m a para introduc ir un vnc ulo para un arc hivo
que an no se ha c re ado.
3 Se le c c ione una ubic ac in para abrir el doc um e nto.
Para que e l doc um e nto vinc ulado apare zc a e n un lug ar dis tinto de la
ve ntana o e l m arc o ac tual, s e le c c ione una opc in e n e l m e n
e m e rg e nte De s tino de l ins pe c tor de propie dade s :
_blank c arg a e l doc um e nto vinc ulado e n una nue va ve ntana s in
nom bre de l nave g ador.

_pare nt c arg a e l doc um e nto vinc ulado e n e l m arc o o la ve ntana padre


de l m arc o que c ontie ne e l vnc ulo. Si e l m arc o que c ontie ne e l vnc ulo
no e s t anidado, e l doc um e nto vinc ulado s e c arg ar e n la ve ntana
c om ple ta de l nave g ador.
_s e lf c arg a e l doc um e nto vinc ulado e n e l m is m o m arc o o la m is m a
ve ntana que e l vnc ulo. Es te de s tino e s e l pre de te rm inado, por lo que
norm alm e nte no e s pre c is o e s pe c ific arlo.

_top c arg a e l doc um e nto vinc ulado e n la ve ntana c om ple ta de l


nave g ador, e lim inando de e s ta form a todos los m arc os .

Sug e re nc ia: Si todos los vnc ulos de la pg ina s e e s table c e rn c on e l


m is m o de s tino, pue de e s pe c ific ar e s te de s tino una ve z e lig ie ndo
Ins e rt > He ad tang s > Bas e y s e le c c ionando la inform ac in de
de s tino.

Para obte ne r inform ac in s obre e l e s table c im ie nto de vnc ulos c on


m arc os . Para c re ar un vnc ulo c on un doc um e nto utilizando e l ic ono
de s e alizac in de arc hivo:

1 Se le c c ione e l te xto o una im ag e n e n la vis ta de Dis e o de la ve ntana


de doc um e nto.

Instituto de Computacin Activa de Mxico S. C. 13


MACROMEDIA DREAMWEAVER MX

2 Arras tre e l ic ono de s e alizac in de arc hivo s ituado a la de re c ha de l


c am po Vnc ulo e n e l pane l de prope rtie s y s e ale otro doc um e nto
abie rto, un punto de fijac in vis ible e n un doc um e nto abie rto o un
doc um e nto de la ve ntana Sitio. El c am po Vnc ulo s e ac tualizar para
m os trar el vnc ulo.
Nota: El doc um e nto abie rto o e l arc hivo de la ve ntana Sitio al que
s e ale pas ar a un s e g undo plano e n la pantalla m ie ntras re aliza la
s e le c c in.

3 Libe re e l botn de l ratn.

Para c re ar un vnc ulo de s de una s e le c c in e n un doc um e nto abie rto:


1 Se le c c ione te xto e n la vis ta de Dis e o de la ve ntana de doc um e nto.
2 Pre s ione m ays . y, al m is m o tie m po, arras tre la s e le c c in.
Mie ntras arras tra la s e le c c in, apare c e r e l ic ono de s e alizac in de
arc hivo.
3 Se ale otro doc um e nto abie rto, un punto de fijac in vis ible e n un
doc um e nto abie rto o un doc um e nto de la ve ntana Sitio.
4 Libe re e l botn de l ratn.

Para c re ar un vnc ulo utilizando e l m apa de l s itio y e l ic ono de


s e alizac in de arc hivo:
1 En la ve ntana Sitio, ac tive las vis tas Arc hivos de l s itio y Mapa de l
s itio pre s ionando e l ic ono Mapa de l s itio m ie ntras e lig e Mapa y
arc hivos .

2 Se le c c ione un arc hivo HTML de l m apa de l s itio.


Apare c e r e l ic ono de s e alizac in de arc hivo junto al arc hivo.

3 Arras tre e l ic ono de s e alizac in de arc hivo y s e ale otro arc hivo de l
m apa de l s itio o un arc hivo loc al de la vis ta Arc hivos de l s itio.

4 Libe re e l botn de l ratn.


Se c oloc ar un vnc ulo de hipe rte xto c on e l nom bre de l arc hivo
vinc ulado e n la parte infe rior de l arc hivo HTML s e le c c ionado. Es te
m todo ofre c e bue nos re s ultados para c re ar vnc ulos rpidam e nte e n
un s itio que s e e s t c re ando.

7 INSERCION DE IM GENES

Instituto de Computacin Activa de Mxico S. C. 14


MACROMEDIA DREAMWEAVER MX

Al ins e rtar una im ag e n e n un doc um e nto de Dre am we ave r, e l


prog ram a g e ne ra autom tic am e nte una re fe re nc ia al arc hivo e n e l
c dig o HTML. Para as e g urars e de que e s ta re fe re nc ia e s c orre c ta, e l
arc hivo de im ag e n de be r e s tar e n e l s itio ac tual. Si no lo e s t,
Dre am we ave r le pre g untar s i de s e a c opiar e l arc hivo e n la c arpe ta
raz.

Para ins e rtar una im ag e n:

1 Lle ve a c abo una de e s tas ope rac ione s :


Site e l punto de ins e rc in e n e l lug ar de la ve ntana de doc um e nto
donde de s e a que apare zc a la im ag e n y , a c ontinuac in, e lija Ins e rt >
Im ag e o hag a c lic e n e l botn Ins e rtar im ag e n de la c ate g ora
Com m on de l pane l Obje tos .
Site e l punto de ins e rc in e n e l lug ar de la ve ntana de doc um e nto
donde de s e a que apare zc a la im ag e n y , a c ontinuac in, pre s ione
Control+Alt+I (Windows ).
Arras tre e l botn Ins e rtar im ag e n de s de e l pane l Obje tos has ta la
pos ic in de s e ada de la ve ntana de doc um e nto.
Arras tre una im ag e n de s de e l pane l Ac tivos has ta la pos ic in de s e ada
de la ve ntana de doc um e nto. A c ontinuac in, s ig a c on e l pas o 3.
Arras tre una im ag e n de s de la ve ntana Sitio has ta la pos ic in de s e ada
de la ve ntana de doc um e nto. A c ontinuac in, s ig a c on e l pas o 3.
Arras tre una im ag e n de s de e l e s c ritorio has ta la pos ic in de s e ada de
la ve ntana de doc um e nto. A c ontinuac in, s ig a c on e l pas o 3.
2 En e l c uadro de dilog o que apare c e , hag a c lic e n Exam inar para
e le g ir un arc hivo o e s c riba la ruta de l arc hivo de im ag e n.
Si e s t trabajando e n un doc um e nto que no e s t g uardado,
Dre am we ave r g e ne rar una re fe re nc ia de arc hivo:/ / al arc hivo de
im ag e n. Al g uardar e l doc um e nto e n e l s itio, Dre am we ave r c onvie rte
la re fe re nc ia e n una ruta re lativa al doc um e nto.

Instituto de Computacin Activa de Mxico S. C. 15


MACROMEDIA DREAMWEAVER MX

3 De fina las propie dade s de la im ag e n e n e l pane l de PROPERTIES.

Instituto de Computacin Activa de Mxico S. C. 16


MACROMEDIA DREAMWEAVER MX

Cue s tionario 1

1. - De finic in de una pag ina We b

2. - De finic in de un Sitio

3. - De finic in de un portal

4. - De finic in de un Sito Loc al y Re m oto

5. - Paque te que ins tala C:\ ine tpub\ wwwroot

6. - Que e s e l IIS y para que s is te m a ope rativo

7. - Que e s e l PWS Y para que s is te m a ope rativo

8. - De finic in de Hipe rvnc ulo

Instituto de Computacin Activa de Mxico S. C. 17


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 2
Al final del captulo el alumno ser capaz de...
Ins e rtar inte rac tivos
Ins e rtar im g e ne s de s us tituc in
Cre ar barras de nave g ac in
Ins e rtar botone s de flas h
Ins e rtar te xto flas h
Ins e rtar obje tos HTML Fire works
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

,16(5&,21'(,17(5$&7,926

Instituto de Computacin Activa de Mxico S. C. 18


MACROMEDIA DREAMWEAVER MX

Una im ag e n de s us tituc in e s una im ag e n que c am bia c uando e l


punte ro pas a s obre e lla. Una im ag e n de s us tituc in c ons ta e n re alidad
de dos im g e ne s : la im ag e n princ ipal (la que apare c e al c arg ars e
inic ialm e nte la pg ina) y la im ag e n de s us tituc in (la que apare c e al
pas ar e l punte ro s obre la im ag e n princ ipal). Am bas im g e ne s de be n
te ne r e l m is m o tam ao. Si tie ne n tam aos dis tintos , Dre am we ave r
c am bia autom tic am e nte e l tam ao de la s e g unda im ag e n para que s e
ajus te a las propie dade s de la prim e ra.
Las im g e ne s de s us tituc in e s tn c onfig uradas de m ane ra
pre de te rm inada para re s ponde r al e ve nto Mous e Ove r. Para obte ne r
inform ac in s obre la c onfig urac in de una im ag e n para que re s ponda
a otro e ve nto (por e je m plo, un c lic de l ratn) o s obre la e dic in de una
im ag e n de s us tituc in para que m ue s tre otra im ag e n.
Una form a m s c om ple ja de im ag e n de s us tituc in e s la barra de
nave g ac in. Para c re ar una barra de nave g ac in, utilic e Ins e rt >
Inte rac tive Im ag e > Navig ation bar.

Para c re ar una im ag e n de s us tituc in:

1 En la ve ntana de doc um e nto, s ite e l punto de ins e rc in e n e l lug ar


donde de s e a que apare zc a la im ag e n de s us tituc in.

2 Introduzc a la im ag e n de s us tituc in m e diante uno de e s tos m todos :


En la c ate g ora Com m on de l pane l Obje tos , hag a c lic e n e l ic ono
Ins e rtar im ag e n de s us tituc in.
En la c ate g ora Com m on de l pane l Obje tos , arras tre e l ic ono Ins e rtar
im ag e n de s us tituc in has ta la pos ic in de s e ada de la ve ntana de
doc um e nto.
Elija Ins e rt >Inte rac tive Im ag e s > Rollove rs Im ag e .
Apare c e r e l c uadro de dilog o Ins e rtar im ag e n de s us tituc in.

3 En e l c am po Im ag e Nam e , introduzc a un nom bre para la im ag e n de


s us tituc in.
4En e l c am po Im ag e n orig inal, hag a c lic e n Exam inar y s e le c c ione o
e s c riba la ruta de la im ag e n que de s e a m os trar c uando s e c arg ue la
pg ina.

5 En e l c am po Rollove r Im ag e , hag a c lic e n Exam inar y s e le c c ione o


e s c riba la ruta de la im ag e n que de s e a m os trar c uando e l punte ro pas e
s obre la im ag e n orig inal.

6 Si de s e a pre c arg ar las im g e ne s e n la c ac h de l nave g ador de m odo


que s e c arg ue n m s rpidam e nte , s e le c c ione la opc in Carg a pre via
de im g e ne s .

7 En e l c am po whe n c lic ke d, g o to URL, hag a c lic e n brows e y

Instituto de Computacin Activa de Mxico S. C. 19


MACROMEDIA DREAMWEAVER MX

s e le c c ione o e s c riba la ruta de l arc hivo que de s e a abrir c uando un


us uario hag a c lic e n la im ag e n de s us tituc in.

Nota: Si no e s table c e un vnc ulo para la im ag e n, Dre am we ave r


ins e rtar un vnc ulo nulo (# ) e n e l c dig o HTML re lativo al
c om portam ie nto de s us tituc in. Si e lim ina e l vnc ulo nulo, la im ag e n
de s us tituc in de jar de func ionar.
8Hag a c lic e n Ac e ptar para c e rrar e l c uadro de dilog o Ins e rtar
im ag e n de s us tituc in.

52//29(5,0$*(

Un rollove r iam g e e s una im ag e n de s us tituc in que e n e l m om e nto de


pas ar e l m ous e c am bia
Para un rollove r im ag e s ig a las s ig uie nte s ins truc c ione s :

1 En la ve ntana de doc um e nto, s ite e l punto de ins e rc in e n e l lug ar


donde de s e a que apare zc a la im ag e n de s us tituc in.

2 Introduzc a la im ag e n de s us tituc in m e diante uno de e s tos m todos :


En la c ate g ora Com m on de l pane l Obje tos , hag a c lic e n e l ic ono
Ins e rtar im ag e n de s us tituc in.
En la c ate g ora Com m on de l pane l Obje tos , arras tre e l ic ono Ins e rtar
im ag e n de s us tituc in has ta la pos ic in de s e ada de la ve ntana de
doc um e nto.
Elija Ins e rt >Inte rac tive Im ag e s > Rollove rs Im ag e .
Apare c e r e l c uadro de dilog o Ins e rtar im ag e n de s us tituc in.

3 En e l c am po Im ag e Nam e , introduzc a un nom bre para la im ag e n de


s us tituc in.
4En e l c am po Im ag e n orig inal, hag a c lic e n Exam inar y s e le c c ione o
e s c riba la ruta de la im ag e n que de s e a m os trar c uando s e c arg ue la

Instituto de Computacin Activa de Mxico S. C. 20


MACROMEDIA DREAMWEAVER MX

pg ina.

5 En e l c am po Rollove r Im ag e , hag a c lic e n Exam inar y s e le c c ione o


e s c riba la ruta de la im ag e n que de s e a m os trar c uando e l punte ro pas e
s obre la im ag e n orig inal.

6 Si de s e a pre c arg ar las im g e ne s e n la c ac h de l nave g ador de m odo


que s e c arg ue n m s rpidam e nte , s e le c c ione la opc in Carg a pre via
de im g e ne s .

7 En e l c am po whe n c lic ke d, g o to URL, hag a c lic e n brows e y


s e le c c ione o e s c riba la ruta de l arc hivo que de s e a abrir c uando un
us uario hag a c lic e n la im ag e n de s us tituc in.

Nota: Si no e s table c e un vnc ulo para la im ag e n, Dre am we ave r


ins e rtar un vnc ulo nulo (# ) e n e l c dig o HTML re lativo al
c om portam ie nto de s us tituc in. Si e lim ina e l vnc ulo nulo, la im ag e n
de s us tituc in de jar de func ionar.
8Hag a c lic e n Ac e ptar para c e rrar e l c uadro de dilog o Ins e rtar
im ag e n de s us tituc in.

1$9,*$7,21%$5

Un navig ation bar s e c om pone de una im ag e n o un c onjunto de


im g e ne s c uya vis ualizac in c am bia s e g n las ac c ione s que re aliza e l
us uario. Los navig ation bar pe rm ite n de s plazars e fc ilm e nte e ntre las
pg inas y los arc hivos de un s itio.
Ante s de ins e rtar un navig ation bar, c re e un c onjunto de im g e ne s
para los e s tados que s e m os trarn c on c ada e le m e nto de nave g ac in.
Un e le m e nto de navig ation bar s e pue de c ons ide rar c om o un botn, ya
que la hac e r c lic e n l, lle va al us uario a otra pg ina.
Un e le m e nto de navig ation bar pue de te ne r c uatro e s tados :
Up im ag e : la im ag e n que apare c e c uando e l us uario an no ha he c ho
c lic e n e l e le m e nto o inte rac tuado c on l. Por e je m plo, pare c e c om o s i
no s e hubie ra he c ho c lic e n e l e le m e nto que s e e nc ue ntra e n e s te
e s tado.

Ove r im ag e : la im ag e n que apare c e c uando e l punte ro s e m ue ve

Instituto de Computacin Activa de Mxico S. C. 21


MACROMEDIA DREAMWEAVER MX

s obre la im ag e n. Cam bia la aparie nc ia de l e le m e nto (por e je m plo,


pue de apare c e r m s c laro) para indic ar a los us uarios que pue de n
inte rac tuar c on l.

Down im ag e : la im ag e n que apare c e de s pu s de hac e r c lic e n e l


e le m e nto. Por e je m plo, c uando un us uario hac e c lic e n un e le m e nto,
s e c arg a una nue va pg ina y la barra de nave g ac in s ig ue
m os trndos e , pe ro e l e le m e nto e n e l que s e ha he c ho c lic apare c e
os c ure c ido para indic ar que s e ha s e le c c ionado.
Ove r while down im ag e : la im ag e n que apare c e c uando e l punte ro
pas a s obre la im ag e n Abajo de s pu s de habe r he c ho c lic e n e l
e le m e nto. Por e je m plo, e l e le m e nto pue de apare c e r ate nuado o g ris .
Pue de utilizar e s te e s tado para indic ar vis ualm e nte a los us uarios que
no pue de n volve r a hac e r c lic e n e l e le m e nto m ie ntras s e e nc ue ntre n
e n e s ta parte de l s itio.
No e s ne c e s ario inc luir im g e ne s de barra de nave g ac in para los
c uatro e s tados . Por e je m plo, e s pos ible que s lo ne c e s ite los e s tados
Arriba y Abajo.
Pue de c re ar una barra de nave g ac in, c opiarla e n otras pg inas de l
s itio, utilizarla c on m arc os y e ditar los c om portam ie ntos de la pg ina
para m os trar dis tintos e s tados a m e dida que ac c e de a las pg inas

)/$6+%27721

Instituto de Computacin Activa de Mxico S. C. 22


MACROMEDIA DREAMWEAVER MX

El obje to de flas h botton pe rm ite pe rs onalizar e ins e rtar un c onjunto


de botone s Flas h pre dis e ados .
Nota: De be r g uardar e l doc um e nto ante s de ins e rtar un obje to de
botn o de te xto Flas h.

Para ins e rtar un obje to de Flas h Botton:

1 Mie ntras s e e nc ue ntra e n la vis ta de Dis e o de la ve ntana de


doc um e nto, s e le c c ione m e dia e n pane l de obje tos y pre s ione e l botn
Ins e rtar Flas h botton e n e l pane l Obje tos o e lija Ins e rt > Inte rac tive
im ag e s > Flas h botton. Tam bi n pue de arras trar e l ic ono de Flas h
botton s obre la ve ntana de doc um e nto.
Apare c e r e l c uadro de dilog o Ins e rtar botn Flas h.

2 Se le c c ione e l e s tilo de botn que de s e e e n la lis ta Style .


Ve r un e je m plo de l botn e n e l c am po Mue s tra. Pue de c oloc ar e l
ratn e nc im a de la m ue s tra para ve r c m o func iona e n e l nave g ador.
Sin e m barg o, e l c am po Mue s tra no s e ac tualiza autom tic am e nte para
m os trar los c am bios re alizados e n e l te xto o la fue nte . Es tos c am bios
apare c e rn e n la vis ta de Dis e o.

3 En e l c am po botton te xt (opc ional), e s c riba e l te xto que de s e a


m os trar.
Por e je m plo, e s c riba Pre s ione aqu Es te c am po s lo ac e pta c am bios s i
e l botn s e le c c ionado tie ne un parm e tro {Button Te xt} de finido. Es to
s e pue de obs e rvar e n e l c am po Mue s tra. El te xto que e s c riba
re e m plazar {Button Te xt} c uando pre vis ualic e e l arc hivo.

4 En e l c am po Font, e s pe c ifique un tam ao de fue nte y s e le c c ione la


fue nte que de s e a utilizar e l m e n e m e rg e nte .
Slo e s ne c e s ario re alizar s e le c c ione s de fue nte y tam ao s i e l botn
tie ne parm e tros de te xto de finidos . Si la fue nte pre de te rm inada de un
botn no e s t dis ponible e n e l s is te m a, s e le c c ione otra fue nte e n e l
m e n e m e rg e nte . Te ng a e n c ue nta que no ve r la fue nte s e le c c ionada
e n e l c am po Mue s tra, aunque pue de hac e r c lic e n Aplic ar para
ins e rtar e l botn e n la pg ina y ve r qu aparie nc ia te ndr e l te xto.

5 En e l c am po Link (opc ional), introduzc a un vnc ulo abs oluto o


re lativo al doc um e nto para e l botn.
No s e adm ite n vnc ulos re lativos al s itio porque los nave g adore s no los
re c onoc e n e n las pe lc ulas Flas h. Si utiliza un vnc ulo re lativo al
doc um e nto, g uarde e l arc hivo SWF e n e l m is m o dire c torio que e l
arc hivo HTML. Los nave g adore s inte rpre tan los vnc ulos re lativos al
doc um e nto de dis tintas form as y , por tanto, al g uardar los vnc ulos e n
e l m is m o dire c torio s e g arantiza s u c orre c to func ionam ie nto.

6 En e l c am po targ e t (opc ional), e s pe c ifique un m arc o o una ve ntana

Instituto de Computacin Activa de Mxico S. C. 23


MACROMEDIA DREAMWEAVER MX

de de s tino para c arg ar e l vnc ulo de l botn Flas h.

7 En e l c am po Bg c olor (opc ional), e s table zc a e l c olor de l fondo de la


pe lc ula Flas h. Utilic e e l s e le c tor de c olore s o e s c riba un valor
he xade c im al para la We b (c om o # FFFFFF).

8 En e l c am po s ave as , introduzc a un nom bre de arc hivo para g uardar


e l nue vo arc hivo SWF.
Pue de utilizar e l nom bre de arc hivo pre de te rm inado (por e je m plo,
button1.s wf) o e s c ribir uno nue vo. Si e l arc hivo c ontie ne un vnc ulo
re lativo al doc um e nto, de be r g uardarlo e n e l m is m o dire c torio que e l
doc um e nto HTML ac tual para m ante ne r los vnc ulos re lativos al
doc um e nto.

9 Hag a c lic e n Ge t m ore s tyle s para pas ar al s itio Mac rom e dia
Exc hang e y de s c arg ar m s e s tilos de botn.
Para obte ne r m s inform ac in.

10 Hag a c lic e n Apply o pre s ione OK para ins e rtar e l botn Flas h e n la
ve ntana de doc um e nto.
Sug e re nc ia: Se le c c ione Aplic ar para ve r los c am bios re alizados e n la
vis ta de Dis e o. Mie ntras m antie ne e l c uadro de dilog o abie rto
pue de c ontinuar re alizando c am bios e n e l botn.

Para m odific ar un obje to de Flas h botton:


1 En la vis ta de Dis e o, s e le c c ione e l obje to de Flas h botton.

2 En e l pane l de prope rtie s m os trar las propie dade s de l Flas h botton.


Pue de re alizar c am bios e n e l pane l de prope rtie s . Es tos c am bios
m odific an los atributos HTML c om o anc ho, alto y c olor de fondo.

3 Para re alizar c am bios e n e l c onte nido, m ue s tre e l c uadro de dilog o


Ins e rtar Flas h botton utilizando uno de e s tos m todos :
Hag a doble c lic e n e l obje to de Flas h botton.
Hag a c lic e n Edit e n e l pane l de prope rtie s .
Hag a c lic c on e l botn de re c ho (Windows ) o m ie ntras pre s iona la
te c la Control (M ac intos h) y e lija Edit e n e l m e n c onte xtual.

4 En e l c uadro de dilog o Ins e rt Flas h botton, e dite los c am pos


de s c ritos e n e l proc e dim ie nto ante rior.
En la vis ta de Dis e o, pue de c am biar e l tam ao de l obje to fc ilm e nte
utilizando los m ane jadore s de c am bio de tam ao. Pue de re s table c e r
e l tam ao orig inal de l obje to s e le c c ionando Re s table c e r tam ao e n e l
ins pe c tor de propie dade s .
Para ve r c m o s e re produc e e l obje to de Flas h botton e n la ve ntana de
doc um e nto:
1 En la vis ta de Dis e o, s e le c c ione e l obje to de Flas h botton.
2 En e l pane l de prope rtie s , hag a c lic e n e l botn ve rde Re produc ir.

Instituto de Computacin Activa de Mxico S. C. 24


MACROMEDIA DREAMWEAVER MX

3 Hag a c lic e n e l botn rojo De te ne r para te rm inar la pre vis ualizac in.
Nota: No s e pue de e ditar e l obje to de Flas h botton m ie ntras s e e s t
re produc ie ndo.

Convie ne pre vis ualizar s ie m pre e l doc um e nto e n e l nave g ador para
c om probar e xac tam e nte la aparie nc ia que te ndr e l botn Flas h.

)/$6+7(;7

El obje to de Flas h te xt pe rm ite c re ar e ins e rtar una pe lc ula Flas h que


s lo c ontie ne te xto. Es to pe rm ite c re ar una pe que a pe lc ula de
g rfic os ve c toriale s c on fue nte s de dis e o y e l te xto que e lija.

Para ins e rtar un obje to de te xto Flas h:

1 Mie ntras s e e nc ue ntra e n la vis ta de Dis e o de la ve ntana de


doc um e nto, s e le c c ione m e dia e n pane l de obje tos y pre s ione e l botn
Flas h te xt e n e l pane l Obje tos o e lija Ins e rt > inte rac tive im ag e s >
Flas h Te xt.
Apare c e r e l c uadro de dilog o Ins e rtar te xto Flas h.

2 Se le c c ione una fue nte e n e l m e n e m e rg e nte Font.


Es te m e n m ue s tra todas las fue nte s True Type c arg adas ac tualm e nte

Instituto de Computacin Activa de Mxico S. C. 25


MACROMEDIA DREAMWEAVER MX

e n e l s is te m a.

3 Introduzc a un tam ao de fue nte (de puntos ) e n e l c am po Size .

4 Es pe c ifique los atributos de e s tilo, c om o ne g rita o c urs iva, y la


aline ac in de l te xto hac ie ndo c lic e n los botone s de l e s tilo
c orre s pondie nte .

5 En e l c am po Color, e s table zc a e l c olor de l te xto utilizando e l s e le c tor


de c olore s o introduc ie ndo un valor he xade c im al para la We b (c om o
# FFFFFF).
6 En e l c am po Rollove r c olor, e s table zc a e l c olor que apare c e c uando
e l punte ro pas a s obre e l obje to de te xto Flas h. Utilic e e l s e le c tor de
c olore s o e s c riba un valor he xade c im al para la We b (c om o # FFFFFF).
7 Introduzc a e l te xto de s e ado e n e l c am po Te xto.
Para ve r e l e s tilo de fue nte que s e m ue s tra e n e l c am po Te xto, ac tive
la c as illa que dic e s how font.

8 Si de s e a as oc iar un vnc ulo c on e l obje to de Flas h te xt, introduzc a un


vnc ulo abs oluto o re lativo al doc um e nto e n e l c am po link.
No s e adm ite n vnc ulos re lativos al s itio porque los nave g adore s no los
re c onoc e n e n las pe lc ulas Flas h. Si utiliza un vnc ulo re lativo al
doc um e nto, g uarde e l arc hivo SWF e n e l m is m o dire c torio que e l
arc hivo HTML. Los nave g adore s inte rpre tan los vnc ulos re lativos al
doc um e nto de dis tintas form as y , por tanto, al g uardar los vnc ulos e n
e l m is m o dire c torio s e g arantiza s u c orre c to func ionam ie nto.

9 Si ha introduc ido un vnc ulo, pue de e s pe c ific ar un m arc o o una


ve ntana de de s tino para c arg ar e s e vnc ulo e n e l c am po Targ e t.

10 En e l c am po Bg c olor, e lija un c olor de fondo para e l te xto. Utilic e e l


s e le c tor de c olore s o e s c riba un valor he xade c im al para la We b (c om o
# FFFFFF).

11 En e l c am po s ave as , introduzc a un nom bre para e l arc hivo.


Pue de utilizar e l nom bre de arc hivo pre de te rm inado (por e je m plo,
te x1. s wf) o e s c ribir uno nue vo. Si e l arc hivo c ontie ne un vnc ulo
re lativo al doc um e nto, de be r g uardarlo e n e l m is m o dire c torio que e l
doc um e nto HTML ac tual para m ante ne r los vnc ulos re lativos al
doc um e nto.

12 Hag a c lic e n Apply o pre s ione e l botn OK para ins e rtar e l Flas h
te xt e n la ve ntana de doc um e nto.
Si hac e c lic e n Apply, e l c uadro de dilog o pe rm ane c e r abie rto y
podr pre vis ualizar e l te xto e n e l doc um e nto.

Instituto de Computacin Activa de Mxico S. C. 26


MACROMEDIA DREAMWEAVER MX

+70/),5(:25.6

Dre am we ave r pe rm ite ins e rtar c dig o HTML g e ne rado por Fire works ,
c om ple to c on im g e ne s as oc iadas , divis ione s y JavaSc ript, e n un
doc um e nto. Es ta c arac te rs tic a de ins e rc in fac ilita la tare a de
ag re g ar tablas o m apas de im g e ne s c re ados e n Fire works e n un
doc um e nto de Dre am we ave r.

Para ins e rtar c dig o HTML de Fire works e n un doc um e nto de


Dre am we ave r:
1 En Dre am we ave r, g uarde e l doc um e nto e n un s itio de finido.

2 Coloque e l punto de ins e rc in e n e l doc um e nto donde de s e e que


c om ie nc e e l c dig o HTML ins e rtado.

3 Sig a uno de e s tos proc e dim ie ntos :


Se le c c ione Ins e rt > Inte rac tive Im ag e s > Fire works HTML.
Hag a c lic e n e l botn Ins e rtar Fire works HTML de la c ate g ora
Com m on de l pane l Obje tos .

4 En e l c uadro de dilog o que apare c e a c ontinuac in, hag a c lic e n


Brows e para s e le c c ionar e l arc hivo HTML de Fire works que de s e e .

5 s e le c c ione s la c as illa de opc in de le te file afte r ins e rtion para


de s plazar e l arc hivo HTML a la Pape le ra de re c ic laje (Windows ).
Utilic e e s ta opc in e n c as o de no ne c e s itar e l arc hivo HTML de
Fire works de s pu s de ins e rtarlo. Es ta opc in no afe c ta al arc hivo PNG
orig e n as oc iado c on e l arc hivo HTML.

Instituto de Computacin Activa de Mxico S. C. 27


MACROMEDIA DREAMWEAVER MX

Nota: Si e l arc hivo HTML s e e nc ue ntra e n una unidad de re d, s e


e lim ina de form a pe rm ane nte , no s e de s plaza a la Pape le ra de
re c ic laje o Pape le ra.
6 Hag a c lic e n OK para ins e rtar e l c dig o HTML, junto c on s us
im g e ne s , divis ione s y JavaSc ript as oc iados , e n e l doc um e nto de
Dre am we ave r.

Instituto de Computacin Activa de Mxico S. C. 28


MACROMEDIA DREAMWEAVER MX

Cue s tionario 2

1. - De finic in de barra de nave g ac in

2. - Opc in que pe rm ite inte rac tuar c on fire wors k

3. - Un Hipe rvnc ulo c re ado e n fire wors k pue de s e r


m odific ado e n dre am we ave r

Fals o ( ) ve rdade ro ( )

Instituto de Computacin Activa de Mxico S. C. 29


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 3
Al final del captulo el alumno ser capaz de...
Config urar e l nave g ador
Editar una lis ta de nave g adore s
Conoc e r la barra de ins e rt
Utilizar la fic ha c om m on
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

Instituto de Computacin Activa de Mxico S. C. 30


MACROMEDIA DREAMWEAVER MX

&21),*85$&,21'(/1$9(*$'25$75$%$-$5

Vis ta pre via us ando e l s e rvidor loc al Pe rm ite e le g ir un s e rvidor loc al


para re alizar la vis ta pre via de una pg ina e n un nave g ador (s lo
Windows ). Para que e s ta opc in func ione e s ne c e s ario e je c utar
s oftware de s e rvidor e n e l orde nador loc al. Cuando e s ta opc in e s t
ac tivada, Dre am we ave r s um inis tra la pg ina ac tual para re alizar la
vis ta pre via e n un s e rvidor loc al c om o un URL que c om ie nza por
http:/ / loc alhos t/ . Cuando e s ta opc in e s t de s ac tivada, Dre am we ave r
abre e l doc um e nto e n un nave g ador c on una ruta de arc hivo que
c om ie nza por arc hivo:/ / . En alg unos c as os , los vnc ulos e s pe c ific ados
c om o rutas re lativas a la raz no func ionan c orre c tam e nte c uando s e
abre n e n un nave g ador c on una ruta arc hivo:/ / . Lo m is m o s uc e de
c uando s e lle va a c abo la c om probac in de un nave g ador de de s tino.
resione F12
ara ver la El botn de s ig no m s (+ ) aade un nave g ador a la lis ta.
sta previa de
El botn de s ig no m e nos (-) e lim ina e l nave g ador s e le c c ionado e n la
pagina Web
lis ta.

Editar c am bia la c onfig urac in de l nave g ador s e le c c ionado.

Nave g ador princ ipal y Nave g ador s e c undario e s pe c ific an s i e l


nave g ador s e le c c ionado e s e l princ ipal o e l s e c undario. Pre s ione F12
para abrir e l nave g ador princ ipal o F12 (Windows ).

Instituto de Computacin Activa de Mxico S. C. 31


MACROMEDIA DREAMWEAVER MX

(',7$5/,67$'(1$9(*$'25(6

Dre am we ave r pe rm ite c re ar pg inas We b c on e le m e ntos que adm ite n


todos los nave g adore s (por e je m plo, im g e ne s y te xto de prrafo), as
c om o c on e le m e ntos que s lo adm ite n los nave g adore s m s re c ie nte s
(por e je m plo, e s tilos y c apas ).

La func in Com probar nave g adore s de de s tino analiza e l HTML de los


doc um e ntos para ve r s i hay e tique tas o atributos que no adm ite n los
nave g adore s de de s tino. La c om probac in no alte ra e l doc um e nto.

Para e je c utar una c om probac in de l nave g ador de de s tino:


1 Dis pone de las opc ione s s ig uie nte s :
Para e je c utar la c om probac in e n e l doc um e nto ac tual, g uarde e l
arc hivo. La c om probac in s e re alizar c on la ltim a ve rs in g uardada
de l arc hivo y no inc luir los c am bios que no haya g uardado.
Para e je c utar la c om probac in c on un dire c torio o un s itio, e lija
Windows > Site y abra la ve ntana FTP de l s itio. A c ontinuac in,
s e le c c ione una c arpe ta e n e l dire c torio loc al. La c om probac in de l
nave g ador de de s tino s e re alizar e n todos los arc hivos HTML de e s a
c arpe ta y las s ubc arpe tas que c onte ng a. La c om probac in de l
nave g ador de de s tino s lo s e pue de lle var a c abo c on arc hivos loc ale s .

2 Elija File > Pre vie w in Brows e r.


Si an no ha s e le c c ionado un Explorador princ ipal, e l prog ram a le
pe dir que lo hag a.

3 En la lis ta de nave g adore s , s e le c c ione e l nave g ador de de s tino que


de s e a utilizar para la c om probac in de l s itio.
4 Para g uardar e l inform e , e lija File > s ave e n e l nave g ador.
Las pre fe re nc ias de Vis ta pre via e n e l nave g ador m ue s tran los
nave g adore s princ ipal y s e c undario de finidos ac tualm e nte . Para abrir
las pre fe re nc ias de Vis ta pre via e n e l nave g ador, e lija File > pre vie w
in brows e r > Ie xplore , o bie n oprim a F12

Instituto de Computacin Activa de Mxico S. C. 32


MACROMEDIA DREAMWEAVER MX

),&+$6,16(57

El pane l de ins e rt c ontie ne botone s llam ados fic has ins e rt que s irve n
para la c re ac in e ins e rc in de dive rs os tipos de obje tos , c om o tablas ,
c apas e im g e ne s .

&20021 ,0$*(5(//29(57$%/(1$9,*$7,21%$5
+25,=217$/%$5'$7(2%-(67)/$6+),5(:25.6*(1(5$725

%2772166+2&.:$9(

El pane l de ins e rt c ontie ne botone s para la c re ac in e ins e rc in de


dive rs os tipos de obje tos , c om o tablas , c apas e im g e ne s . Para
m os trar u oc ultar e l pane l Obje tos , e lija Windows > ins e rt. O pre s ione
CTRL + F2

Para ins e rtar un obje to:

Hag a c lic e n e l c orre s pondie nte botn de l pane l ins e rt o arras tre e l
ic ono de l botn has ta la ve ntana de doc um e nto. De pe ndie ndo de l
obje to, apare c e r e l c orre s pondie nte c uadro de dilog o de ins e rc in
de obje to e n e l que s e le pe dir que s e le c c ione o ins e rte e l arc hivo u
obje to de s e ado.

Para om itir e s te c uadro de dilog o e ins e rtar un obje to m arc ador de


pos ic in vac o:

Mante ng a pre s ionada la te c la Control (Windows ) u Opc in


(Mac intos h) m ie ntras ins e rta e l obje to. (Por e je m plo, para ins e rtar un
m arc ador de pos ic in para una im ag e n s in e s pe c ific ar un arc hivo de
im ag e n, m ante ng a pre s ionada la te c la Control u Opc in y hag a c lic e n
e l botn Im ag e n. )

Nota: Es to no pe rm ite om itir todos los c uadros de dilog o. Alg unos


obje tos , c om o las barras de nave g ac in, las c apas , los botone s Flas h,
los m arc os , e tc . , no ins e rtan m arc adore s de e s pac io.
El pane l Ins e rt c ontie ne doc e c ate g oras de form a pre de te rm inada:
Charac te rs , Com m on, Form s , Fram e , He ad, lay out y Es pe c ial.
Tam bi n c ontie ne botone s que c am bian de vis ta: Es tndar y

Instituto de Computacin Activa de Mxico S. C. 33


MACROMEDIA DREAMWEAVER MX

Dis pos ic in.

La c ate g ora Com m on c ontie ne botone s para la c re ac in e ins e rc in


de los obje tos m s utilizados , c om o Im ag e s , Table s y dra. laye r.

La s e c c in layout pe rm ite e le g ir e ntre vis ta Es tndar


(pre de te rm inada) o de Dis pos ic in. Si e s t s e le c c ionada la vis ta de
Dis pos ic in, tam bi n podr s e le c c ionar las he rram ie ntas de
Dis pos ic in: Dibujar c e lda de dis pos ic in y Dibujar tabla de
dis pos ic in. Para obte ne r m s inform ac in. Para c am biar de
c ate g ora, utilic e e l m e n e m e rg e nte s ituado e n la parte s upe rior de l
pane l. Pue de m odific ar c ualquie r obje to de l pane l o c re ar s us propios
obje tos .

Alg unas de las pre fe re nc ias g e ne rale s afe c tan al pane l Obje tos . Para
c am biar e s tas pre fe re nc ias , e lija Edit > Pre fe re nc e y s e le c c ione
Ge ne ral.
Cuando ins e rte obje tos tale s c om o im g e ne s , tablas , s e c ue nc ias de
c om andos y e le m e ntos he ad, apare c e r un c uadro de dilog o e n e l que
s e le s olic itar inform ac in adic ional. Pue de s uprim ir e s tos c uadros
de dilog o de s ac tivando la opc in Mos trar dilog o al ins e rtar obje tos
o m ante nie ndo pre s ionada la te c la Control m ie ntras c re a e l obje to.
Cuando s e ins e rta un obje to c on e s ta opc in de s ac tivada, e l obje to
re c ibe valore s de atributo pre de te rm inados . De s pu s de ins e rtar e l
obje to, utilic e e l ins pe c tor de propie dade s para c am biar s us
propie dade s .
Las pre fe re nc ias de l pane l Obje tos pe rm ite n vis ualizar e l c onte nido
de l pane l Obje tos c om o te xto s olam e nte , ic onos s olam e nte o te xto e
ic onos .

Instituto de Computacin Activa de Mxico S. C. 34


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 4
Al final del captulo el alumno ser capaz de...
Utilizar la fic ha layout
Utilizar la fic ha te xt
Utilizar la fic ha table
Utilizar la fic ha fram e
Utilizar la fic ha form
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

Instituto de Computacin Activa de Mxico S. C. 35


MACROMEDIA DREAMWEAVER MX

/$<287

La c ate g ora loyout c ontie ne botone s que pe rm ite n c re ar obje tos no


vis ible s e n la ve ntana de l nave g ador, c om o los puntos de fijac in c on
nom bre . Elija Vie w > vis ual aids > Invis ible e le m e nts para ve r los
ic onos que m arc an la pos ic in de e s tos obje tos . Hag a c lic e n los
ic onos de e le m e ntos invis ible s de la ve ntana de doc um e nto para
s e le c c ionar los obje tos y c am biar s us propie dade s .

7(;77$%/()5$0(6)25067(03/$7(6

&+$5$&7(560(',$+($'66&5,37$33/,&$7,21

El pane l Charac te rs c ontie ne c arac te re s e s pe c iale s , c om o los


s m bolos de c opyrig ht, de c om illas c urvas y de m arc a re g is trada.
Te ng a e n c ue nta que e s tos s m bolos no s e m ue s tran c orre c tam e nte
e n las ve rs ione s ante riore s a la 3. 0 de los nave g adore s (Ne ts c ape e
IE).

La c ate g ora Form s c ontie ne botone s que pe rm ite n c re ar form ularios


e ins e rtar e le m e ntos de form ulario.

La c ate g ora m e dia c ontie ne botone s que pe rm ite n ins e rtar


e le m e ntos e s pe c iale s , c om o apple ts Java, plug -ins y obje tos
Ac tive X. Para obte ne r m s inform ac in.

La c ate g ora He ad c ontie ne botone s que pe rm ite n aadir dive rs os


e le m e ntos de la s e c c in he ad, c om o e tique tas m e ta, ke y words y
bas e .

La categora FRame contiene estructuras comunes de conjuntos de marcos.

En la categora de common podemos encontrar la opcion de table, te ble pe rm ite


c re ar una tabla para e l m ane jo de datos de form a org anizada. Para
dibujar una tabla s olo puls e e nc im a de l ic ono y s e abrir un c uadro
de dialog o e n e l c ual us te d de be r e s pe c ific ar los tam aos de la
c olum na, anc hos de la fila re lle nos , e tc .

la s e c c in he ad y la s e c c in body. La s e c c in body e s la parte


princ ipal de l doc um e nto, la parte vis ible que c ontie ne te xto,
im g e ne s , e tc . La s e c c in he ad e s invis ible , s alvo e l ttulo de l
doc um e nto, que apare c e e n las barras de ttulo de las ve ntanas e n
los nave g adore s y e n Dre am we ave r.

Instituto de Computacin Activa de Mxico S. C. 36


MACROMEDIA DREAMWEAVER MX

La s e c c in he ad tam bi n c ontie ne otra inform ac in im portante ,


inc luido e l tipo de doc um e nto, la c odific ac in de idiom a, las func ione s
y variable s JavaSc ript y VBSc ript, las palabras c lave y los indic adore s
de c onte nido para m otore s de bs que da y las de finic ione s de e s tilo.
No e s ne c e s ario s um inis trar todos e s tos e le m e ntos para c ada pg ina.
Por e je m plo, pue de de finir palabras c lave e indic adore s de c onte nido
para la pg ina princ ipal nic am e nte . Pue de ve r los e le m e ntos e n la
s e c c in he ad utilizando e l m e n Ve r, la vis ta de Cdig o de la ve ntana
de doc um e nto o e l ins pe c tor de c dig o.

La pe s taa de te xt e n e l pane l de ins e rt pe rm ite ins e rtar e tique tas de


te xto y pe rm ite dar form ato al te xto.

Nota la pe s taa de te xto e n e l pane l de ins e rt pare c e n s im ilare s a


alg unos botone s , e n e l pane l de prope rtie s , las func ione s s on dive rs as
para c ada tipo de botn.

Font Tag Editor: m ue s tra un c uadro de dialog o donde pe rm ite dar


form ato al te xto s e le c c ionado.

Bold, Italic : e s tas dos opc ione s s on c ls ic os s on s im ple m e nte de


ne g rita y c urs iva.

Applic ation: Es ta opc in pe rm ite la c one xin a una bas e de datos .

Re c ords e t: pe rm ite de finir la ruta de una bas e de datos , y e n donde s e


alm ac e nara la inform ac in.

Dinam ic table : pe rm ite c re ar una tabla dinam ic a e n una pag ina, y


pe rm ite as oc iar a un re c ords e t. Us te d pue de m odific ar e l as pe c to de
las tablas y la re g ion re pe tida us ando e l pane l de prope rtie s y e l
be haviors de l s e rvidor de la re g ion re s pe c tivam e nte .

Dinam ic te xt: ins e rte un obje to dinm ic o de un te xto e n una pg ina. El


obje to de tipo te xto que us te d ins e rte e s un artc ulo de un re c ords e t
pre de finido, e n la c ual us te d pue de aplic ar c ualquie ra de los form atos
de datos de Dre am we ave r MX

Instituto de Computacin Activa de Mxico S. C. 37


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 5
Al final del captulo el alumno ser capaz de...
Utilizar la fic ha plantillas
Utilizar e l pane l de m arc os
Conoc e r las propie dade s de los m arc os
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

Instituto de Computacin Activa de Mxico S. C. 38


MACROMEDIA DREAMWEAVER MX

7(03/$7(6

Un te m plate (plantillas ) e s un doc um e nto que s irve para c re ar


m ltiple s pg inas c on e l m is m o dis e o. Al c re ar una plantilla, podr
indic ar qu e le m e ntos de la pg ina de be rn pe rm ane c e r c ons tante s
(no e ditable s o bloque ados ) e n los doc um e ntos bas ados e n e s a
plantilla, y qu e le m e ntos podrn m odific ars e .
Por e je m plo, s i us te d public a una re vis ta e le c trnic a, e s m uy probable
que e l dis e o de la c abe c e ra y e l dis e o g e ne ral no c am bie n de un
nm e ro al s ig uie nte , ni inc lus o de un artc ulo de la re vis ta al que
oc upar e l m is m o lug ar e n e l s ig uie nte nm e ro, pe ro e l ttulo y los
c onte nidos de c ada artc ulo s e rn dife re nte s . El dis e ador pue de c re ar
e l dis e o de la pg ina de un artc ulo de la re vis ta c on te xto m arc ador
de pos ic in e n los lug are s e n donde irn e l ttulo y e l c onte nido (y c on
e s as re g ione s m arc adas c om o e ditable s ); e ntonc e s , e l dis e ador
pue de g uardar e s e dis e o c om o plantilla. La pe rs ona que c om pong a e l
nue vo nm e ro de la re vis ta c re ar una nue va pg ina bas ada e n la
plantilla, y s us tituir e l te xto m arc ador de pos ic in c on e l ttulo y e l
te xto re ale s de l nue vo artc ulo.
Pue de c re ar una plantilla a partir de un doc um e nto HTML e xis te nte y
de s pu s m odific arla para que s e ajus te a s us ne c e s idade s , o bie n
pue de c re ar una plantilla c om e nzando de c e ro a partir de un
doc um e nto HTML e n blanc o.

Dre am we ave r g uarda las plantillas c on la e xte ns in de arc hivo . dwt


e n una c arpe ta llam ada Te m plate s e n la c arpe ta raz loc al de s u s itio.
Si no e xis te todava la c arpe ta Te m plate s , Dre am we ave r la c re ar al
g uardar una plantilla nue va.

Nota: No s aque las plantillas de la c arpe ta Te m plate s , ni g uarde e n


e lla arc hivos que no s e an plantillas . Tam poc o de be s ac ar la c arpe ta
Te m plate s de s u c arpe ta raz loc al. Hac e rlo oc as iona e rrore s e n las
rutas de las plantillas .

La m ayora de las ope rac ione s c on plantillas s olam e nte e s tn


dis ponible s c uando la vis ta de Dis e o e s t ac tiva. Si un c om ando
re lac ionado c on plantillas e s t ate nuado c uando la vis ta de Cdig o

Instituto de Computacin Activa de Mxico S. C. 39


MACROMEDIA DREAMWEAVER MX

e s t ac tiva, hag a c lic e n la vis ta de Dis e o.

Para g uardar un doc um e nto e xis te nte c om o plantilla:


1 Elija File > Ope n y s e le c c ione un doc um e nto.
2 Cuando s e abra e l doc um e nto, e lija File > Save as Te m plate .

Nota: Si e l doc um e nto e s t bas ado e n una plantilla, prim e ro de be


s e pararlo de la plantilla para pode r g uardar e l propio doc um e nto
c om o plantilla.

3 En e l c uadro de dilog o que apare c e a c ontinuac in, s e le c c ione un


s itio e n e l m e n e m e rg e nte e introduzc a un nom bre para la plantilla
e n e l c uadro Save as .

4 Hag a c lic e n OK.


El arc hivo de plantilla s e g uarda e n la c arpe ta Te m plate s c on la
e xte ns in . dwt.
Para c re ar una plantilla nue va e n blanc o:
1 Elija File > Ne w, apre c e un c uadro de dialog o e n e l c ual de be r
s e le c c ionar la opc in de Te m plate , y s e le c c ione uno. O bie n tam bi n
lo pue de hac e r de s de la ve ntana de pre fe re nc ia
Edit>Pre fe re nc e . Y e n e l c uadro de dialog o s e le c c ione la opc in que
dic e Ne w doc um e nt, por de fault apare c e HTML, e n e l c uadro de
DEFAULT DOCUMENT TYPE de s pli g ue la y s e le c c ione HTL
Te m plate .

Instituto de Computacin Activa de Mxico S. C. 40


MACROMEDIA DREAMWEAVER MX

862'()5$0(6

El us o m s c om n de Fram e s (m arc os ) e s la nave g ac in. Una pg ina


We b pue de utilizar un m arc o para albe rg ar e l m e n de nave g ac in y
otro m arc o para e l c onte nido de la pg ina. Dado que e l m e n de
nave g ac in s e e nc ue ntra e n un m arc o, los vis itante s pue de n hac e r c lic
e n un e le m e nto de l m e n y e l c onte nido apare c e r e n e l m arc o de
c onte nido s in que c am bie e l m e n de nave g ac in. De e s te m odo, e l
vis itante podr orie ntars e pe rfe c tam e nte en el s itio.
Hay dos form as de c re ar un c onjunto de m arc os e n Dre am we ave r:
pue de dis e arlo us te d m is m o o s e le c c ionarlo de una s e rie de
c onjuntos de m arc os pre de finidos . Si e lig e un c onjunto de m arc os
pre de finido s e c onfig urarn autom tic am e nte todos los c onjuntos de
m arc os y m arc os ne c e s arios para c re ar la dis pos ic in. s ta e s la
form a m s s e nc illa de ins e rtar rpidam e nte un dis e o de m arc os e n la
pg ina. Slo s e pue de n c re ar m arc os e n la vis ta Dis e o de la ve ntana
de doc um e nto.
Los c onjuntos de m arc os pre de finidos fac ilitan la s e le c c in de l tipo de

Instituto de Computacin Activa de Mxico S. C. 41


MACROMEDIA DREAMWEAVER MX

c onjunto de m arc os que de s e a c re ar.


Los ic onos de c onjuntos de m arc os pre de finidos de la c ate g ora
Marc os de l pane l Obje tos proporc ionan una re pre s e ntac in vis ual de
c ada c onjunto de m arc os al aplic ars e a un doc um e nto s e le c c ionado.

El c onjunto de m arc os s e le c c ionado rode a al doc um e nto ac tual (e l


doc um e nto e n e l que s e e nc ue ntra e l punto de ins e rc in). El re a azul
de un ic ono de c onjunto de m arc os pre de finido re pre s e nta la pg ina o
e l m arc o s e le c c ionado ac tualm e nte e n un doc um e nto, m ie ntras que e l
re a blanc a re pre s e nta e l nue vo o los nue vos m arc os .

Para ins e rtar un c onjunto de m arc os pre de finido:


1 Site e l punto de ins e rc in e n e l doc um e nto.
2 A c ontinuac in, lle ve a c abo una de e s tas ope rac ione s :
En la c ate g ora FRAMES de l pane l ins e rt, s e le c c ione un c onjunto de
m arc os pre de finido. Para ins e rtar e l c onjunto de m arc os , pue de hac e r
c lic e n un ic ono o arras trar un ic ono dire c tam e nte al doc um e nto.
Para s e le c c ionar un c onjunto de FRam e s pre de finido, e lija Ins e rtar >
Marc os > Izquie rda, De re c ha, Arriba,
Abajo, Izquie rda y arriba, Supe rior izquie rda, Izquie rda s upe rior o
Dividir.
Ante s de c re ar un c onjunto de Fram e s o trabajar c on Fram e s , hag a
vis ible s los borde s de los m arc os e n la ve ntana de doc um e nto.

Para ve r los borde s de los Fram e s de un doc um e nto, e lija Vie w >
Vis ual Aids > Fram e s Borde rs .

Cuando s e m ue s tran los borde s de los m arc os , s e aade e s pac io


alre de dor de l borde de l doc um e nto, lo que s irve de indic ador vis ual de
las re as de m arc os de l doc um e nto.
Para c re ar un c onjunto de m arc os , lle ve a c abo una de e s tas
ope rac ione s :
Elija M odify > Fram e s e t > Slit fram e le ft, Slit Fram e rig ht, Slit Fram e
up Slit Fram e down.
Arras tre uno de los borde s de l m arc o a la ve ntana de doc um e nto para
dividir e l doc um e nto ve rtic al u horizontalm e nte . Arras tre un borde de l
m arc o por una de las e s quinas para dividir e l doc um e nto e n c uatro
m arc os nue vos .
Pre s ione la te c la Alt (Windows ).
Para e lim inar un Fram e
Arras tre e l borde de l m arc o fue ra de la pg ina o has ta e l borde de l
m arc o padre .
El pane l Marc os proporc iona una re pre s e ntac in vis ual de los m arc os
de l doc um e nto. Pue de hac e r c lic e n un m arc o o c onjunto de m arc os e n
e l pane l Marc os para s e le c c ionarlo e n e l doc um e nto y, s e g uidam e nte ,
ve r o e ditar las propie dade s de l e le m e nto s e le c c ionado e n e l ins pe c tor
de propie dade s .
El pane l Marc os tam bi n m ue s tra la je rarqua de la e s truc tura de l

Instituto de Computacin Activa de Mxico S. C. 42


MACROMEDIA DREAMWEAVER MX

c onjunto de m arc os de una m ane ra que pue de no pe rc ibirs e e n la


ve ntana de doc um e nto. En e l pane l M arc os , e l c onjunto de m arc os
e s t rode ado por un borde g rue s o tridim e ns ional; los m arc os e s tn
rode ados por una lne a de lg ada g ris ; m ie ntras que los dis tintos
m arc os s e ide ntific an a trav s de s us nom bre s .
Para g uardar un doc um e nto que e s t de ntro de un m arc o:

Hag a c lic e n e l m arc o para s e le c c ionarlo y, a c ontinuac in, e lija File >
s ave Fram e o File > Save Fram e as .

Para g uardar todos los arc hivos de un c onjunto de m arc os :

Elija File > Save all.

De e s te m odo s e g uardarn todos los doc um e ntos abie rtos , inc luidos
los doc um e ntos individuale s , los doc um e ntos de m arc os y los
doc um e ntos de c onjunto de m arc os .
1RWD Ut ilice las lneas de seleccin de m arcos de la vent ana de
docum ent o para ident ificar los docum ent os de conj unt o de m arcos o los
docum ent os de m arcos al guardar los archivos.

3$1(/'()5$0(6

Para m os trar e l pane l de Fram e s , lle ve a c abo una de e s tas


ope rac ione s :
Elija Windows > othe r> Fram e s .
Para s e le c c ionar un m arc o e n e l pane l Marc os :

Hag a c lic e n e l m arc o e n e l pane l Marc os .

Instituto de Computacin Activa de Mxico S. C. 43


MACROMEDIA DREAMWEAVER MX

Para s e le c c ionar un c onjunto de m arc os e n e l pane l Marc os :

Hag a c lic e n e l borde que rode a a los m arc os e n e l pane l Marc os .


Utilic e e l ins pe c tor de propie dade s para as ig nar un nom bre a un
m arc o y de finir s us borde s y s us m rg e ne s . Para ve r todas las
propie dade s de l m arc o, hag a c lic e n la fle c ha de am pliac in que s e
e nc ue ntra e n e l ng ulo infe rior de re c ho de l ins pe c tor de propie dade s .
Es ne c e s ario as ig nar un nom bre a c ada uno de los m arc os para que los
vnc ulos de la pg ina func ione n c orre c tam e nte .

3DUDHVSHFLILFDUSURSLHGDGHVGHPDUFR

1 Se le c c ione un m arc o lle vando a c abo una de e s tas ope rac ione s :
Hag a c lic e n un m arc o e n e l pane l Marc os .
Hag a c lic e n un m arc o e n la ve ntana de doc um e nto m ie ntras pre s iona
la te c la Alt (Windows ) o las te c las Opc in-Mays (Mac intos h).
2 Elija windows > prope rtie s para abrir dic ha barra. Hag a c lic e n la
fle c ha de am pliac in, s ituada e n la e s quina infe rior de re c ha, para ve r
todas las propie dade s .

3 Para as ig nar un nom bre al m arc o, e s c rbalo e n e l c am po fram e


nam e .
Nota: Marc o de te rm ina e l nom bre de l m arc o ac tual que s e utilizar
c om o de s tino de hipe rvnc ulos y re fe re nc ias de s e c ue nc ias de
c om andos . El nom bre de un m arc o tie ne que e s tar form ado por una
s ola palabra. Se adm ite s ubrayado (_), pe ro no g uione s (-), puntos (. ) ni
e s pac ios . Los nom bre s de m arc os de be n c om e nzar c on una le tra (no
c on un nm e ro). No utilic e palabras re s e rvadas de JavaSc ript (c om o

Instituto de Computacin Activa de Mxico S. C. 44


MACROMEDIA DREAMWEAVER MX

top o navig ator) para los nom bre s de los m arc os .


4 Elija una de las s ig uie nte s opc ione s de m arc o:
Src de te rm ina e l doc um e nto de orig e n de l m arc o. Introduzc a un
nom bre de arc hivo o hag a c lic e n e l ic ono de la c arpe ta para e xam inar
y s e le c c ionar e l arc hivo. Tam bi n pue de abrir un arc hivo e n un m arc o
c oloc ando e l punte ro e n e l m arc o y e lig ie ndo File > Ope n fram e .
Sc roll. De te rm ina s i apare c e rn barras de de s plazam ie nto c uando no
haya s ufic ie nte e s pac io para m os trar todo e l c onte nido de l m arc o
ac tual. La c onfig urac in pre de te rm inada de la m ayora de los
nave g adore s e s Autom tic o.
Mis m o tam ao re s tring e e l tam ao de l m arc o ac tual e im pide que los
us uarios pue dan arras trar los borde s de l m arc o. Sie m pre podr
c am biar e l tam ao de los m arc os e n la ve ntana de doc um e nto; s in
e m barg o, s i e s ta s e le c c ionada e s ta opc in, los us uarios no podrn
c am biar e l tam ao de los m arc os e n s us nave g adore s .
Borde s c ontrola e l borde de l m arc o ac tual. Las opc ione s pos ible s s on
ye s , No y de fault. Si e lig e la opc in Borde s , s e anular la
c onfig urac in de borde s de finida para e l c onjunto de m arc os . La
c onfig urac in pre de te rm inada de la m ayora de los nave g adore s e s S.
Un borde s lo pue de de s ac tivars e c uando todos los m arc os c ontig uos
e s tn de finidos c om o No o, c uando e s tn de finidos c om o
Pre de te rm inado c on e l c onjunto de m arc os padre de finido c om o No.
Borde r c olor:- e s table c e un c olor de borde para todos los borde s
c ontig uos al m arc o ac tual. Es ta opc in de c onfig urac in anula e l c olor
de borde de l c onjunto de m arc os .
5 Config ure las s ig uie nte s opc ione s de m rg e ne s (s i las opc ione s de
m rg e ne s no e s tn vis ible s , hag a c lic e n la fle c ha de am pliac in
s ituada e n la e s quina infe rior de re c ha).
Marg in width Es table c e e n pxe le s e l anc ho de los m rg e ne s izquie rdo
y de re c ho (e s de c ir, de l e s pac io que hay e ntre e l borde de l m arc o y s u
c onte nido).
Marg in He ig ht Es table c e e n pxe le s e l alto de los m rg e ne s s upe rior e
infe rior (e s de c ir, de l e s pac io que hay e ntre e l borde de l m arc o y s u
c onte nido).

Controlar e l c onte nido de l m arc o c on vnc ulos

Para utilizar vnc ulos e n m arc os , de be r e s table c e r un de s tino para e l


vnc ulo. El de s tino e s e l m arc o e n e l que s e abrir e l c onte nido
vinc ulado. Por e je m plo, s i e l m e n de nave g ac in s e e nc ue ntra e n e l
m arc o izquie rdo y de s e a que e l m ate rial vinc ulado apare zc a e l m arc o
de c onte nido princ ipal, de be r utilizar de s tinos para todos los
vnc ulos de l m e n de nave g ac in. El de s tino te ndr e l nom bre de l
m arc o de c onte nido princ ipal, por e je m plo, m arc o_princ ipal. Cuando
e l us uario hag a c lic e n un vnc ulo de nave g ac in, e l c onte nido s e
abrir e n e l m arc o princ ipal.

Si de s e a s e le c c ionar un m arc o para abrir un arc hivo e n l, de be r

Instituto de Computacin Activa de Mxico S. C. 45


MACROMEDIA DREAMWEAVER MX

utilizar e l m e n e m e rg e nte De s tino e n e l ins pe c tor de propie dade s .


Pue de e s table c e r la ape rtura de un arc hivo e n un nue vo m arc o,
s us tituir inform ac in e n e l m arc o de l vnc ulo o s us tituir inform ac in
e n otro m arc o. Tam bi n pue de hac e r que e l c onte nido vinc ulado
s obre s c riba e l m arc o ac tual (para e llo, no s e le c c ione un de s tino) o que
apare zc a e n una ve ntana de nave g ador totalm e nte nue va.

Instituto de Computacin Activa de Mxico S. C. 46


MACROMEDIA DREAMWEAVER MX

Cue s tionario 5

1. - De finic in de plantilla

2. - Proc e dim ie nto para un pane l de plantillas

3. - de finic in de m arc o (fram e )

4. - Proc e dim ie nto para ve r e l pane l de m arc os (fram e s )

Instituto de Computacin Activa de Mxico S. C. 47


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 6
Al final del captulo el alumno ser capaz de...
Utilizar e l pane l de c om portam ie nto
Ins e rtar s onido
Ins e rtar vide o
Ins e rtar un m ail link
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

Instituto de Computacin Activa de Mxico S. C. 48


MACROMEDIA DREAMWEAVER MX

&203257$0,(1723$1(/%(+$9,256

Los c om portam ie ntos pe rm ite n a los vis itante s inte rac tuar c on la
pg ina We b para m odific arla de dive rs as m ane ras o provoc ar la
re alizac in de de te rm inadas tare as . Un c om portam ie nto e s una
c om binac in de un e ve nto c on una ac c in que de s e nc ade na e s e
e ve nto. En e l pane l Com portam ie ntos , un c om portam ie nto s e aade a
una pg ina e s pe c ific ando una ac c in y e s pe c ific ando lue g o e l e ve nto
que de s e nc ade na e s a ac c in.

Los e ve ntos s on m e ns aje s g e ne rados por los nave g adore s que indic an
que un vis itante de la pg ina ha he c ho alg o. Por e je m plo, c uando un
vis itante m ue ve e l punte ro s obre un vnc ulo, e l nave g ador g e ne ra un
e ve nto onMous e Ove r para e s e vnc ulo; y lue g o c om prue ba s i hay
c dig o JavaSc ript al que de ba llam ar c uando s e g e ne ra e s e e ve nto
para e s e vnc ulo. Los dife re nte s e le m e ntos de la pg ina tie ne n
de finidos dife re nte s e ve ntos ; por e je m plo, e n la m ayora de los
nave g adore s onMous e Ove r y onClic k s on e ve ntos as oc iados c on
vnc ulos , e n donde onLoad e s un e ve nto as oc iado c on im g e ne s y c on
la s e c c in body de l doc um e nto.
Las ac c ione s c ons tan de c dig o JavaSc ript ya de finido que re aliza una
tare a e s pe c fic a, c om o abrir la ve ntana de un nave g ador, m os trar u
oc ultar una c apa, re produc ir un s onido o de te ne r una pe lc ula
Shoc kwave . Las ac c ione s inc orporadas e n Dre am we ave r han s ido
c uidados am e nte de s arrolladas por los ing e nie ros de Dre am we ave r
para proporc ionar la m xim a c om patibilidad c on los dis tintos
nave g adore s

621,'2 03:$90,',

Hay varios tipos de arc hivos y form atos de s onido, y varias form as de
aadir s onido a una pg ina We b. Los fac tore s que hay que te ne r e n
c ue nta ante s de optar por un form ato y un m todo para aadir s onido
s on: s u finalidad, e l tipo de us uarios a los que e s t de s tinado, e l
tam ao de arc hivo, la c alidad de s onido y las dife re nc ias e n los
nave g adore s .
Form atos de arc hivo de audio

La lis ta s ig uie nte de s c ribe los form atos de arc hivo de audio m s
c om n, junto c on alg unas de s us ve ntajas y de s ve ntajas e n re lac in
c on e l dis e o We b.

El form ato . m idi o . m id (Inte rfaz Dig ital para Ins trum e ntos Mus ic ale s )
e s un form ato de m s ic a ins trum e ntal. Muc hos nave g adore s

Instituto de Computacin Activa de Mxico S. C. 49


MACROMEDIA DREAMWEAVER MX

re c onoc e n los arc hivos MIDI y, por tanto, no re quie re n un plug -in. Si
bie n s u c alidad de s onido e s m uy alta, pue de variar s e g n la tarje ta de
s onido de l us uario. Un pe que o arc hivo MIDI pue de proporc ionar un
c lip de s onido de larg a durac in. Los arc hivos MIDI no s e pue de n
g rabar y de be n s inte tizars e e n un orde nador c on hardware y s oftware
e s pe c iale s .

Los arc hivos de form ato .wav (Exte ns in de Form as de Onda) ofre c e n
una bue na c alidad de s onido, s on c om patible s c on m uc hos
nave g adore s y no re quie re n un plug -in. Pue de g rabar s us propios
arc hivos WAV de s de un CD, una c inta, e l m ic rfono, e tc . Sin e m barg o,
e l g ran tam ao de arc hivo lim ita c ons ide rable m e nte la durac in de
los c lips de s onido que s e pue de n utilizar e n las pg inas We b.

El form ato .aif (Form ato de Arc hivo de Inte rc am bio de Audio o AIFF),
al ig ual que e l form ato WAV, ofre c e bue na c alidad de s onido, s e pue de
re produc ir e n la m ayora de los nave g adore s y no re quie re un plug -in.
Tam bi n s e pue de n g rabar arc hivos AIFF de s de un CD, una c inta, e l
m ic rfono, e tc . Sin e m barg o, e l g ran tam ao de arc hivo lim ita
c ons ide rable m e nte la durac in de los c lips de s onido que s e pue de n
utilizar e n las pg inas We b.

El form ato .m p3 (Audio de l Grupo de Expe rtos e n Im g e ne s e n


Movim ie nto o MPEG-Audio Nive l-3) e s un form ato c om prim ido que
re duc e c ons ide rable m e nte e l tam ao de los arc hivos de s onido. La
c alidad de s onido e s e xc e le nte : s i s e g raba y c om prim e c orre c tam e nte
un arc hivo MP3, s u c alidad e s e quiparable a la de un CD. La nue va
te c nolog a pe rm ite re produc ir e l arc hivo e n flujo (s tre am ing ) de m odo
que e l vis itante no te ng a que e s pe rar a que s e de s c arg ue todo e l
arc hivo para e s c uc harlo. Sin e m barg o, e l tam ao de arc hivo e s m ayor
que e l de Re al Audio, por lo que una c anc in e nte ra pue de tardar
bas tante e n de s c arg ars e a trav s de una c one xin te le fnic a norm al.
Para re produc ir arc hivos MP3, los vis itante s de be rn de s c arg ar e
ins talar una aplic ac in auxiliar o un plug -in c om o Quic kTim e ,
Windows Me dia Play e r o Re alPlaye r.

El form ato . ra, . ram , .rpm o Re al Audio tie ne un alto g rado de


c om pre s in c on tam aos de arc hivo m s pe que os que MP3. Pe rm ite
de s c arg ar arc hivos de c anc ione s c om ple tas e n un pe rodo de tie m po
razonable . Dado que los arc hivos s e pue de n re produc ir e n flujo de s de
un s e rvidor We b norm al, los vis itante s pue de n c om e nzar a e s c uc har e l
s onido ante s de que e l arc hivo s e haya de s c arg ado por c om ple to. La
c alidad de s onido e s m s pobre que la de los arc hivos MP3, aunque los
nue vos re produc tore s y c odific adore s la m e joran c ons ide rable m e nte .
Los vis itante s de be rn de s c arg ar e ins talar la aplic ac in auxiliar o
plug -in Re alPlaye r para re produc ir e s tos arc hivos .
El e s table c im ie nto de vnc ulos c on arc hivos de audio e s una form a
s e nc illa y e fe c tiva de aadir s onido a una pg ina We b. Es te m todo de
inc orporar arc hivos de s onido pe rm ite a los vis itante s optar por
e s c uc har e l arc hivo, y hac e que e l arc hivo e s t dis ponible para un

Instituto de Computacin Activa de Mxico S. C. 50


MACROMEDIA DREAMWEAVER MX

m ayor nm e ro de us uarios . Alg unos nave g adore s no adm ite n los


arc hivos de s onido inc rus tados .
Para e s table c e r un vnc ulo c on un arc hivo de audio:
1 Se le c c ione e l te xto o la im ag e n que de s e a us ar c om o vnc ulo c on e l
arc hivo de audio.
2 En e l pane l de prope rtie s , hag a c lic e n e l ic ono de c arpe ta para
ac c e de r al arc hivo de audio o e s c riba la ruta y e l nom bre de l arc hivo
en el c am po Vnc ulo.
Al inc rus tar audio s e inc orpora e l re produc tor de s onido dire c tam e nte
e n la pg ina, pe ro e l s onido s lo s e re produc e s i los vis itante s de l s itio
dis pone n de l plug -in ade c uado para e l arc hivo de s onido e le g ido.
Inc rus te arc hivos s i de s e a utilizar e l s onido c om o m s ic a de fondo o s i
de s e a obte ne r un m ayor c ontrol s obre la pre s e ntac in de s onido. Por
e je m plo, pue de e s table c e r e l volum e n, la aparie nc ia de l re produc tor
e n la pg ina y los puntos inic ial y final de l arc hivo de s onido.

Para inc rus tar un arc hivo de audio:


1 En la vis ta de Dis e o, s ite e l punto de ins e rc in e n e l lug ar donde
de s e a inc rus tar e l arc hivo.

2 Hag a c lic e n e l botn Plug -in de l pane l Obje tos o e lija Ins e rt > Me dia
> Plug in.
Para obte ne r m s inform ac in s obre e l obje to Plug -in.
3 En e l ins pe c tor de propie dade s , hag a c lic e n e l ic ono de c arpe ta para
ac c e de r al arc hivo de audio o e s c riba la ruta y e l nom bre de l arc hivo
e n e l c am po Vnc ulo.
4 Es pe c ifique e l anc ho y e l alto introduc ie ndo los valore s e n los
c am pos c orre s pondie nte s o c am biando e l tam ao de l m arc ador de
pos ic in de l plug -in e n la ve ntana de doc um e nto.
Est os valores det erm inan con qu t am ao se m uest ran los cont roles de
audio en el navegador. Por ej em plo, pruebe con un ancho de 144 pxeles y
un alt o de 60 para ver cm o aparece el reproduct or de audio en Navigat or
y en I nt ernet Explorer.

9,'(2

Vide os Shoc kwave , e l e s tndar de Mac rom e dia para m ultim e dia
inte rac tivo e n la We b, e s un form ato c om prim ido que pe rm ite la
de s c arg a rpida de los arc hivos de m e dios c re ados e n Mac rom e dia
Dire c tor y s u re produc c in e n los nave g adore s de us o m s fre c ue nte .

El s oftware que re produc e las pe lc ulas Shoc kwave e s t dis ponible


c om o plug -in para Ne ts c ape Navig ator y e n form ato de c ontrol
Ac tive X. Cuando s e ins e rta una pe lc ula Shoc kwave , Dre am we ave r
us a tanto la e tique ta obje c t (para e l c ontrol Ac tive X) c om o la e tique ta
e m be d (para e l plug -in) para c ons e g uir los m e jore s re s ultados e n

Instituto de Computacin Activa de Mxico S. C. 51


MACROMEDIA DREAMWEAVER MX

todos los nave g adore s . Al re alizar c am bios re lativos a la pe lc ula e n e l


ins pe c tor de propie dade s , Dre am we ave r adapta los datos introduc idos
a los parm e tros c orre s pondie nte s para las e tique tas obje c t y e m be d.
Para ins e rtar una pe lc ula Shoc kwave :

1 En la vis ta de Dis e o de la ve ntana de doc um e nto, s ite e l punto de


ins e rc in e n e l lug ar donde de s e a ins e rtar una pe lc ula Shoc kwave .
2 Hag a c lic e n e l botn Shoc kwave de l pane l prope rtie s o e lija Ins e rt >
Me dia > Shoc kwave o arras tre e l botn Shoc kwave s obre e l
doc um e nto.

3 En e l c uadro de dilog o que apare c e , s e le c c ione un arc hivo de


pe lc ula.

4 En e l pane l de prope rtie s , introduzc a e l anc ho y e l alto de la pe lc ula


e n los c uadros W y H . El pane l de prope rtie s m ue s tra inic ialm e nte las
propie dade s utilizadas c on m ayor fre c ue nc ia. Hag a c lic e n la fle c ha
de am pliac in, s ituada e n la e s quina infe rior de re c ha, para ve r todas
las propie dade s .
Nom bre e s pe c ific a un nom bre para ide ntific ar una pe lc ula e n las
s e c ue nc ias de c om andos . Introduzc a un nom bre e n e l c am po s in ttulo
que apare c e a la izquie rda de l ins pe c tor de propie dade s .

W y H e s pe c ific an e l anc ho y e l alto de la pe lc ula e n pxe le s . Tam bi n


s e pue de n e m ple ar las s ig uie nte s unidade s : pc (pic as ), pt (puntos ), in
(pulg adas ), m m (m ilm e tros ), c m (c e ntm e tros ) o % (porc e ntaje de l
anc ho o e l alto de l obje to padre ). Las abre viaturas de be n s e g uir al
valor s in e s pac io de s e parac in: por e je m plo, 3m m .

File e s pe c ific a la ruta de l arc hivo de la pe lc ula Shoc kwave . Hag a c lic
e n e l ic ono de c arpe ta para loc alizar un arc hivo o e s c riba la ruta
c orre s pondie nte .
Alig n de te rm ina c m o s e aline ar la pe lc ula e n la pg ina. Para
obte ne r una de s c ripc in de c ada opc in.

bg e s pe c ific a un c olor de fondo para la zona de la pe lc ula. Es te c olor


tam bi n apare c e r c uando la pe lc ula no s e e s t re produc ie ndo
(m ie ntras s e c arg a y de s pu s de habe rs e re produc ido).

Re produc ir pe rm ite pre vis ualizar la pe lc ula e n la vis ta de Dis e o de


la ve ntana de doc um e nto. Hag a c lic e n e l botn De te ne r para
inte rrum pir la pe lc ula y volve r al m arc ador de pos ic in de
Shoc kwave .

Parm e tros abre un c uadro de dilog o para introduc ir parm e tros


adic ionale s que s e trans fe rirn a la pe lc ula Shoc kwave . La pe lc ula
Shoc kwave de be r e s tar dis e ada para re c ibir e s tos parm e tros .

ID de fine e l parm e tro opc ional ID Ac tive X. El us o m s fre c ue nte de

Instituto de Computacin Activa de Mxico S. C. 52


MACROMEDIA DREAMWEAVER MX

e s te parm e tro e s la trans m is in de inform ac in e ntre c ontrole s


Ac tive X.

W s pac e y H s pac e e s pe c ific an e l nm e ro de pxe le s de e s pac io e n


blanc o que habr por e nc im a, por de bajo y a am bos lados de la
pe lc ula.

&255(2(/(&7521,&2

Corre o e le c trnic o Cuando e l us uario hac e c lic e n un vnc ulo de


c orre o e le c trnic o s e abre una ve ntana de m e ns aje e n blanc o
(utilizando e l prog ram a de c orre o as oc iado al nave g ador de l us uario).
En la ve ntana de m e ns aje de c orre o e le c trnic o, e l c am po Para s e
re lle na autom tic am e nte c on la dire c c in e s pe c ific ada e n e l vnc ulo.
Para c re ar un vnc ulo de c orre o e le c trnic o utilizando e l c om ando
Ins e rtar vnc ulo de c orre o e le c trnic o:

1 En la vis ta de Dis e o de la ve ntana de doc um e nto, s ite e l punto de


ins e rc in donde de s e a que apare zc a e l vnc ulo de c orre o e le c trnic o o
s e le c c ione e l te xto que de s e a m os trar c om o vnc ulo de c orre o
e le c trnic o. A c ontinuac in, lle ve a c abo una de e s tas ope rac ione s :

Elija Ins e rt >e m ail link

.
En la c ate g ora Com m on de l pane l ins e rt, e l boton de e m ail link.

2 En e l c am po Te xt de l c uadro de dilog o Ins e rtar vnc ulo de c orre o


e le c trnic o, e s c riba o e dite e l te xto que de s e a m os trar e n e l
doc um e nto c om o vnc ulo de c orre o e le c trnic o.

3 En e l c am po e m ail, e s c riba la dire c c in a la que s e de be r e nviar e l


c orre o e le c trnic o.

4 Hag a c lic e n OK.

Instituto de Computacin Activa de Mxico S. C. 53


MACROMEDIA DREAMWEAVER MX

Cue s tionario 6

1. - De finic in de c om portam ie nto

2. - Le ng uaje e n que s e g e ne ran los c om portam ie ntos

3. - Form atos de s onidos que s oporta Dre am we ave r

4. - Form atos de vide o que s oporta Dre am we ave r

5. - Ins truc c in que g e ne ra un Hipe rvnc ulo de c orre o


e le c tronic o

Instituto de Computacin Activa de Mxico S. C. 54


MACROMEDIA DREAMWEAVER MX

www.icam.com.mx

MACROMEDIA DREAMWEAVER
MX
CAPITULO 7
Al final del captulo el alumno ser capaz de...
Conoc e r que e s una bas e de datos
Cre ar una bas e de datos
Conoc e r que e s una tabla
Conoc e r que e s un c am po
Conoc e r tipo de c one xin
Cone c tar una bas e de datos
Vis ualizar re g is tros
Filtrar re g is tros
Utilizar los re c ords e t ins e rtion
Utilizar re c ords e t update form
Cre ar una pag ina de de talle m ae s tro
Cre ar un re pe at re g ion
Cre ar pag inas de log in c onfirm
Cre ar pag inas de re s tring pag e
Cre ar re dire c tion pag e
&RPSUXHEDWXDYDQFH\PDUFDFRQXQDPORVREMHWLYRVDOFDQ]DGRV

Instituto de Computacin Activa de Mxico S. C. 55


MACROMEDIA DREAMWEAVER MX

%$6('('$726 $3/,&$7,21

Una base de dat os es un conj unt o de inform acin relacionada con un


asunt o o con una finalidad. En Access, una base de dat os es un archivo
que puede cont ener t ablas donde se encuent ra t oda la inform acin sobre
un t em a especfico, consult as, form ular ios, inform es ent re ot ros. Tal com o
una coleccin de m sica, el cont rol de alum nos en un colegio o un
direct or io t elefnico.

&5($581$%$6('('$726(1$&&(66

Mic ros oft Ac c e s s proporc iona dos m todos para c re ar una bas e de
datos de Ac c e s s , Utilizando e l As is te nte para Bas e de datos , o bie n,
pue de c re ar una bas e de datos e n blanc o y, pos te riorm e nte , ag re g ar
las tablas , form ularios , inform e s y de m s obje tos que de s e e ; s te e s e l
m todo m s fle xible , pe ro re quie re de finir por s e parado c ada
e le m e nto de la bas e de datos . Cualquie ra que s e a e l m todo e le g ido,
%RWyQ
pue de m odific ar y am pliar la bas e de datos e n c ualquie r m om e nto
pos te rior a s u c re ac in.
Nuevo
Para c re ar una bas e de datos e n blanc o e xis te n los s ig uie nte s
m todos :

1. Me n Arc hivo / Nue vo

2. Hac e r c lic s obre la opc in Bas e de datos e n blanc o de l pane l de


tare as que apare c e a la de re c ha de la pantalla.

Instituto de Computacin Activa de Mxico S. C. 56


MACROMEDIA DREAMWEAVER MX

&21&(372'(81$%$6('('$726

El c om pone nte bs ic o de la bas e de datos e s e l re g is tro. Un re g is tro e s


un c onjunto de datos re lac ionados que s e tratan c om o una s ola
e ntidad. Por e je m plo, un tarje ta de ftbol podra c ons ide rars e un
re g is tro: c ontie ne e l nom bre , la fotog rafa, e l e quipo y las e s tads tic as
de un jug ador. Em ple ando la te rm inolog a propia de las bas e s de
datos , c ada uno de e s os e le m e ntos de inform ac in re c ibira e l nom bre
de c am po: c ada "re g is tro" de tarje ta de ftbol tie ne un c am po nom bre ,
un c am po fotog rafa, un c am po e quipo y varios c am pos de
e s tads tic as .

Al jue g o de re g is tros que c om parte n los m is m os c am pos s e le llam a


tabla, porque e s te tipo de inform ac in pue de pre s e ntars e fc ilm e nte
e n form ato de tabla: c ada c olum na re pre s e nta un c am po y c ada fila
re pre s e nta un re g is tro. De he c ho, la palabra c olum na e s s innim o de
la palabra c am po, y la palabra fila e s s innim o de la palabra re g is tro.

Una bas e de datos pue de c onte ne r m s de una tabla, c ada una de las
c uale s tie ne un nom bre e xc lus ivo. Es tas tablas pue de n e s tar
re lac ionadas o s e r inde pe ndie nte s e ntre s .

Un s ubc onjunto de datos e xtrados de una o m s tablas re c ibe e l


nom bre de jue g o de re g is tros . Un jue g o de re g is tros tam bi n e s una
tabla porque e s una c ole c c in de re g is tros que c om parte las m is m as
c olum nas . Por e je m plo, una aline ac in de un e quipo de ftbol e n la
que s e re lac ionan los nom bre s y las pos ic ione s de los jug adore s e n e l
c am po s e ra un jue g o de re g is tros : c ons ta de un s ubc onjunto de toda la
inform ac in pos ible s obre los jug adore s , inc luidos los g ole s las
as is te nc ias , las faltas , e tc .

Instituto de Computacin Activa de Mxico S. C. 57


MACROMEDIA DREAMWEAVER MX

7$%/$

Para c re ar un jue g o de re g is tros , s e re aliza una c ons ulta de bas e de


datos . Una c ons ulta c ons ta de c rite rios de bs que da. Por e je m plo, la
c ons ulta pue de e s pe c ific ar que s lo s e inc luy an alg unas de las
c olum nas e n e l jue g o de re g is tros , o que s lo s e inc luyan
de te rm inados re g is tros .
Las tablas s e c om pone n de filas y c olum nas de c e ldas que s e pue de n
re lle nar c on te xto y g rfic os . Las tablas s e utilizan a m e nudo para
org anizar y pre s e ntar inform ac in. Re s ulta til s abe r c m o s e
de nom inan las dive rs as parte s de una tabla. Colum na, Fila, Ce lda.

Instituto de Computacin Activa de Mxico S. C. 58


MACROMEDIA DREAMWEAVER MX

&$0326

Los c am pos o c olum nas de una Tabla ide ntific an e l tipo de dato que s e
alm ac e nara e n dic ha pos ic in, as i c om o e l nom bre de e s te .

REGISTRO

Conform a toda la inform ac in c orre s pondie nte a las filas de e s a tabla.

&21),*85$&,21'(6,7,2

A c ontinuac in s e de s c ribe la c onfig urac in de s is te m a m s s e nc illa


para us uarios de Windows .
Para c onfig urar e l s is te m a:

1 Si e s us te d us uario de Windows 95, 98 o NT Works tation, ins tale


Mic ros oft Pe rs onal We b Se rve r (PWS).
2 Si e s us te d us uario de Windows NT Se rve r o Windows 2000,
as e g re s e de que Inte rne t Inform ation Se rve r (IIS) e s t ins talado y e n
e je c uc in e n s u s is te m a.
IIS e s la ve rs in c om ple ta de PWS. Ya de be e s tar ins talado e n s u
s is te m a. Si no lo e s t, ins tle lo o s olic ite al adm inis trador de l s is te m a
que s e lo ins tale .
3 Si de s e a re alizar e l c urs o prc tic o para ColdFus ion, ins tale
ColdFus ion Se rve r e n e l s is te m a.
Para obte ne r ins truc c ione s .
4 Si de s e a re alizar e l c urs o prc tic o para JSP, ins tale los s ig uie nte s
c om pone nte s e n e l s is te m a.
Java 2 SDK, Standard Edition, para Windows
El c ontrolador JDBC-ODBC Bridg e de Sun s e ins tala autom tic am e nte
al ins talar SDK.
Un s e rvidor de aplic ac ione s que te ng a im ple m e ntada la
e s pe c ific ac in JavaSe rve r Pag e s 1. 0 de Sun.
5 Cre e una s ubc arpe ta e n la c arpe ta c :\ Ine tpub\ wwwroot y llm e la
MyTutorialSite .
Es ta e s la e s truc tura de c arpe tas c orre c ta:
c :\ Ine tpub\ wwwroot\ MyTutorialSite

Instituto de Computacin Activa de Mxico S. C. 59


MACROMEDIA DREAMWEAVER MX

6,7,2/2&$/

Para c onfig urar s itio loc al Dre am we ave r MX:

1.- e lija la opc ion de s ite > ne w s ite

2.- e n e l c uadro de dialog o e s pe c ifique e l nom bre de l s itio

nam e : nom bre de l s itio

loc al root flde r: ruta de ac c e s o a los arc hivo, donde s e g uardaran


todos los arc hivo

3. - oprim a e l ic ono c on form a de flde r para e s pe c ific ar la ruta una ve z


s e le c c ionada la c arpe ta pre s ione g uardar.

Nos re g re s ara al s itio donde e m pe zam os s olo hay que pre s ionar OK.

6,7,25(0272

Para c onfig urar s itio re m oto Dre am we ave r MX:

1 Inic ie Dre am we ave r y e lija Site > Ne w Site . Apare c e r e l c uadro de


dilog o De finir s itios .

2 Se le c c ione e l s itio de l c urs o prc tic o ASP, ColdFus ion o JSP


pre de finido y hag a c lic e n Editar.MX de fini los s itios de l c urs o
prc tic o durante la ins talac in.

3 Hag a c lic e n Datos re m otos y c om ple te e l c uadro de dilog o de la


s ig uie nte form a: Ac c e s o: Loc al/ Ne twork Carpe ta re m ota:
c :\ Ine tpub\ wwwroot\ MyTutorialSite

4 Si de s e a re alizar e l c urs o prc tic o de ASP, hag a c lic e n Se rvidor de


aplic ac ione s y c om ple te e l c uadro de dilog o de la s ig uie nte form a:
Mode lo de s e rvidor: ASP 2. 0. Le ng uaje de s e c ue nc ia de c om andos :
VBSc ript o JavaSc ript Exte ns in de pg ina: .as p Ac c e s o:
Loc al/ Ne twork Carpe ta re m ota: c :\ Ine tpub\ wwwroot\ MyTutorialSite
Pre fijo de URL: http:/ / loc alhos t/ MyTutorialSite . La bas e de datos de l
c urs o prc tic o e s un arc hivo de Mic ros oft Ac c e s s 97. No e s ne c e s ario
Mic ros oft Ac c e s s para re alizar e l c urs o prc tic o, aunque s ne c e s ita un
c ontrolador c apaz de le e r arc hivos de M ic ros oft Ac c e s s 97. El
c ontrolador pe rm ite a la aplic ac in We b le e r e l c onte nido de l arc hivo

Instituto de Computacin Activa de Mxico S. C. 60


MACROMEDIA DREAMWEAVER MX

de bas e de datos . (Para am pliar c onoc im ie ntos s obre c ontroladore s de


bas e s de datos .

Si e s us te d ing e nie ro de de s arrollo de ASP o ColdFus ion, de be r te ne r


ins talado un c ontrolador ODBC c apaz de le e r arc hivos de Ac c e s s 97 e n
e l s e rvidor ASP o ColdFus ion. Si s u s e rvidor We b s e e je c uta e n un
s is te m a Windows re m oto o loc al, e s probable que e l c ontrolador
ne c e s ario ya e s t ins talado. Para ave rig uar s i lo e s t, e lija Inic io >
Config urac in > Pane l de c ontrol e n Windows y bus que e l ic ono de
ODBC Data Sourc e s . (En func in de l s is te m a, e l ic ono tam bi n pue de
de nom inars e ODBC o 32bit ODBC. ) Si no e nc ue ntra e l ic ono,
de s c arg ue e ins tale M ic ros oft Data Ac c e s s Com pone nts (MDAC) 2. 5,
que ins talar e l c ontrolador de Ac c e s s . Si e l ic ono ODBC Data Sourc e s
e s t pre s e nte e n e l Pane l de c ontrol, hag a doble c lic e n l. Apare c e r
e l c uadro de dilog o ODBC Data Sourc e s Adm inis trator. Hag a c lic e n
la fic ha Drive rs para obte ne r una lis ta de c ontroladore s ins talados e n
e l s is te m a. Bus que e l c ontrolador M ic ros oft Ac c e s s Drive r, ve rs in 3. 5
o pos te rior. Si e l c ontrolador M ic ros oft Ac c e s s Drive r (*.m db) no
apare c e e n la lis ta, de s c arg ue e ins tale MDAC, que ins talar e l
c orre s pondie nte c ontrolador de Ac c e s s . Ante s de c om e nzar a c re ar e l
dire c torio de e m ple ados de Com pas s , de be r c re ar una c one xin c on
e l arc hivo de bas e de datos de l c urs o prc tic o, c om pas s trave l. m db.

Si ha ins talado Dre am we ave r e n un s is te m a Windows , durante la


ins talac in s e e s table c i e n e l s is te m a un DSN para la bas e de datos
de l c urs o prc tic o. De be r utilizar dic ho DSN s i e je c uta tam bi n e l
s e rvidor We b e n e l m is m o s is te m a (e s de c ir, s i utiliza Pe rs onal We b
Se rve r e n Windows o s i ins tal Dre am we ave r e n Windows NT Se rve r o
Windows 2000).

Si e l s e rvidor We b s e e je c uta e n un s is te m a Windows re m oto, pue de


de finir un nom bre de fue nte de datos (DSN) e n e l s e rvidor re m oto y
lue g o utilizar dic ho DSN e n Dre am we ave r para c re ar una c one xin de
bas e de datos s e nc illa. Un DSN e s una e s pe c ie de ac c e s o dire c to a una
bas e de datos . Para obte ne r ins truc c ione s s obre c m o de finir uno.

Instituto de Computacin Activa de Mxico S. C. 61


MACROMEDIA DREAMWEAVER MX

7,326'(&21(;,1'(%'

Si no s e ha de finido ning n DSN e n e l s is te m a que e je c uta e l s e rvidor


We b, de be r utilizar una c ade na de c one xin para c re ar la c one xin.

Para c re ar una c one xin de bas e de datos e n e l c as o de que s e haya


de finido un DSN e n e l s e rvidor We b:
1 e n e l pane l de ins e rt hag a c lic e n la pe s taa de applic ation y de un
c lic e n e l boton que dic e re c ords e t apare c e r e l c uadro de dilog o de
Cone xione s .
2 Hag a c lic e n de fine Nom bre de fue nte de datos (DSN) de l m e n
e m e rg e nte .
Apare c e r e l c uadro de dilog o Nom bre de fue nte de datos (DSN). En
c as o de no pare c e r la ve ntana e m e rg e nte hag a c lic e n ne w.

3 En e l c uadro Nom bre de c one xin, introduzc a c onnCom pas s .


Una prc tic a habitual c ons is te e n aadir e l pre fijo c onn a los nom bre s
de c one xione s para dis ting uirlos de los nom bre s de obje tos e n e l
c dig o.

Instituto de Computacin Activa de Mxico S. C. 62


MACROMEDIA DREAMWEAVER MX

4 Si e l s e rvidor de aplic ac ione s s e e je c uta e n e l e quipo loc al,


s e le c c ione Com pas s Trave l de la lis ta de DSN, y hag a c lic e n ok.
5 Si e l s e rvidor de aplic ac ione s s e e je c uta e n un e quipo re m oto,
introduzc a Com pas s Trave l e n e l c uadro Nom bre de fue nte de datos
(DSN).
6 Hag a c lic e n Done para finalizar la de finic in de la c one xin.
La nue va c one xin, c on Com pas s , apare c e r e n e l c uadro de dilog o
Cone xione s .
7 Hag a c lic e n ok para c e rrar e l c uadro de dilog o Cone xione s .
&21(;,1$/$%$6('('$726

Para c re ar una c one xin de bas e de datos para e l c urs o prc tic o ASP:
1 En Dre am we ave r, e lija Cone xione s de l pane l ins e rt e n la pe s taa
applic ation.
Apare c e r e l c uadro de dilog o Cone xione s .

2 Hag a c lic e n e l botn De fine y s e le c c ione Nom bre de fue nte de


datos (DSN) de l m e n e m e rg e nte .
Apare c e r e l c uadro de dilog o Nom bre de fue nte de datos (DSN). En
c as o de no apare c e r e l c uadro de las opc ione s de c lic e n botn que
Ne w, y de l m e n que apare c e de c lic e n DARA SOURCE NAME (DSN)
3 Introduzc a e l s ig uie nte nom bre para la nue va c one xin:
c onnCom pas s .
Una prc tic a habitual c ons is te e n aadir e l pre fijo c onn a los nom bre s
de c one xione s para dis ting uirlos de los nom bre s de obje tos e n e l
c dig o.
4 Se le c c ione Com pas s Trave l de la lis ta de DSN. Si apare c e e s c rbala
tal c ual.
Dre am we ave r c re e l DSN Com pas s Trave l durante la ins talac in.
5 Hag a c lic e n Te s t.
Dre am we ave r inte ntar c one c tar c on la bas e de datos . Si falla la
c one xin, c om prue be de nue vo e l DSN. Si la c one xin c ontina
fallando, c om prue be e l pre fijo de URL de l s e rvidor de aplic ac ione s .
Pre s ione OK

6 Hag a c lic e n Done .


La nue va c one xin de be apare c e r e n e l c uadro de dilog o Cone xione s .
7 Hag a c lic e n OK para c e rrar e l c uadro de dilog o Cone xione s . Un
s itio loc al indic a a Dre am we ave r e l lug ar e n e l que e s tn alm ac e nados
todos los doc um e ntos y arc hivos de un s itio We b c onc re to e n e l dis c o
loc al. De be de finir un s itio loc al para de s arrollar una aplic ac in We b
utilizando Dre am we ave r.
Pue de utilizar Dre am we ave r para de s ple g ar la aplic ac in e n un
s e rvidor We b m e diante la de finic in de un s itio re m oto. Un s itio
re m oto indic a a Dre am we ave r e l lug ar e n e l que e s tn alm ac e nados

Instituto de Computacin Activa de Mxico S. C. 63


MACROMEDIA DREAMWEAVER MX

todos los doc um e ntos y arc hivos de l s itio We b e n e l s e rvidor We b.

Para definir un sit io rem ot o, realice las siguient es t areas:

Defina una carpet a publicada en el servidor Web.

Defina la carpet a del sit io rem ot o en Dream weaver.

9,68$/,=$55(*,67526

Un jue g o de re g is tros e s un s ubc onjunto de datos e xtrados de una o


varias tablas de una bas e de datos . Ac ta a m odo de fue nte de datos
para las pg inas dinm ic as . De be r de finir un jue g o de re g is tros que
c onte ng a s lo los re g is tros de vue ltos por la bs que da. En e l c as o de un
c onjunto s im ple de pg inas de bs que da/ re s ultados , pue de c re ar e s te
tipo de jue g o de re g is tros de finie ndo un filtro.

De be r c om e nzar de finie ndo e l c ontorno g e ne ral de l jue g o de


re g is tros .
1 En e l m e n Site > Site file , hag a doble c lic e n e l arc hivo c onne c tion
s ituado bajo Carpe ta loc al.

Se abrir e n Dre am we ave r la pg ina de re s ultados s im ple para e l


dire c torio de e m ple ados de Com pas s .

2 En e l pane l Vinc ulac ione s de datos , hag a c lic e n e l botn de s ig no


m s (+ ) y s e le c c ione Re c ords e t (Que ry (c ons ulta) de l m e n
e m e rg e nte . Apare c e r e l c uadro de dilog o Jue g o de re g is tros s im ple .

3 En e l c uadro Nom bre , introduzc a Re s ults . Es te e s e l nom bre de l


jue g o de re g is tros . No lo c onfunda c on e l nom bre de arc hivo de la
pg ina. En e s te c as o, s e trata de l m is m o nom bre .

4 Se le c c ione la c one xin c onnCom pas s de l m e n e m e rg e nte


Cone xin.
Si no apare c e e n e l m e n, hag a c lic e n e l botn De fine para c re arla.

5 En e l m e n e m e rg e nte Tabla, s e le c c ione EMPLOYEES.

6 En e l re a Colum nas , hag a c lic e n la opc in Se le c c ionado para e le g ir


las c olum nas s e le c c ionadas de la table EMPLOYEES.

Instituto de Computacin Activa de Mxico S. C. 64


MACROMEDIA DREAMWEAVER MX

7 Pre s ione Control (Windows ) e n las s ig uie nte s c olum nas de la lis ta
para inc luirlas e n e l jue g o de re g is tros : EMPLOYEEID, FIRSTNAME,
LASTNAME, DEPARTMENT y EXTENSION. La pg ina de re s ultados
m ue s tra inform ac in de c uatro de e s tas c olum nas . De be inc luir la
c olum na EMPLOYEEID porque c ontie ne inform ac in que ide ntific a a
c ada re g is tro individual (inform ac in que s e r til m s ade lante
c uando c re e una pg ina de de talle ).

8 Hag a c lic e n Prue ba para c om probar e l jue g o de re g is tros .


Apare c e r un jue g o de re g is tros c on datos e xtrados de la tabla de la
bas e de datos . Hag a c lic e n Ac e ptar para c e rrarlo.

De form a pre de te rm inada, e l jue g o de re g is tros c ontie ne todos los


re g is tros de la tabla de la bas e de datos . De je abie rto por ahora e l
c uadro de dilog o Jue g o de re g is tros . Lo utilizar a c ontinuac in para
c re ar un filtro que e lim ine todos los re g is tros que no c um plan los
c rite rios de bs que da
Haga clic en Ok.
Dream weaver aade el j uego de regist ros a la list a de fuent es de dat os
disponibles en el panel Vinculaciones de dat os. Para ver los cam pos
definidos para el j uego de regist ros, am ple la ram a del j uego de regist ros.

 Arrast re cada uno de los cam pos hacia el area de la pagina

 Guarde el trabajo ()LOH!6DYH).

),/75$55(*,67526

para filtrar re g is tros s olo arras tre los c am pos a la hoja y lis to

5(&25'6(71$9,*$7,21%$5

La pg ina de re s ultados de be pe rm itir a los us uarios de s plazars e


hac ia de lante y hac ia atrs por la lis ta de re s ultados s i la bs que da
de vue lve m s de c inc o re g is tros . La pg ina de l c urs o prc tic o inc luye
las im g e ne s "Pre vious " (ante rior) y "Ne xt" (s ig uie nte ) para e s te fin.
Su trabajo c ons is te e n ac tivar e s tas im g e ne s de form a que , c uando e l
us uario hag a c lic e n e llas , la pg ina m ue s tre m s re s ultados (e n e l
c as o de que e xis tan).

1 Se le c c ione la im ag e n "Pre vious " e n la pg ina.

2 En e l pane l s e rve r be haviors , hag a c lic e n e l botn de s ig no m s (+ ) y

Instituto de Computacin Activa de Mxico S. C. 65


MACROMEDIA DREAMWEAVER MX

s e le c c ione Re c ords e t pag ing > m ove to pre vious re c ords e t.


Apare c e r e l c uadro de dilog o Move to pre vious re c ords e t.

3 En e l m e n e m e rg e nte Jue g o de re g is tros , as e g re s e de que e s t


s e le c c ionado e l jue g o de re g is tros de re s ultados y hag a c lic e n OK.
4 Re pita e l proc e dim ie nto para la im ag e n "Ne xt", c on la dife re nc ia de
que , e n e s ta oc as in, de be r s e le c c ionar Move to ne xt re c ords e t
5 Guarde e l trabajo (File > Save ).
Si c om e te alg n e rror, abra e l pane l Com portam ie ntos de l s e rvidor y
hag a c lic e n e l botn de s ig no m e nos (-) para borrarlo.

Si e s probable que las bs que das g e ne re n g ran c antidad de


re s ultados , pue de aadir un c ontador de re g is tros a la pg ina para
ayudar a los us uarios a c onoc e r e l lug ar e n e l que s e e nc ue ntran
de ntro de l jue g o de re g is tros .

5(&25'6(7,16(57,21)2506

La c ate g ora de Form s de l pane l Ins e rt c ontie ne botone s que pe rm ite n


c re ar form ularios e ins e rtar e le m e ntos de form ulario.

Los form ularios s on s im ple m e nte c onte ne dore s de e le m e ntos de


form ulario; los lm ite s de l form ulario no s on vis ible s e n la ve ntana de
doc um e nto a m e nos que s e s e le c c ione Vie w > vis ual aids > invis ible
e le m e nts .

Coloque e l punto de ins e rc in de ntro de los lm ite s de l form ulario


ante s de ins e rtar e l e le m e nto de form ulario; los e le m e ntos de
form ulario s ituados fue ra de las e tique tas form no apare c e n e n todos
los nave g adore s . Si inte nta ins e rtar un e le m e nto fue ra de l form ulario,
un c uadro de dilog o le pre g untar s i de s e a aadir una e tique ta de
form ulario alre de dor de dic ho e le m e nto. Hag a c lic e n S para c re ar un
form ulario que c onte ng a e l e le m e nto o e n No para ins e rtar e l e le m e nto
s in form ulario.

Form c oloc a un form ulario e n e l punto de ins e rc in.


Te x Fie ld c oloc a un c am po de te xto e n e l punto de ins e rc in.
Es table zc a e l nom bre , e l tam ao y e l valor inic ial e n e l ins pe c tor de
propie dade s .

Buttn c oloc a e n e l punto de ins e rc in un botn c on Subm it c om o valor


pre de te rm inado de las e tique tas nam e y vaule . Coloque e l punto de
ins e rc in de ntro de los lm ite s de l form ulario ante s de ins e rtar e l
botn; los botone s s ituados fue ra de l form ulario no apare c e n e n todos
los nave g adore s . Utilic e e l ins pe c tor de propie dade s para e s table c e r e l

Instituto de Computacin Activa de Mxico S. C. 66


MACROMEDIA DREAMWEAVER MX

nom bre , la e tique ta y la ac c in.

Che c k box c oloc a una c as illa de ve rific ac in e n e l punto de ins e rc in.


Es table zc a e l nom bre , e l valor de ac tivac in y e l e s tado inic ial e n e l
ins pe c tor de propie dade s .

Radio button c oloc a un botn de opc in e n e l punto de ins e rc in.


Es table zc a e l nom bre , e l valor de ac tivac in y e l e s tado inic ial e n e l
ins pe c tor de propie dade s .

Lis t m e nu c oloc a una lis ta o m e n e m e rg e nte e n e l punto de ins e rc in.


Es table zc a e l nom bre , e l tipo y los valore s inic iale s e n e l ins pe c tor de
propie dade s .

File fie ld c oloc a un c am po de arc hivo e n e l punto de ins e rc in.


Es table zc a e l nom bre , e l tam ao y e l valor inic ial e n e l ins pe c tor de
propie dade s . Cons ulte Pe rm itir a los vis itante s que c arg ue n un
arc hivo en su s e rvidor.

Im ag e fie ld c oloc a un c am po de im ag e n e n e l punto de ins e rc in.


Es table zc a e l nom bre , e l tam ao, e l te xto alte rnativo y e l arc hivo de
orig e n en el ins pe c tor de propie dade s .

Hidde n fie ld c oloc a un c am po oc ulto e n e l punto de ins e rc in.


Es table zc a e l nom bre y e l valor e n e l ins pe c tor de propie dade s .

Jum p m e nu c oloc a un m e n e m e rg e nte de URL e n e l punto de


ins e rc in. Al e le g ir un valor de e s te m e n, e l us uario s e tras lada al
URL. Es table zc a los valore s de la lis ta e n e l c uadro de dilog o que
apare c e .

'(/(7(5(&25'6(7

El s ig uie nte pas o c ons is te e n aadir e l c om portam ie nto de s e rvidor


Borrar re g is tro para ac tualizar la tabla de la bas e de datos c uando e l
us uario hag a c lic e n e l botn Subm it.
Para aadir un c om portam ie nto de s e rvidor para borrar la tabla de la
bas e de datos .

Instituto de Computacin Activa de Mxico S. C. 67


MACROMEDIA DREAMWEAVER MX

1 En e l pane l applc ation,hag a c lic e n la pe s taa de s e rve r be haviors ,


hag a c lic e n e l botn de s ig no m s (+ ) y s e le c c ione Ac tualizar re g is tro
e n e l m e n e m e rg e nte . Se le c c ione de le te re c ord. Apare c e r e l c uadro
de dilog o Borrar re g is tro.

2 Utilic e los m e ns c onte xtuale s c onne c tion y de le te from table para


e s pe c ific ar la tabla de la bas e de datos que c ontie ne los re g is tros que
s e van a borrar.

3 En e l m e n e m e rg e nte s e le c t re c ord from , e s pe c ifique e l jue g o de


re g is tros que c ontie ne e l re g is tro que s e va a borrar.

4 En e l m e n e m e rg e nte unique ke y c olum n, s e le c c ione una c olum na


de c lave (g e ne ralm e nte , la c olum na ID de l re g is tro) para ide ntific ar e l
re g is tro de la tabla de la bas e de datos .
Si e l valor e s un nm e ro, s e le c c ione la opc in Num ric o.
Ge ne ralm e nte , las c olum nas de c lave s lo adm ite n valore s
num ric os , pe ro tam bi n pue de n ac e ptar valore s de te xto.

5 En e l c uadro afte r de le ting g o to, introduzc a la pg ina que s e de be


abrir de s pu s de borrar e l re g is tro de la tabla.

6 En e l m e n e m e rg e nte de le ting by s ubm itting , e s pe c ifique e l


form ulario HTML que c ontie ne e l botn Subm it que e nva e l c om ando
de borrado al s e rvidor.
Dre am we ave r e le g ir autom tic am e nte e l prim e r form ulario de la
pg ina.
Haga clic en Ok.

5(&25'6(783'$7()250

Instituto de Computacin Activa de Mxico S. C. 68


MACROMEDIA DREAMWEAVER MX

Para aadir un c om portam ie nto de s e rvidor para ac tualizar la tabla de


la bas e de datos .

1 En e l pane l Se rve r be haviors , hag a c lic e n e l botn de s ig no m s (+ )


y s e le c c ione update re c ord e n e l m e n e m e rg e nte .
Apare c e r e l c uadro de dilog o Ac tualizar re g is tro.

2 Utilic e los m e ns c onte xtuale s Conne c tn y Table to update para


e s pe c ific ar la tabla de la bas e de datos que c ontie ne los re g is tros que
s e van a ac tualizar.

3 En e l m e n e m e rg e nte s e le c c re c ord from , e s pe c ifique e l jue g o de


re g is tros que c ontie ne e l re g is tro que apare c e e n e l form ulario HTML.

4 En e l m e n e m e rg e nte unique ke y c olum n, s e le c c ione una c olum na


de c lave (g e ne ralm e nte , la c olum na ID de l re g is tro) para ide ntific ar e l
re g is tro de la tabla de la bas e de datos .
Se le c c ione la opc in Num ric o s i e l valor e s un nm e ro.
Ge ne ralm e nte , las c olum nas de c lave s lo adm ite n valore s
num ric os , pe ro tam bi n pue de n ac e ptar valore s de te xto.

5 En e l c uadro afte r updating to g o, introduzc a la pg ina que s e de be


abrir de s pu s de ac tualizar e l re g is tro de la tabla.

6 En e l m e n e m e rg e nte g e t value from , e lija e l form ulario HTML


utilizado para e ditar los datos de l re g is tro.
UltraDe v e le g ir autom tic am e nte e l prim e r form ulario de la pg ina.

7 Es pe c ifique e l c am po de la tabla de la bas e de datos que ac tualizar


c ada obje to de l form ulario. Para e llo, s e le c c ione un obje to de
form ulario e n la lis ta Ele m e ntos de form ulario y e lija una c olum na de
la tabla e n e l m e n e m e rg e nte Colum na y e l tipo de datos
c orre s pondie nte e n e l m e n e m e rg e nte s ubm it as .
El tipo de datos indic a la c las e de datos que e s pe ra re c ibir la c olum na
de la tabla de la bas e de datos (te xto, num ric o, valore s boole anos de
c as illa de ve rific ac in). Por e je m plo, s i la c olum na de la tabla s lo
ac e pta valore s num ric os , e lija Num ric o e n e l m e n e m e rg e nte
s ubm it as .
Dic ho m e n inc luye dos tipos de datos de Fe c ha. Se le c c ione e l tipo de
datos Fe c ha MS Ac c e s s para las bas e s de datos Mic ros oft Ac c e s s y e l
tipo Fe c ha para c ualquie r otra bas e de datos .
Re pita e l m is m o proc e dim ie nto para c ada obje to de form ulario de la
lis ta Ele m e ntos de form ulario.
8 Hag a c lic e n OK.

Instituto de Computacin Activa de Mxico S. C. 69


MACROMEDIA DREAMWEAVER MX

%8648('$'(5(*,6752 48(5<$'$9$1&('

Bs que da de re g is tros
Cre ar la pg ina de bs que da

Una pg ina de bs que da e n la We b norm alm e nte c ontie ne c am pos de


form ulario e n los que los us uarios introduc e n parm e tros de
bs que da. Cuando e l us uario hac e c lic e n e l botn Bus c ar de l
form ulario, s e e nvan los parm e tros de bs que da a la pg ina de
re s ultados re s ide nte e n e l s e rvidor. La pg ina de re s ultados re s ide nte
e n e l s e rvidor, no la pg ina de bs que da de l nave g ador, e s la
re s pons able de re c upe rar los re g is tros de la bas e de datos .
Para c om e nzar c on e s ta parte de la aplic ac in We b, c re e dos pg inas :
una pg ina de bs que da que pe rm ita a los us uarios introduc ir
parm e tros de bs que da y una pg ina de re s ultados para m os trar los
re g is tros e nc ontrados . Pue de inc lus o c om binar las dos pg inas e n una
s ola. Com o m nim o, la pg ina de bs que da de be inc luir un form ulario
HTML c on un botn Enviar.
Para aadir un form ulario HTML a una pg ina de bs que da:

1 Abra la pg ina de bs que da y s e le c c ione Form s de l pane l ins e rt de


c lic e n e n e l obje to form .
Se c re ar un form ulario vac o e n la pg ina. Es pos ible que te ng a que
ac tivar los Ele m e ntos invis ible s (Vie w > vis ual aids > invis ible
e le m e nts ) para ve r los lm ite s de l form ulario, que s e re pre s e ntan
m e diante lne as de lg adas de c olor rojo.

2 Aada obje tos de form ulario para que los us uarios introduzc an s us
parm e tros de bs que da e lig ie ndo Obje tos de form ulario de l m e n
Ins e rtar.
Entre los obje tos de form ulario fig uran los c am pos de te xto, los m e ns
de lis tas , las c as illas de ve rific ac in y los botone s de opc in. Pue de
aadir tantos obje tos de form ulario c om o de s e e para ayudar a los
us uarios a de finir bs que das pre c is as . No obs tante , re c ue rde que
c uanto m ayor s e a e l nm e ro de parm e tros de bs que da de la pg ina
de bs que da, m s c om ple ja s e r la de c larac in SQL.
Para obte ne r m s inform ac in s obre e l ins pe c tor, c ons ulte "Cre ar
form ularios ", de Utilizac in de Dre am we ave r o la Ayuda de
Dre am we ave r (he lp >us ing Dre am we ave r).

3 Aada al form ulario un botn Enviar (Ins e rt > form s > Button).

4 Si lo de s e a, pue de c am biar la e tique ta de l botn Enviar

Instituto de Computacin Activa de Mxico S. C. 70


MACROMEDIA DREAMWEAVER MX

s e le c c ionando e l botn, abrie ndo e l pane l de prope rtie s (Windows >


Prope rtie s ) e introduc ie ndo un nue vo valor e n e l c uadro Etique ta.
Por e je m plo, e s te e s e l ins pe c tor de propie dade s de un botn c on la
e tique ta "bus c ar":

A c ontinuac in, de be r indic ar al form ulario e l lug ar al que de be


e nviar los parm e tros de bs que da c uando e l us uario hag a c lic e n e l
botn Subm it.

5 Se le c c ione e l form ulario e lig ie ndo la e tique ta < form > e n e l s e le c tor
de e tique tas que s e e nc ue ntra e n la parte infe rior de la ve ntana de
doc um e nto, c om o se m ue s tra en la im ag e n.

6 En e l c uadro Ac c in de l pane l de prope rtie s de l form ulario,


introduzc a e l nom bre de l arc hivo de la pg ina de re s ultados que
lle var a c abo la bs que da e n la bas e de datos .

7 En e l m e n e m e rg e nte m thod, e lija uno de los s ig uie nte s m todos


para de te rm inar c m o de be e nviar los datos e l form ulario al s e rvidor.

GET e nva los datos de l form ulario aadi ndolos al URL c om o una
c ade na de c ons ulta. Dado que los URL e s tn lim itados a 8. 192
c arac te re s , no utilic e e l m todo GET c on form ularios larg os .

POST e nva los datos de l form ulario e n e l c ue rpo de un m e ns aje .


De fault us a e l m todo pre de te rm inado de l nave g ador (g e ne ralm e nte ,
GET).

Ya ha te rm inado la pg ina de bs que da. A c ontinuac in de be r c re ar


la pg ina de re s ultados .
Una ve z que e l us uario introduzc a los parm e tros de bs que da, la
aplic ac in de be r re c upe rar los re g is tros de la bas e de datos . Es ta
tare a la re aliza la pg ina de re s ultados .
Es tas s on las tare as que re aliza una pg ina de re s ultados :
Obtie ne los parm e tros de bs que da de la pg ina de bs que da.
Cone c ta c on la bas e de datos y bus c a re g is tros .
Cre a un jue g o de re g is tros a partir de los re g is tros e nc ontrados .
Mue s tra e l c onte nido de l jue g o de re g is tros .

Si la pg ina de re s ultados s lo tie ne un parm e tro de bs que da (un


s olo c am po de te xto, por e je m plo), podr c re ar la pg ina de re s ultados
s in c ons ultas ni variable s SQL. Lo nic o que te ndr que hac e r e s c re ar
un jue g o de re g is tros y de s pu s aadir un filtro para e xc luir re g is tros

Instituto de Computacin Activa de Mxico S. C. 71


MACROMEDIA DREAMWEAVER MX

que no c um plan las c ondic ione s e s table c idas por los parm e tros de
bs que da e nviados por la pg ina de bs que da.

Si la pg ina de bs que da e nva m s de un parm e tro de bs que da al


s e rvidor, de be r e s c ribir una c ons ulta SQL para la pg ina de
re s ultados y utilizar los parm e tros de bs que da e n las variable s SQL.

De s pu s de que Dre am we ave r ins e rte la c ons ulta SQL e n la pg ina y


que s e e je c ute la pg ina e n e l s e rvidor, s e c om prue ba c ada re g is tro de
la tabla de la bas e de datos . Si e l c am po e s pe c ific ado e n un re g is tro
c um ple las c ondic ione s de la c ons ulta SQL, e l re g is tro s e inc luir e n
un jue g o de re g is tros . La c ons ulta SQL c re a un jue g o de re g is tros que
c ontie ne s olam e nte los re s ultados de la bs que da.

Por e je m plo, e l pe rs onal de ve ntas pue de e s tar e n c ondic ione s de


inform ar s obre qu c lie nte s de un re a de te rm inada tie ne n ing re s os
s upe riore s a un nive l c onc re to. En un form ulario de una pg ina de
bs que da, e l as oc iado c om e rc ial introduc e un re a g e og rfic a y un
nive l de ing re s os m nim o y lue g o hac e c lic e n e l botn Enviar para
e nviar los dos valore s a un s e rvidor. En e l s e rvidor, los valore s s e
pas an a la de c larac in SQL de la pg ina de re s ultados , que c re a un
jue g o de re g is tros s lo c on los c lie nte s de l re a e s pe c ific ada c on
ing re s os s upe riore s al nive l e s pe c ific ado.

0$67(5'(7$,/3$*(6(7

Instituto de Computacin Activa de Mxico S. C. 72


MACROMEDIA DREAMWEAVER MX

Una pg ina m ae s tra e s una pg ina e n la que s e lis tan los re g is tros y
los c orre s pondie nte s vnc ulos de c ada re g is tro. Cuando e l us uario
hac e c lic e n un vnc ulo, s e abre una pg ina de talle que m ue s tra
inform ac in adic ional s obre e l re g is tro. Por e je m plo, a c ontinuac in
s e m ue s tra una pg ina m ae s tra de un s itio de Intrane t de una e m pre s a
fic tic ia:

Cuando un us uario hac e c lic e n uno de los ic onos de vis ualizac in


vinc ulados , s e abre una pg ina de talle :

Una pg ina de re s ultados e s un e je m plo tpic o de pg ina m ae s tra. Sin


e m barg o, a dife re nc ia de la pg ina m ae s tra de s c rita e n e s te te m a, la
lis ta de re g is tros de una pg ina de re s ultados la de te rm ina, no us te d
c om o dis e ador, s ino e l us uario. (El us uario de te rm ina la lis ta
m e diante la re alizac in de una bs que da e n la bas e de datos . ) Para
obte ne r m s inform ac in s obre e s te tipo de pg ina m ae s tra.

Pue de utilizars e una pg ina de talle para ac tualizar o borrar e l re g is tro


m os trado. Para obte ne r m s inform ac in s obre la ac tualizac in y
e lim inac in de pg inas .
Una pg ina m ae s tra c ons ta de los s ig uie nte s e le m e ntos :
Un jue g o de re g is tros .
Una diag ram ac in de pg ina para m os trar m ltiple s re g is tros .
Un c om portam ie nto de s e rvidor Ir a pg ina De talle para abrir la
pg ina de talle y pas ar e l ID de l re g is tro e n e l que ha he c ho c lic e l
us uario.
Una pg ina de talle c ons ta de los s ig uie nte s e le m e ntos :
Una diag ram ac in de pg ina para m os trar un nic o re g is tro.
Un jue g o de re g is tros que c onte ng an los datos de l re g is tro.
Un filtro de jue g o de re g is tros para re c upe rar un re g is tro c onc re to de
la tabla de la bas e de datos o un c om portam ie nto de s e rvidor Move r a
un re g is tro c onc re to para de s plazars e a un re g is tro c onc re to de l jue g o
de re g is tros
Tras aadir un jue g o de re g is tros a una pg ina m ae s tra vac a, pue de
c om ple tar e l jue g o de pg inas Mae s tro/ De talle e n una s ola ope rac in
utilizando e l obje to Live Jue g o de pg inas Mae s tro/ De talle . El obje to
Live aade los s ig uie nte s e le m e ntos a la pg ina m ae s tra:
Una tabla bs ic a c on una re g in re pe tida para m os trar m ltiple s
re g is tros .
Una barra de nave g ac in por e l jue g o de re g is tros .
Un c ontador de re g is tros .
Un c om portam ie nto de s e rvidor Ir a pg ina De talle para abrir la
pg ina de talle y pas ar e l ID de l re g is tro e n e l que ha he c ho c lic e l
us uario.
El obje to Live tam bi n c re a una pg ina de talle s i no la ha c re ado
ante riorm e nte y aade a e lla los s ig uie nte s e le m e ntos :
Una tabla bs ic a para m os trar un nic o re g is tro.
Un jue g o de re g is tros filtrado para loc alizar y m os trar e l re g is tro e n
e l que e l us uario ha he c ho c lic e n la pg ina m ae s tra.

Instituto de Computacin Activa de Mxico S. C. 73


MACROMEDIA DREAMWEAVER MX

De s pu s de que e l obje to Live c oloque los e le m e ntos m e nc ionados e n


las pg inas , podr utilizar las he rram ie ntas de dis e o de pg inas de
UltraDe v para pe rs onalizar e l dis e o de las pg inas o e l pane l
Com portam ie ntos de l s e rvidor para e ditar los c om portam ie ntos de l
s e rvidor.

Para c om ple tar e l jue g o de pg inas Mae s tro/ De talle c on un


obje to Live :

Instituto de Computacin Activa de Mxico S. C. 74


MACROMEDIA DREAMWEAVER MX

1 Cre e una pg ina m ae s tra vac a y aada a e lla un jue g o de re g is tros .


As e g re s e de que e l jue g o de re g is tros c ontie ne , no s lo todas las
c olum nas ne c e s arias para la pg ina m ae s tra, s ino tam bi n todas las
c olum nas ne c e s arias para la pg ina de talle .

2 Abra la pg ina m ae s tra e n la vis ta de Dis e o e n e l pane l de ins e rt


e lija m as te r de tail pag e s e t.
Aparecer el cuadro de dilogo I nsert ar j uego de pginas Maest ro/ Det alle.

En el m en em ergent e recordset , asegrese de que est elegido el j uego


de regist ros que cont iene los regist ros que desea visualizar en la pgina
m aest ra.

4 En e l re a Mas te r pag e fie ld, s e le c c ione las c olum nas de l jue g o de


re g is tros que de be n vis ualizars e e n la pg ina m ae s tra.
De form a pre de te rm inada, Dre am we ve r s e le c c iona todas las
c olum nas de l jue g o de re g is tros . Si e l jue g o de re g is tros c ontie ne una
c olum na de c lave e xc lus iva, c om o, por e je m plo, re c ordID,
s e le c c ine la y hag a c lic e n e l botn de s ig no m e nos (-) para que no
apare zc a e n la pg ina.

5 Si de s e a c am biar e l orde n e n e l que apare c e n las c olum nas e n la


pg ina m ae s tra, s e le c c ione una c olum na de la lis ta y hag a c lic e n la
fle c ha arriba o abajo.
En la pg ina m ae s tra, las c olum nas de l jue g o de re g is tros e s tn
dis pue s tas horizontalm e nte e n una tabla. Al hac e r c lic e n la fle c ha

Instituto de Computacin Activa de Mxico S. C. 75


MACROMEDIA DREAMWEAVER MX

arriba, s e de s plaza la c olum na hac ia la izquie rda; al hac e r c lic e n la


fle c ha abajo, s e de s plaza la c olum na hac ia la de re c ha.

6 En e l m e n e m e rg e nte link to de atil from de s de , e lija la c olum na de l


jue g o de re g is tros que m os trar un valor que tam bi n s e rvir c om o
vnc ulo c on la pg ina de talle .
Por e je m plo, s i de s e a que c ada nom bre de produc to de la pg ina
m ae s tra te ng a un vnc ulo c on la pg ina de talle , e lija la c olum na de l
jue g o de re g is tros que c ontie ne los nom bre s de los produc tos .

7 En e l m e n e m e rg e nte pas s unique ke y, e lija la c olum na de l jue g o


de re g is tros que c ontie ne valore s que ide ntific an a los re g is tros .
Norm alm e nte , la c olum na e le g ida e s la que c ontie ne e l nm e ro de ID.
Es te valor s e pas a a la pg ina de talle para que pue da ide ntific ar e l
re g is tro e le g ido por e l us uario.

8 Es pe c ifique e l nm e ro de re g is tros que de be n m os trars e e n la opc in


de s how.

9 En e l c uadro De tail pag e Nam e , hag a c lic e n Brows e y loc alic e e l


arc hivo de pg ina de talle que ha c re ado o introduzc a un nom bre para
que e l obje to Live la c re e autom tic am e nte .

10 En e l re a Cam pos de pg ina De talle , s e le c c ione las c olum nas que


de be n vis ualizars e e n la pg ina de talle .
De form a pre de te rm inada, Dre am we ave r s e le c c iona todas las
c olum nas de l jue g o de re g is tros de la pg ina m ae s tra. Si e l jue g o de
re g is tros c ontie ne una c olum na de c lave e xc lus iva, c om o, por
e je m plo, re c ordID, s e le c c ine la y hag a c lic e n e l botn de s ig no
m e nos (-) para que no apare zc a e n la pg ina de talle .

11 Si de s e a c am biar e l orde n e n e l que apare c e n las c olum nas e n la


pg ina de talle , s e le c c ione una c olum na de la lis ta y hag a c lic e n la
fle c ha arriba o abajo.
En la pg ina de talle , las c olum nas de l jue g o de re g is tros e s tn
dis pue s tas ve rtic alm e nte e n una tabla. Al hac e r c lic e n la fle c ha
arriba, s e de s plaza la c olum na hac ia arriba; al hac e r c lic e n la fle c ha
abajo, s e de s plaza la c olum na hac ia abajo.

12 Hag a c lic e n OK.


El obje to Live c re a una pg ina de talle (s i no la ha c re ado us te d ante s ) y
aade c onte nido dinm ic o y c om portam ie ntos de s e rvidor tanto a la
pg ina m ae s tra c om o a la pg ina de talle .

13 Pe rs onalic e las pg inas m ae s tra y de talle para adaptarlas a s us


ne c e s idade s .
Pue de pe rs onalizar totalm e nte e l dis e o de am bas pg inas utilizando
las he rram ie ntas de dis e o de pg inas de Dre am we ave r. Tam bi n
pue de e ditar los c om portam ie ntos de s e rvidor hac ie ndo doble c lic e n

Instituto de Computacin Activa de Mxico S. C. 76


MACROMEDIA DREAMWEAVER MX

e llos e n e l pane l Com portam ie ntos de l s e rvidor.

5(&25'6(71$9,*$7,2167$786

El botn de re c ords e t navig ation s tatus pe rm ite ve r la pos ic in ac tual


de la pg ina que tie ne la bas e de datos .
Por e je m plo
1 de 1 de 10, nos dic e que e s tam os e n e l prim e r re g is tro de 10 que
te ne m os .

5(3($75(*,21

La opc in de re pe at re g ion pe rm ite e s pe c ific ar c uantas ve c e s s e


re pe tir la re g in s e le c c ionada de una c one xin de bas e de datos .

 /2*,1&21),50

Instituto de Computacin Activa de Mxico S. C. 77


MACROMEDIA DREAMWEAVER MX

Para e s table c e r un log in c onfirm de be r te ne r tre s hojas e n m odo de


vis ta dis e o.
Para c re ar un log in c onfirm s ig a las s ig uie nte s intruc c ione s

1.- re alic e s u c one xin a una bas e de datos (ve as e tipos de c one xin)
2. - c re e un form ulario c on las s ig uie nte s nom bre s
introdus c a un form
de ntro de l form e s c riba us uario, ins e rte un te xtfie ld
de nue vo de ntro de l form e s c riba c ontras e a e introdus c a un s e g undo
te xtfie ld
ins e rte un button
3.- s e le c c ione e l te xtfie ld de la e tique ta de c ontras e a y e n e l pane l de
prope rtie s s e le c c ione pas word.
4.- vaya al pane l de s e rve r be haviors pre s ione le s ig no (+ ) y de la lis ta
de s ple g able s e le c c ione us e r authe ntific ation > log in us e r apare c e r
un c uadro de dialog o.
5. - ve rifique que los te xtfie ld apre s an e n form a ode nada
6. - En e l c uadro de Validate us ing c onne c tion pre s ione la ve ntana
de s ple g able para s e le c c ionar la bas e de datos .
En e l c am po if log in s uc c e e ds , g o to e s pe c ific a pag ina que s e abrir e n

Instituto de Computacin Activa de Mxico S. C. 78


MACROMEDIA DREAMWEAVER MX

c as o de que s e a c orre c ta la c ontras e a.


En c am po de if log in fails , g o to:- e s pe c ific a la pag ina que s e abrir e n
c as o de que la c ontras e a s e a e rrne a.

 5(675,1*3$*(

Una ve z te rm inado de c re ar pag ina de l us uario, abra e l doc um e nto de


us uario o la pag ina que va ac c e de r e l us uario e n c as o de que s u
c ontras e a s e a c orre c ta , e n e s te doc um e nto lo vam os a re s tring ir:
Para re s tring ir e l ac c e s o a una pg ina hag a lo s ig uie nte .

1. - abra e l doc um e nto


2. - hag a la c one xin a la bas e de datos
3. - una ve z he c ha la c one xin vaya al pane l de applic ation y pre s ione
la pe s taa que dic e s e rve r be haviors
4. - pre s ione e l s ig no (+ ) de l m e n de s ple g able s e le c c ione
authe ntific ation> Re s tric t ac c e s to pag e ,
e n e l c uadro de dialog o ac tive la opc in que dic e Re s tric t bas e d on.
5. - e n e l c am po de if ac c e s s de nie d, g o ot.
Es pe c ifique la pag ina que s e abrir.

 5(',5(&7,213$*(

Instituto de Computacin Activa de Mxico S. C. 79


MACROMEDIA DREAMWEAVER MX

pue de s re dire c c ionar una pag ina pas ado un tie m po c on las e tique tas
META.
e je m plo

< he ad>
< m e ta http-e quiv=re fre s hc onte nt= 15;URL= www. ibm .c om >
< title >pag ina re dire c c ionada a IBM a los 15 s e g undos < title >
< / he ad>

Instituto de Computacin Activa de Mxico S. C. 80


MACROMEDIA DREAMWEAVER MX

Cue s tionario 7

1. - Conc e pto de :
Bas e de datos
Tabla
Cam po
Re g is tro

2. - De finic in de re c ords e t

3. - Que e s ODBC

4. - Utile ra de Windows para c onfig urar DNS de s is te m a

5. - De finic in e ntre DNS de s is te m a y DNS de us uario

6. - Que s ig nific a SQL

7. - Que e s un form ulario

8. - De finic in e ntre m todo POST y GET

Instituto de Computacin Activa de Mxico S. C. 81

También podría gustarte